9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn in web Create a simple HelloWorld SmartGWT project with Eclipse Kepler Jessica Chiang This tutorial assume that you are using the following * Eclipse EE Technology enthusiast, author, engineer, coder, Install GWT Eclipse Plugin by following instruction in http://www.gwtproject.org/download.html and wanna­be cartoon I used the install site: http://dl.google.com/eclipse/plug August 19, 2015 Contact Download Software Link Tips About http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 1/15 9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn 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 computer graphic devTip eclipse http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 2/15 9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn general java miscellaneous mobile networking python scratch 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 After creating the default Google Web Application Project, configure it for using SmartGWT April 2010 http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 3/15 9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn January 2010 October 2009 September 2009 August 2009 June 2009 February 2008 August 2007 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). http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 4/15 9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn /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'/> http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 5/15 9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn <!– 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 could mix SmartGWT and GWT to an extent, it’s receommended by SmartGWT developers not to do so. For reasons, please go to SmartGWT forum http://forums.smartclient.com/ , and search for “mixing SmartGWT and 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> http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 6/15 9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn </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(); } http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 7/15 9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn } 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. http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 8/15 9/20/2016 Create a simple HelloWorld SmartGWT project with Eclipse Kepler | Shall We Learn 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 http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 9/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 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 If you see error such as “Development Mode requires the Google Web Toolkit Developer Plugin” (Firefox error shown below), just follow the instruction to install the GWT plugin. Finally, to terminate the Jetty server, click the red square. Write a Comment Edit http://shallwelearn.com/blog/create-a-simple-smart-gwt-project-with-eclipse-hello-world/#comment-65650 12/15.