Archive for October, 2011

Setup GWT Development Mode with Tomcat in Eclipse

October 20, 2011 11 comments


A much better solution that I found recently is to create a Google Web Project and make it into a Dynamic Web Project so that one can hot deploy the GWT stuff the same way as JSP and servlet. The example is given with Glassfish.

forget about the following:
Old crap

After developing GWT application with NetBeans for several weeks, I found that I need to give up NetBeans and switch to Eclipse.

On one hand, to develop GWT application with NetBeans is easy to start. A GWT4NB plugin and necessary GWT SDK will allow you to build GWT apps. Debugging with Tomcat is extremely straightforward. Since I already have Tomcat setup for NetBeans, there was nothing in particular that I did after installing GWT4NB and GWT SDK to be able to debug GWT application with Tomcat. Moreover, my GeoServer for development has been running on Tomcat. Although I could take advantage of the embedded GWT development mode with Jetty, I really want my GWT application to run on localhost:8080 with Tomcat so that I can issue HTTP request from GWT app to GeoServer.

On the other hand, GWT Designer doesn’t work with NetBeans. This has not become an issue until I started to build complex GWT widgets using SmartGWT. Without GWT Designer, it was overwhelmingly painful to tweak the GWT application (which remind me my good old days with Visual Studio).

Problem: Setup Eclipse to include GWT and configure GWT in Eclipse to work with Tomcat at development mode


1. I followed Set up Eclipse instruction to install Eclipse and include GWT

2. Go to Compile & Debug to find instruction to debug with my own server. The instruction’s step-by-step description of how to use -noserver confused me. So here are the steps that I have summarized to hopefully make a starter like myself understand better. Basically 1) you need to setup a place holder in Tomcat so that Eclipse can deploy your modified code to Tomcat in the GWT development mode, and 2) you need to tell Eclipse where to deploy in the GWT development mode.

  1. Compile your GWT project in Eclipse with Google Plugin for Eclipse: Right click on your project -> Google -> GWT Compile
  2. Create place holder on Tomcat. After compile, find your project folder in Eclipse workspace. Locate YourProject/war directory. Copy all stuff under the war directory to the webapps folder under your Tomcat installation. You need to create a new folder under webapps to hold the stuff copied from war directory. You are essentially deploying your compiled GWT project to Tomcat
  3. Configure GWT development mode. In Eclipse, right click on your project -> Debug as -> Debug Configurations -> Web Application -> your project -> Go to Server tab -> uncheck “Run built-in server” -> Go to GWT tab -> in URL, put the URL from which you access the project deployed on Tomcat. For example, http://localhost:8080/myproject/index.html
  4. Click Debug. Now you should see that the development mode generates URL based on http://localhost:8080.
  5. Now launch the development mode URL and try to modify some contents in your project source code. For example, change the html title name and save. After that, refresh the URL on browser. And you should see your changes applied to your deployed project on Tomcat in development mode.

Note that at this point the development mode will only transfer the code that you have modified under src/. Other so called static contents such as your .html and .css would not be transferred to Tomcat. What you might have noticed is that if you edit .css file under war directory, you edits won’t go to Tomcat. My work around is to create an ant script under my project in Eclipse and ask the script to copy .html and .css to the webapps/myproject on Tomcat. Now every time I make change to .html and .css, I will run the ant script before refreshing the webpage.

Categories: Web GIS Tags: , , ,