Developing a vaadin application for Google appengine in eclipse.
This is a step by step tutorial about making a vaadin application that runs on top of google appengine.
vaadin supports google appengine as a server backend as it is documented in the vaadin book. Also the vaadin eclipse plugin comes with a eclipse project wizard for building a web application based on vaadin and GAE. However, the resulting application do not support the GAE runtime and as a result, the GAE developemtn mode cannot be used (for testing the GAE application locally before deploying it to the web).
In this tutorial, we will generate such an application and change it for supporting GAE runtime and so being able of testing the app locally. The idea is to do agile development (save a file change, and only need to refresh the web page for reflecting the changes, no server restart)
So let's begin, we will use eclipse 4.2, java 1.6, Google appengine (GAE) 1.7.1, vaadin 6.8.4. OS: linux . Also this has been tested on eclipse 3.7.
1) Install Google Plugin for Eclipse. You can use eclipse marketplace at Help -> Marketplace for easy find and install this plugin.
2) Install Vaadin Plugin for Eclipse. You can use eclipse marketplace at Help -> Marketplace for easy find and install this plugin.
3) Create a new vaadin project. Just go to File -> New -> Other -> Vaadin -> Vaadin project. Make sure you set "Deployment configuration" to "Google App Engine servlet". You can leave all the other options to their default values. For this example, we left "Create project template" checked because we want something to test right away.
Also notice that we leave the target runtime empty: we don't want to run this application on tomcat or some other Java container but using the GAE runtime. In this example we named the project "vaadingaetest". This project is ready for being deployed on GAE, but we cannot use the GAE runtime locally for testing and working, that is what the following steps are for.
4) Edit the project's .project file. You may need to go to eclipse's Navigator view for locating it because it is hidden in most other views. Once you have opened it, we need to add the XML element
<natures> <nature>com.google.appengine.eclipse.core.gaeNature</nature> <nature>org.eclipse.jem.workbench.JavaEMFNature</nature> <nature>org.eclipse.wst.common.modulecore.ModuleCoreNature</nature> <nature>org.eclipse.wst.common.project.facet.core.nature</nature> <nature>org.eclipse.jdt.core.javanature</nature> <nature>com.vaadin.integration.eclipse.widgetsetNature</nature> <nature>org.eclipse.wst.jsdt.core.jsNature</nature> </natures>
5) Enable the GAE runtime in the project. This is simply a matter of adding the GAE library to the project. Right click on the project name in the project explorer -> Build Path -> Add Libraries and there choose "google app engine" and use the default SDK. If you have not an GAE SDK installed, install it (you can ask eclipse to download it for you). Also you may need to give the GAE library more preference than other libraries. Just right click the project -> Build path -> Configure build path -> Order and export and there select the "appengine SDK" entry on the list and press the Up button for increasing the priority of this library like showed on the following image:
6) Fix the file war/WEB-INF/appengine-web.xml adding the following element inside. For some reason this geerated file won't work without that line.
And that's all the configuration needed! Now let's run our vaading application using the GAE runtime locally.
7) Run our vaadin application on GAE runtime. For this, make sure you have refreshed the project and then right click the project name -> Debug As -> Web Application. Note: if there is no Web Application option this means you have done something wrong in steps 4 or 5. Try to refresh your project and make sure you are working in Java Porject Explorer eclipse view.
8) Test your application, open http://localhost:8888/?restartApplication in your browser and you should see your vaadin app. Now, let's modify something on file /vaadingaetest/src/com/example/vaadingaetest/VaadingaetestApplication.java, for example, change the label value like:
Label label = new Label("Hello Vaadin eclipse and appengine user!");
Save the java file and you should see your changes reflected just refreshing your browser window with F5 key.
A little explanation: In a vaadin application we do not have jsps or html pages, but servlets that are responsible for render our app. Because in the project creation wizard we left "Create project template" checked, the wizard has created a sample application for us that we can run and in our case this servlet class is com.example.vaadingaetest.VaadingaetestApplication. Also looking at the created web descriptor (file /war/WEB-INF/web.xml) we can see that the servlet is mapped to the URL pattern "/*", this means accessing http://localhost:8888/anythinghere will render our vaading application (a servlet).
Also, notice that I used the ?restartApplication http parameter. This tells vaadin framework to automatically apply changes in the java code without having to restart the container something very appreciated when developing.
Well, hope this can serve others eclipse vaading and google app engine users to getting started with these technologies.