As though Google Web Toolkit (GWT)’s “AJAX without pain” approach is not already tempting; after the way it accomplishes this task and a few extra things it does for us, we have the perfect recipe for love at first sight.

What is GWT?
GWT is a compiler that takes your Java code and converts it into an Ajax application. The resulting Ajax application supports major browsers, without you as the developer have to worry about. Besides doing this conversion, GWT supplies a number of UI widgets and manages the complications of those asynchronous remote calls with the server.

Reasons to love it
So far so good; GWT has attracted our attention, now it will catch our hearts. Here I’d like to give you a personal account of a few things that explains how it caught mine.

Room for good practices
Although GWT, quite understandably, supports only part of Java; it supports enough to “make our code feel good”. We have object hierarchies, separation of concerns, information hiding and a chance to properly organize our code.

Let’s take an example and have some play with it. The first version is an “entry point” class that sets up the UI. It consists of two panels and the code to initialize those panels, plus the click/action listener implementations that we don’t want to list here.

public class MySweetApp implements EntryPoint { 
private DockPanel panel; 
 
 public void onModuleLoad() { 
  panel = new DockPanel(); 
  panel.add(buildActionPanel(), panel.SOUTH); 
  panel.add(buildContentPanel(), panel.WEST); 
  // Extra code to fill the content panel with data from RPC 
  ... 
  ... 
  RootPanel.get("slot").add(panel); 
  } 
  private HorizontalPanel buildActionPanel() { 
  HorizontalPanel actions = new HorizontalPanel(); 
  actions.setSpacing(10); 
  Button clear = new Button("Clear"); 
  clear.addClickListener(new ClearClickListener()); 
  ... 
  ... 
  private HorizontalPanel   ...

Now we will move the panels into what is called a Composite class in GWT. Our EntryPoint class will do what it has to do, that is to set up the top UI structure.

public class MySweetApp implements EntryPoint { 
private HorizontalPanel outer; 
private ActionSection actionSection; 
private ContentSection contentSection; 
public void onModuleLoad() { 
// panel constructors called below 
.. 
outer.add(actionSection); 
outer.add(contentSection); 
RootPanel.get("slot").add(outer); 
  } 
}

that’s all for EntryPoint and we have two Composites like the example below

 public class ActionSection extends Composite implements ClickListener{ 
... 
public ActionSection() { 
  HorizontalPanel actions = new HorizontalPanel(); 
  actions.setSpacing(10); 
  Button clear = new Button("Clear"); 
  ... 
  initWidget(actions); 
} 
... 
public void onClick(Widget sender) { 
... 
} 
}

By moving code to where it belongs, we have a more appropriate code structure and GWT helped us accomplish this with its Java support and build-in components like Composite.

Working with Java objects & collections
It is relieving to escape the “not all Java types can be converted to JavaScript” limitation.
A good example is to see it in the context of a Remote Procedure Call (RPC).

Below you’ll find:
• a client side Java domain object
• the service implementation code on the server side
• and the client code to handle the callback (that is what happens when our asynchronous call returns).
As you see we work with Java objects and Collections all the way around the code, at both sides.

domain object (client side, to be finally converted to JS)

import com.google.gwt.user.client.rpc.IsSerializable; 
public class Customer implements IsSerializable{ 
private String name;
... 
}

service implementation (servlet)

import com.google.gwt.user.server.rpc.RemoteServiceServlet; 
public class CustomerServiceImpl extends RemoteServiceServlet implements 
CustomerService{ 
public List getAllCustomers() { 
// interesting code to return list of Customer objects here 
..... 
} 
}

callback class (client side, inside another component. This is going to become JS too)

... 
private class CustomerCallBack implements AsyncCallback { 
public void onFailure(Throwable caught) {//logging ...} 
public void onSuccess(Object result) { 
List customers = (List) result; 
// do interesting things with the List of Customers 
// update a panel (composite) for example 
MySweetApp.get().getContentSection().updateCustomerList(customers); 
... 
} 
} 
}

The last example, the callback class, also demonstrates Exception Handling at the client side. As this code will run on a client machine under a network connection, for the sake of quality it helps to have a direct support for handling cases of inevitable problems.

Debuging support
GWT enables development in a so-called “hosted mode” which is basically inside your IDE (Eclipse and IDEA is supported a.f.a.i.k). And there is even an embedded Tomcat instance included. You can test and debug all code, both client code which will eventually become JavaScript and also the server code, inside a Java IDE which makes fixing things easier and faster.

This means we, Java developers are on our own terrain in fighting bugs. The exhibit above is an example of what a breakpoint inserted in code will give you in Eclipse debug mode.

Command line tools for workspace generation
Are you also not-like some of us who at least don’t mind or even enjoy setting up workspaces? So you’ll appreciate that, another thing GWT does for us, is to help create an Eclipse project and an Ant build file.

Here we can use projectCreator script with -ant and -eclipse flags passed to it, and we can also use applicationCreator that creates a sample application with the general structure already set. A nice detail on part of Google.

Conclusion
Who can know what really makes our hearts tick? Is it “the hair” or is it “the eyes”? With GWT you don’t look for much reason, it just feels love!