Share / Save this...

Share/Bookmark

2010-06-25

GWT + Struts 1.x + Netbeans Tutorial (Part 3)




<c:choose>
     <c:when test="${user.likes}"
          Share this with your friends
     </c:when>
     <c:otherwise>  
          Send me feedback.
     </c:otherwise>
<:choose>
oDesk Certified Java Developer

Part 3: Add the Google Web Toolkit framework to Netbeans.

TL;DR: It's nice to have regular page navigation and GWT features together. Scroll down to the red link.

The Google Web Toolkit (from now on GWT) is a framework that allows you to write your user interface (from now on Client) in the Java programming language and then does a cross-compilation into JavaScript. What it means is that you can create your user interface as you would do in a Swing style application and the framework translates that into the native user interface for each web browser supported (e.g. in Opera, Safari, Internet Explorer, Firefox a GWT button is a real BUTTON element in HTML so the native rendering is preferred on top of a virtual widget that behaves like a button like a DIV with an "onclick" method defined or other combinations of elements).

It comes with a few command-line tools such as the webAppCreator and the i18nCreator which let's you kick-start any project with GWT support and add I18N support to a new or existing project, respectively. It has a nice feature called Hosted Mode which let's you debug and test your code against a browser of your choice by installing a plug-in to said browser (as of now it supports Apple Safari, Microsoft Internet Explorer, Mozilla Firefox and obviously Google Chrome). Sadly it doesn't support Opera (doesn't have a plug-in yet). I test in Opera and other browsers, but the process of changing or adding a few lines of code and then firing up 5 browsers is a time-consuming and resource-wasting task. I have my personal philosophy in which i test the development code in IE (the most problematic from my point of view) and then rely on the capabilities of GWT to behave consistently in the same way across all other browsers.

GWT lets you harness the capabilities of AJAX in a simple and elegant way. Once you know how to create services and implement them, it becomes a real time-saver when it comes to changing just a small portion of the Client or even uploading the files The Google Way. I like having options and i like having the ability of changing just a small part of a web page or completely forwarding or redirecting the Client to another view. I've seen whole applications that behave like desktop applications and although it can be a nice way to present your layout, it can also be mind-boggling to the regular novice user.  

Usability Engineering Principles by Jakob Nielsen (pictured) is a nice lecture on this topic. Users feel somewhat safe with what they currently use, so the change to a full desktop-like application inside a web browser should not make them feel like they're learning anything. A normal user can remember 7 items in average, but when they feel they're learning they reset the counter to make room for the new information.

Enough chit-chat, let's focus on our topic and let's add the GWT framework to Netbeans.  
  1. Download the GWT SDK here and save it to an easy-to-find location as usual.
  2. Unpack the file using your favorite utility (7zip). 
  3. Open Netbeans and click on "Tools" on the menubar.
  4. Select "Plugins" and the plug-in dialog opens.
  5. Click on "Available plugins" tab.
  6. On the Search box type "GWT4NB".
  7. Check the check-box of the plug-in named GWT4NB.
  8. Click the "Install" button at the bottom.

After installing the plugin you will have the option of adding GWT framework support to your new or existing Java Web applications. When you choose to add the GWT support to the application you will be prompted to enter the location of the GWT SDK which you downloaded earlier (and which you unpacked to an easy-to-find location, remember?).

That's all there is to installing the GWT framework to Netbeans.

If you have any suggestions, ideas for systems integration (sb) or comments, leave a message below.

I would appreciate if you could Share this with your friends



No comments:

Post a Comment

Hits