Building your first GWT application with JDeveloper

Since I do work also with JDeveloper I was wondering about solution and possibility to use GWT into the JDeveloper. This should not really be a problem, since GWT allows you to include the framework into every Web application, but there is no plugin available for JDeveloper at the moment, which allows you to use the GWT Framework like in Eclipse environment. Few years ago someone developed a plugin for JDeveloper with the name gDeveloper, which was giving such GWT+JDeveloper support, but this plugin does not exist anymore or is not really actively developed. Looking into the Oracle OTN archive I found a very nice article written in 2006 about using GWT together with JDeveloper, which you can find here. This article is unfortunately very old and I think is time for actualization.

 

I don’t want to spend time about how to write GWT applications here, I would use just the start up application which the GWT creates for you and I will import it into the JDeveloper.

 

Step 1: Download the GWT Framework from here. Download only the GWT SDK, you will not need the rest and unpack the zipped file.

 

Step 2: Run webAppCreator to create the GWT application. Just open a command line and go to the folder where you unzipped the GWT installation. The directory contains several scripts, in our case we would need just to run the webAppCreator and create the start application:

 

webAppCreator –out otn com.oracle.gwt.Otn

 

This will create a project with the name Otn and namespace com.oracle.gwt

 

Step 3: Open the project in JDeveloper. Now this part is more complicated. We would need to import the create project into the JDeveloper. To do so proceed with the following steps.

 

Lunch JDeveloper and create application first:

 

Type some application name and use as application package prefix the same namespace as you used to create the GWT project: com.oracle.gwt, and also select Generic Application, then click on next.

 

Type the name of the project, which is the same as the created GWT project and click on finish.

 

With this steps we now create a application which we can use to create our GWT project. In your JDeveloper you will see something like this:

 

 

 

As shown on the picture above click on the drop down menu and select New Project. This will open a new window, where you have to scroll down and select Web Project as shown on the screen bellow:

 

 

 

 

 

 

 

 

 

 

Click then on OK to proceed with the next step. Now on the next screen we do have several possibilities. We can select directly the folder where we create the GWT application or we can create new folder into the application and then copy our GWT project inside. I would go for the second step. So I type the project name to be the same as the name of the GWT Project.

 

On the next screen select the servlet support and click next.

On the Page Flow Technologies, just select None and click on next.

We do not need to include any special libraries here inside so ignore this step as well and click on next.

On the next window you have to change several properties. Your document root is going to end on war, then change the name of the application and the context root if you wish as well.

 

Click then on next and then on finish to complete with the creation. Now we do have a project folder which looks like this:

Having this we can copy our GWT project into here. Just get the folder where you create previously your GWT project and copy the content of the otn folder inside the JDeveloper Otn project folder. Now your project will look like this:

You’ll still get some errors, you have to add the GWT libraries to the project, as shown bellow.

Using the build-in Ant support in JDeveloper you can build and run your GWT application now.

In the next weeks I would try to research about how to configure the GWT applications to able to launch it directly from the JDeveloper. Using the knowledge about you can for example star and build portlets for WebCenter Portal using as UI the GWT Framework. I would try to follow this article and show you how to this.
You can also find the project I created above here.