Creating Simple GWT Project Using Eclipse Plugin

Google Web Toolkit is popular among the web developers. It provides an innovative way for developing Web pages using Java. The Eclipse plugin that is available for Google Web Toolkit has made the use and development through Google Web Toolkit.

But there are instances in which the beginners are annoyed by the creation of the standard project by the Eclipse plugin. i.e. the eclipse plugin creates a standard default application at the time of creation of new project. The standard project has many files in it. So, in order to start from scratch, the users need to delete several of these files. If there were any mistakes during the deletion, then the project could not be executed.

This feature has annoyed several beginners and created some issues. This has also been an open issue for quite some time. (http://code.google.com/p/googleappengine/issues/detail?id=1547) Now, there are several ways this issue could be solved. (Most obvious would be to fix the plugin. But, Let us not go to the solution. This is just for beginners)

The following steps will guide you to create a new GWT project and delete the files in the correct order:

1. Create a new GWT Project using the Eclipse plugin:

2. Press Finish
3. Now, the first file to be modified will be the HTML File. This will be available under DemoProject2/war/DemoProject2.html. Open this file.
Under body section, there will be a line with Web Application Starter Project. All The lines below this line (including this line) should be modified with HTML code for your application. So, for example, I am going to replace the lines:



with the following lines:



5. Now, there a few folders that should be deleted:
a. DemoProject2/com.example.demoproject.server
b. DemoProject2/com.example.demoproject.shared
c. DemoProject2/com.example.demoproject.client/GreetingService.java
d. DemoProject2/com.example.demoproject.client/GreetingServiceAsync.java
Delete the files.

6. After deletion, the files under the src folder will be marked with a red X mark indicating errors. Do not worry. Let us fix them.
7. Open the DemoProject2/com.example.demoproject.client/DemoProject2.java
8. Replace the code with the following code:

package com.example.demoproject.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.PasswordTextBox;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.VerticalPanel;

public class Demoproject2 implements EntryPoint {
public void onModuleLoad() {
final TextBox username = new TextBox();
final PasswordTextBox password = new PasswordTextBox();
final Button button = new Button("Logon");
final VerticalPanel panel = new VerticalPanel();
panel.add(new Label("username"));
panel.add(username);
panel.add(new Label("password"));
panel.add(password);
panel.add(button);
RootPanel.get("slot1").add(panel);
}
}

9. Open the file DemoProject2/war/WEB-INF/web.xml
10.Delete the following lines:

11. Save all the files.
12. Now, there should not be any errors.
13. Now select Run -> Run As -> Web Application from the menu.
14. You should see some address like http://127.0.0.1:8888/DemoProject2.html?gwt.codesvr=127.0.0.1:9997
15. Open this address in the Web Browser. You should see the following output:

Now, you have created a Simple GWT project using Eclipse plugin. You can follow the same steps when you want to clean up the existing code and create a new project.