Nov 11 2009
Many people are asking (especially in the GWT Group) how to create a GWT Application for their favourite IDE. In this blog i will show you how to do this for Eclipse, NetBeans and IntelliJ IDEA.
Table of contents
Create the Project-files
During my growing experience with GWT i learned that it is better to create the project from scratch and import it into the IDE rather then using a IDE-wizard which often creates not all files you need. So let’s start bei downloading the Google Web Toolkit Archive and extract it. Open a shell (Windows-User run “cmd“) and navigate to the directory where you have extracted the GWT-archive. Run the following commands:
- webAppCreator.cmd -out MyProjectDirectory eu.jdevelop.gwt.MyApp
- i18nCreator.cmd -eclipse MyGwtProject -createMessages -out MyProjectDirectory eu.jdevelop.gwt.client.constants.i18n.MyLanguageConstants
So what have you done? You have created a GWT-Project and added support for Eclipse and internationalization (i18n).
Change into the created directory MyProjectDirectory and run the following commands to see that all is working:
- ant build
- ant hosted
Well done, now it is time to import this project into your favourite IDE.
Open Eclipse (i am using version 3.5) and point it to an empty directory for your Workspace. In the menu open “Help“->”Install New Software” and install the plugin for your Eclipse version. Restart Eclipse after Installation.
Now import the previously created project. Click on “File“->”Import“:
..and select “General“->”Existing Projects into Workspace“.
Choose the directory where your project is located. After importing, you should see something like this:
At last you have to activate the GWT-Plugin. Open the project properties and navigate to “Google“->”Web Toolkit“. Activate the plugin. That’s it!
You can use Ant targets or the Eclipse commands to run the application.
Using NetBeans and GWT is not very difficult. Here i am using NetBeans v6.7.1 . First open in the menu “Tools“->”Plugins” and install the GWT4NB-Plugin.
Create a new “Web Application“-Project:
Choose a directory for it:
Select a Server:
Select the “Google Web Toolkit“-Framework in the next page and insert in the “GWT Module“-Textfield this: “eu.jdevelop.gwt.MyApp“. Notice the missing “client“-subpackage? It will be automatically created by the GWT4NB-Plugin.
After that you will see the created project from the GWT4NB-Plugin:
When you launch the application you can see that it is deployed into your previously selected Server:
Where is now the “hosted mode” ? To use it, only click on the Debug-Button in the menu. To use Ant-Targets you have to make some changes. First open the “project properties” and change the “web page folder” from “web” to “war“:
Open the file “build.xml“, located inside your GWT-Project (created in Create the Project-files):
Copy the content inside the “<project></project>“-tags and insert it into the “build.xml“-file, located in your NetBeans-Project directory:
Replace all appearances of “src” with “src/java“, because source files are located in a different directory.
You are now able to run the new ant targets “gwtc” and “hosted“:
The last step is the integration of i18n. Copy the whole “…gwt-windows-1.7.1MyProjectDirectorysrceujdevelopgwtclientconstants“-directory into the corresponding directory of your NetBeans-project.
Don’t forget to copy the file “MyLanguageConstants-i18n.cmd“, you need it to create the i18n-java-file! You have to open it in NetBeans and update the source-directory (there are two!) to “src/java“:
Using IntelliJ IDEA
First create an empty directory (i am using “C:TempIdeaGWT” in this example) and copy the contents from the created GWT-Project (“…gwt-windows-1.7.1MyProjectDirectory” into it.
Open IDEA (i am using version 8.1.3) and click on “Create New Project“. Select “Import project from external model“:
Follow now the next pictures and select the same options:
Open the “Edit configurations“-screen and create a new “Tomcat Server“-configuration:
Click on the “FIX“-Button and choose your deployment source:
You can now launch the Tomcat Server and see your Application working.
Where is now the hosted mode? This famous question can be answered! Open on the right side of IDEA the “Ant Build“-Panel and add the “build.xml” -file. You will see all Ant targets and there you can launch “hosted“.
That’s it. If you have any improvements, drop a line below.
15 responses so far