Netbeans IDE 7.2 Look and Feel on Ubuntu 12.04


NetBeans tips for java developers:

NetBeans IDE 7.2 has been released. This is the fastest version of NetBeans. I like NetBeans IDE. NetBeans has many good features, especially compared to Eclipse in Swing / JavaFX development. But NetBeans has ugly Look and Feel on Ubuntu. NetBeans GTK Look and Feel has a lot of chopping. Metal Look and Feel is too bad. I like clean and smart UI. That’s why I always use NetBeans IDE with Nimbus Look and Feel on Ubuntu. Better than Metal and GTK Look and Feel.

Nimbus Look and Feel setting is simple in NetBeans.

  • Edit netbeans.conf file (in netbeans-7.2 / etc directory by me)
  • include the option –laf between the quotation marks in the line beginning netbeans_default_options:
netbeans_default_options="-J-client -J-Xss2m
-J-Xms32m -J-XX:PermSize=32m -J-Dapple.laf.useScreenMenuBar=true -J-Dsun.java2d.noddraw=true

Happy coding in NetBeans!

Less Css Framework in JSF 2

less cssLESS is the dynamic stylesheet language. Twitter Bootstrap uses it internally. It is similar in structure Saas. An introduction to LESS and comparison to Sass can be found here.

I wanted to use LESS in JSF 2. LESS installation is easy but in JSF 2 necessary to make settings.

I have resources folder in the root of my web application (same folder level with “WEB-INF” folder). A tutorial Resources in JSF 2 can be found here.

All my css and javascripts are under the resources.

LESS installation in html:

<link rel="stylesheet/less" type="text/css" href="styles.less">
<script src="less-1.3.0.min.js" type="text/javascript"></script>

I am writing with JSF 2 tags in index.xhtml:

<h:outputStylesheet name="common.less" library="css" />
<h:outputScript name="less-1.3.0.min.js" library="javascript" target="body" />

Target parameter gets “head” oder “body”, better use “body” parameter then less-1.3.0.min.js rendered in body.

But in JSF 2 does not work. LESS need rel="stylesheet/less" but h:outputStylesheet gets rel="stylesheet" from common.less. And common.less file is not rendered as css file.

If your servlet-mapping as below:

  <servlet-name>Faces Servlet</servlet-name>
<!-- use in index.xhtml -->
<link rel="stylesheet/less" href="/PROJECTNAME/faces/javax.faces.resource/common.less?ln=css" />

if your servlet-mapping with xhtml:

  <servlet-name>Faces Servlet</servlet-name>
<!-- use in index.xhtml -->
<link rel="stylesheet/less" href="/PROJECTNAME/javax.faces.resource/common.less.xhtml?ln=css" />

I am using with *.xhtml format, all together:

<!-- in web.xml -->
<servlet-name>Faces Servlet</servlet-name>

<!-- in index.xhtml -->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- TODO use in production compiled css file from less file -->
<link rel="stylesheet/less" href="/PROJECTNAME/javax.faces.resource/common.less.xhtml?ln=css" />
<!-- first less file than less javascript -->
<h:outputScript name="less-1.3.0.min.js" library="javascript" target="body" />

If it works then your common.less file rendered as Css in index.xhtml.

If you get mime type warning for LESS file in Glassfish as below:

WARNING: JSF1091: No mime type could be found for file common.less. To resolve this, add a mime-type mapping to the applications web.xml.

Add LESS file mime type in web.xml in your project.


LESS file support in Netbeans 7.1.2:

LESS syntax is so similar to CSS. You can add new file extension in Tools > Options > Miscellaneous > Files, Click new file extension as less and Associated File Type text/x-css

LESS file support in Eclipse Indigo:

Preferences > General > Content Types > Text > CSS, and add Content type:*.less then

Preferences > General > Editors > File Associations, click on Add button and set File type: *.less, and then in the Associated editors box below set the CSS Editor as default.