Google Web Toolkit: AJAX Buzz Meets Real World Development : Page 2

Get to Know 'AJAX With Ease'

Now, download and unzip the source code for this article. The file contains source code, project- and application-creating scripts, and Apache Ant build files for the 'AJAX With Ease' application. To keep it simple, the application provides a self-contained example for each of the main GWT features. ("Sidebar 2. The AJAX With Ease Project Files" provides detailed information on the AJAX With Ease application, the project creation scripts, and the build.xml and gwt-user-wo-javax.jar (albeit a hack) files needed for Apache Tomcat deployments.)

Import the application into Eclipse from the menu as follows: File -> Import -> Existing Projects Into Workspace -> Select the ajaxwithease folder -> Select ajaxwithease project -> Click finish. Once it's imported, you will see folders and files in Eclipse as shown in Figure 1.

Now run the application in debug mode. The debug button (the one with a critter on it) will launch GWT Host Browser as shown in Figure 2. Your entire Web application is available in this host browser, which is integrated into Eclipse via JVM hooks. You can now place breakpoints in Eclipse and hit on them by running the application in the host browser.

Using the AJAX With Ease application is quite simple. The Styles tab shows how a style applied to a button at runtime changes its appearance; the RPC tab shows how the title and name entered in text boxes are received and responded to with a 'hello' greeting; and the History tab shows how tokens are added to a URL when the user enters any value in a text box and presses the Add to History button, to be retrieved only when the user clicks the browser's front and back buttons.

The GWT currently does not provide adequate support for Apache Ant and Tomcat deployments. The Ant file created by GWT's projectCreator.cmd script is sparse. The build files contained in the AJAX With Ease application include additional tasks that you will need in order to perform Java-to-JavaScript compilation, Java compilation, and WAR file creation.

While Sidebar 2 does cover these tasks, you still need to modify build.properties to suit your computer. Modify gwt.sdk.location property to point to your GWT root installation folder and tomcat.webapps to point to your Tomcat webapps folder in build.properties as follows:

# gwt install folder
gwt.sdk.location=c:/java/gwt/gwt-windows-1.0.21

# tomcat webapps directory
tomcat.webapps=c:/java/tomcat/Tomcat 5.5/webapps

That's it! To deploy the AJAX With Ease application, you can copy the ajaxwithease-0.1.war file from the code download to Tomcat's webapps folder, or execute the deploy task of build.xml. The deploy task meanders through init, prepare, gwt-compile, java-compile, javadoc, and dist tasks before finally deploying the ajaxwithease-0.1.war file by copying it to Tomcat's webapps folder. Now, point your browser to http://localhost:8080/ajaxwithease-0.1/Hello to access the application (assuming Tomcat is listening at port 8080 on your machine).