9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 1/15

in web

Create a simple HelloWorld SmartGWT project with Eclipse Kepler

This tutorial assume that you are using the following* Eclipse EE

Install GWT Eclipse Plugin by following instruction in http://www.gwtproject.org/download.htmlI used the install site: http://dl.google.com/eclipse/plug

Jessica Chiang

Technology enthusiast,author, engineer, coder,and wanna­be cartoon

August 19, 2015

Contact

Download

Software

Link

Tips

About

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 2/15

Create a New Web Application Project:

Select And select “New Web Application Project …”

Search …

2d3dgame

computer graphic

devTip

eclipse

general

java

miscellaneous

mobile

networking

python

scratch

web

windows

2d3dgame computergraphic devTip eclipse

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 3/15

After creating the default Google Web Application Project, configure it for using SmartGWT

general javamiscellaneous

mobilenetworking

pythonscratch web

windows

December 2015

October 2015

January 2015

October 2014

July 2014

February 2014

November 2013

August 2013

July 2013

January 2013

September 2012

October 2011

January 2011

May 2010

April 2010

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 4/15

Select to the Smart GWT install directory. To download Smart GWT, go to http://code.google.com/p/smartgwt/

After configuring this project to be SmartGwt, you should see SmartGWT jars got added to the project(smartgwt­skins.jar and smartgwt.jar).

January 2010

October 2009

September 2009

August 2009

June 2009

February 2008

August 2007

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 5/15

/testSmartGwt/src/com/shallwelearn/TestSmartGwt.gwt.xml

<?xml version="1.0" encoding="UTF­8"?><!– When updating your version of GWT, you should also update this DTD reference, so that your app can take advantage of the latest GWT module capabilities.–><!DOCTYPE module PUBLIC "­//Google Inc.//DTD Google Web Toolkit 2.5.1//EN" "http://google­web­toolkit.googlecode.com/svn/tags/2.5.1/distro­source/core/src/gwt­module.dtd"><module rename­to='testsmartgwt'> <!– Inherit the core Web Toolkit stuff. –> <inherits name='com.google.gwt.user.User'/> <!– Inherit the default GWT style sheet. You can change –> <!– the theme of your GWT application by uncommenting –> <!– any one of the following lines. –> <inherits name='com.google.gwt.user.theme.clean.Clean'/> <inherits name="com.smartgwt.SmartGwt"/> <!– Specify the app entry point class. –> <entry­point class='com.shallwelearn.client.TestSmartGwt'/>

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 6/15

<!– Specify the paths for translatable code –> <source path='client'/> <source path='shared'/></module>

Next, we need to change the code to use SmartGWT API, instead of the GWT API. Even though you couldmix SmartGWT and GWT to an extent, it’s receommended by SmartGWT developers not to do so. Forreasons, please go to SmartGWT forum http://forums.smartclient.com/ , and search for “mixing SmartGWTand GWT”, and you will get an earful.

/testSmartGwt/war/WEB­INF/web.xml

<?xml version="1.0" encoding="UTF­8"?><web­app xmlns:xsi="http://www.w3.org/2001/XMLSchema­instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web­app_2_5.xsd" version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"> <!– Servlets –> <servlet> <servlet­name>greetServlet</servlet­name> <servlet­class>com.shallwelearn.server.GreetingServiceImpl</servlet­class> </servlet> <servlet­mapping> <servlet­name>greetServlet</servlet­name> <url­pattern>/testsmartgwt/greet</url­pattern> </servlet­mapping> <!– Default page to serve –> <welcome­file­list> <welcome­file>TestSmartGwt.html</welcome­file>

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 7/15

</welcome­file­list></web­app>

/testSmartGwt/src/com/shallwelearn/client/TestSmartGwt.java

package com.shallwelearn.client;import com.google.gwt.core.client.EntryPoint;import com.smartgwt.client.widgets.IButton;import com.smartgwt.client.widgets.events.ClickHandler;import com.smartgwt.client.widgets.events.ClickEvent;import com.smartgwt.client.util.SC;

/** * Entry point classes define <code>onModuleLoad()</code>. */public class TestSmartGwt implements EntryPoint /** * This is the entry point method. */ public void onModuleLoad() IButton button = new IButton("Hello World");

button.addClickHandler(new ClickHandler() public void onClick(ClickEvent event) SC.say("Hello World from SmartGWT");

); button.draw();

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 8/15

To Build this project. Right­click on testSmartGwt project and select Google­>GWT Compile

The GWT Compile dialog should look as followed. Click “Compile” to compile Java code to JavaScript.

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 9/15

The trace of the GWT compile. If all goes well, it would say Succeeded.

To run on Jetty server, which comes bundled in Eclipse EE. Right­click on

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 10/15

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 11/15

9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn

http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 12/15

Edit

If you see error such as “Development Mode requires the Google Web Toolkit Developer Plugin” (Firefoxerror shown below), just follow the instruction to install the GWT plugin.

Finally, to terminate the Jetty server, click the red square.

Write a Comment