Now take a look inside the StockWatcher directory. You’ll see that the applicationCreator has generated two scripts for us named StockWatcher-compile and StockWatcher-shell. These scripts will help us prepare StockWatcher for deployment, or run the application in hosted mode, respectively.

So what is hosted mode, exactly? In a nutshell, when applications run in hosted mode they are not translated to JavaScript. Instead, the Java Virtual Machine (JVM) executes the application’s code as compiled Java bytecode, using GWT plumbing to automate an embedded browser window. This makes it possible to interactively debug GWT applications from their original source code within your IDE just as you would with any other Java application. By remaining in this traditional “code-test-debug” cycle, hosted mode is by far the most productive way to develop your application quickly.

The applicationCreator can automatically generate launch configurations for debugging our GWT applications in hosted mode with Eclipse. To use them, we’ll need to first import the StockWatcher project into Eclipse.

This is a GWT module. The module contains the configuration settings (in the form of an XML file) for a particular GWT application or library. Our newly-created module contains two <inherits> tags, an <entry-point> tag, and a stylesheet tag. The <inherits> tags tells GWT which additional modules your application depends on. This may be one or more of the built-in modules or other GWT modules you developed. We only need to inherit one built-in GWT module to create a GWT application: com.google.gwt.user.User, which contains the core GWT libraries. The default application also inherits com.google.get.user.theme.standard.Standard, which adds default styles to the Widgets used in the application (see Add CSS styling for more info).

The <entry-point> tag tells GWT which Java class is your application’s startup class. This class must implement the EntryPoint interface, which defines one method: onModuleLoad(). The onModuleLoad() method is the place to do any initialization your application needs to perform, such as creating the UI elements and registering event handlers. Our application’s main class is com.google.gwt.sample.stockwatcher.client.StockWatcher.

The <stylesheet> tag tells GWT to include a style sheet names StockWatcher.css, which is located in the public directory of the application.

StockWatcher.html is our application’s host page. A host page is the container for a GWT application. It’s a regular HTML file that contains a <script> tag pointing to your application’s startup script. This script is named after the fully-qualified module name, followed by .nocache.js:

We’ll revisit our StockWatcher.html host page as we build the sample. For the time being, though, just keep in mind that it functions as our GWT application’s container and that it must reference our .nocache.js startup script.

By adding that one line, this PHP page has become a host page for GWT. You can add GWT widgets and client-side behaviors to it just as you can with static .html host pages. GWT does not need to explicitly support PHP for this to work. In fact, since GWT runs on the client-side (unlike server-side PHP scripts), it is not even aware of the fact that the host page was dynamically generated with PHP. To GWT, it’s just another host page. This means that GWT can seamlessly work with whatever server-side framework you happen to use, be it PHP, Ruby on Rails, or even ASP.NET.