Coding our Hello world using Google Web Toolkit

Lesson 3

In this tutorial we are going to edit the following file:

  • HellowGWT.gwt.xml
  • HellowGWT.css
  • HellowGWT.html
  • HelloGWT.java

How to locate the above files in your project. The image below will show you how to do it.

show

Step 1- Modify Module Descriptor: HelloGWT.gwt.xml

GWT plugin will create a default module descriptor file src/com.henrymbuguakiarie/HelloGWT.gwt.xml which is given below. For this example we are going to modifying it to look this way.

xml

Step 2- Modify Style Sheet: HelloGWT.css

css

Step 3 – Modify Host File: HelloGWT.html

hmtl

Step 4- Modify Entry Point: HelloGWT.java

java

Step 5- Compile Application

Once you are ready with all the changes done, its time to compile the project. Use the
option Google Icon box: > GWT Compile Project… to launch GWT Compile dialogue

image4

Keep default values intact and click Compile button. If everything goes fine, you will see
following output in Eclipse console

compile

Step 6- Run the application

Now click on application. Run application menu and select HelloGWT application to run the application. If everything is fine, you must see GWT Development Mode active in Eclipse containing a URL as shown below. Double click the URL to open the GWT application.

developmode

Because you are running your application in development mode, so you will need to install
GWT plugin for your browser. Simply follow the on screen instructions to install the plugin. If
you already have GWT plugin set for your browser, then you should be able to see the
following output:

output

Congratulations! you have implemented your first application using Google Web Toolkit
(GWT). There are a lot of resources over the internet to help you advance your skill. I wish you a happy coding.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s