Showing posts with label SmartGWT. Show all posts
Showing posts with label SmartGWT. Show all posts

SmartGWT Step by Step 2

Now I am going to show you how to use SmartGWT to develop rich user interface web application.
  • At first, download the latest build of GWT from here.

  • Unzip it to any location in your Hard drive.

  • Now, add the Google Plugin in your Eclipse IDE. This plugin would help you to create, compile a GWT application and deploy it to the Google App Engine with few clicks only.
    For Eclipse 3.3 (Europa):

  • Go to Help menu.

  • Select Software Updates.

  • Select Find and Install. In the dialog that appears, select Search for new features to install and click Next.

  • Click New Remote Site.

  • Enter a name for the update site (e.g. Google Update Site for Eclipse 3.3) and the following value for the URL: http://dl.google.com/eclipse/plugin/3.3. Click OK.

  • The newly-added site is checked to indicate that it will be searched for features to install. Click Finish.

  • In the subsequent Search Results dialog, select the checkbox for the update site (e.g. Google Update Site for Eclipse 3.3). This will install the plugin, a Google App Engine Java SDK and a Google Web Toolkit SDK. Click Next.

  • select I accept the terms in the license agreements. Click Next.

  • If you then select finish, there would be a prompt shown. The plugin is not signed so you must acknowledge that you are installing an unsigned feature. Click Install All.

  • You will then be asked be asked if you would like to restart Eclipse. Click Yes.

For Eclipse 3.4 (Ganymede):

  • Go to Help menu.

  • Select Software Updates.

  • In the Available Softwares tab, click on the “add site” button.

  • Put “http://dl.google.com/eclipse/plugin/3.4″ , click ok.

  • Back in the Available Software view, you should see a new update site named Google Update Site for Eclipse 3.4. Select the checkbox next to the new update site. This will install the plugin, a Google App Engine Java SDK and a Google Web Toolkit SDK. Click Install.

  • Review the features that you are about to install. Click Next.

  • Select I accept the terms in the license agreements. Click Next.

  • You will then be asked if you would like to restart Eclipse. Click Yes.

  • Now create a new project in eclipse. File-->New-->Other


Select Web Application Project and click on next as shown above.

    • Name the project whatever you like. I have choosen as 'hellosmartgwt' and give a package name whatever you want. Uncheck 'Use Google App Engine' if you are not inteded to using Google App Engine for hosting your application. Finally click on Finish button.

    • Add the “smartgwt.jar” (form the unzipped folder) to your project libraries (Project –> Properties –> Java Build Path).
    • Add a line to inherit SmartGWt as shown below to the module xml file (Hellosmartgwt.gwt.xml) as shown below.
    • Add <script> var isomorphicDir = hellosmartgwt/sc/"; script> to your host html file i.e to Hellosmartgwt.html which is inside war folder.
    • Now open the Hellosmartgwt.java and replace with the following line of codes.

    • package com.hellosmartgwt.client;

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

      /**
      * @author Sanjeev Kulkarni
      * @since 0.5 - 30-Mar-2010 3:50:03 PM
      * @version 0.1
      */

      /**
      * Entry point classes define onModuleLoad().
      */
      public class Hellosmartgwt implements EntryPoint {

      @Override
      public void onModuleLoad() {

      IButton button = new IButton("Hello SmartGWT");
      button.addClickHandler(new ClickHandler(){

      @Override
      public void onClick(ClickEvent event) {
      SC.say("Hello world!!! This is SmartGWT!");
      }

      });

      }

      }


    • Now you have completed the 1st program. Now it's time to run it. To run this right click on the project then goto Run As-->Web Application.
    • This Completes the running of your project.
    • Successefully completed running of helloworld example. You can continue to work on different examples whos source is available online from http://www.smartclient.com/smartgwt/showcase
  • Thats it for SmartGWT Step by Step 2. If you need any further more reffer to smartgwt forum. Thank You.


SmartGWT Step by Step...

Hi, I am curious about this post as this post will attempt to teach you a very beautiful rich user interface backed by the SmartClient technology that is SamrtGWT.
Smart GWT is a GWT based web application framework that allows you to not only utilize its comprehensive widget library for your application UI, but also tie these widgets in with your server-side for data management. Smart GWT is based on the powerful and mature SmartClient library.

Smart GWT is compatible with GWT 1.5.3 , GWT 1.6.4, GWT 1.7.x and GWT 2.0.x

So what's so smart about SmartGWT?

Let me try to explain. SmartGWT is not just another Widget library. While most Ajax frameworks focus primarily on presentation and displaying mostly read-only data, either local or via XML / JSON, SmartClient was built with server side integration in mind. Most enterprise applications are not just about about data presentation, but about being able to propagate data changes made by the user to the backend. So while its tempting to use library X that has a cool tree widget, it's not until you actually try to use it your application that you encounter the real world hard problems. For example, how do you take data from your business objects on the server to not only display in a tree widget, but also be able to update your data model when, say, the user reorders the tree nodes or make edits / deletes in the UI. How do you display hierarchical data where nodes may have hundreds of children? And so on..

Most Ajax frameworks stop short and leave it up to the user to manage state on the client side and propagating the changes to the server. This is not a trivial problem! Over the past few years UI widget libraries have improved significantly and there are now various options available to users. Simply put, having good looking widgets is not the hard problem today. In addition to having good looking widgets, having end-to-end integration of the UI components with the backend is the hard problem. It's this 20% of the functionality that takes 80% of the time in building most enterprise applications. Click here to read more about SmartGWT.

Now what is the difference between SmartClient and SmartGWT?

SmartGWT is a GWT wrapper around SmartClient LGPL. If you use SmartGWT, you build your UI using Java. If you use SmartClient LGPL directly, you build your UI using JavaScript. They both expose the same set of components and capabilities, so which one you use is a matter of existing skills and language preference.

Like SmartClient LGPL, SmartGWT does not require the SmartClient Server and works with any server technology (Java, .NET, PHP, etc).

Now have a look on the beauty of SmartGWT from the showcase here.

In the next post I will explain how to start using SamrtGWT. Be ready for it.

SmartGWT 1.0: A Q&A with Sanjiv Jivan

Earlier this month, SmartGWT 1.0 was released. SmartGWT is an API for building GWT applications using the SmartClient Javascript component library. SmartGWT was developed by Sanjiv Jivan, the same developer who previously lead gwt-ext development, and subsequently ceased his involvement due to licensing issues.

InfoQ had a chance to discuss SmartGWT with Sanjiv Jivan and get his perspective on the new project, comparisons to gwt-ext, and the plans for the project.

What are the main features that SmartGWT supports?

SmartGWT makes the complete APIs of the SmartClient AJAX RIA platform available in GWT. SmartClient is very different from other Ajax libraries in that it provides not only a very complete widget set, but also handles the hard problems involved in building enterprise applications: not just loading and displaying data, but propagating user changes back to the server, and handling all of the consequences of those changes - server validation and other error handling, cache updates across multiple components, etc.

SmartGWT's data-aware widgets - such as Tree, Grid, Calendar and several others - provide complete end-to-end user interactions like tree reordering, dragging events in a Calendar, which automatically generate appropriate server requests to update data with a simple protocol that's easy to customize. This subject is key in understanding the true value SmartGWT provides and a more detailed introduction can be found here.

A few other features worth mentioning:

  • SmartGWT supports live grids that not only lazy load rows from the server on demand, but also lazily render columns as the user scrolls horizontally. Most browsers can't handle rendering a large number of columns in tables and the lazy rendering capabilities of SmartGWT grids makes displaying large tables a breeze without a performance hit. The TreeGrid which supports multiple columns, editing, lazy loading of nodes, and virtual scrolling is also very powerful and something that many applications require.
  • Adaptive sorting and filtering in grids is pretty neat feature. When the data is filtered down to a number that fits in the local buffer, additional filters applied by the user no longer results in roundtrip calls to the server and data from the local buffer is used. It transparently reverts back to making calls to the server when the the data required to fulfill the request is not in the local buffer. This makes a huge difference in the real-world responsiveness and performance of enterprise apps, by cutting down on trips to the database and giving users instant responses instead
  • Relogin: For applications requiring authentication, if a request is made and the session has timed out, SmartGWT makes it easy to implement a workflow where the user is prompted to relogin and on being authenticated successfully the original transaction is resumed without loss of data or context

What is the primary difference between gwt-ext and SmartGWT?

Besides the obvious difference in the actual functionality provided by each underlying library, in gwt-ext, there a is a fair amount of glue code to "fix" inconsistent API's and funky rendering behavior in ExtJS. In working with SmartClient, everything pretty much worked right away. The widget component hierarchy is consistent and object oriented so a direct translation to SmartGWT worked out real well.

SmartGWT also uses the standard GWT 1.6 event API which is much cleaner and flexible compared to its predecessor. As a result users no longer have to deal with listener adapter classes.

Another important difference is that SmartGWT has the full support of SmartClient where users can make feature requests, expedite bug fixes, get support and training and not worry about hitting a roadblock. Additionally, users have the benefit of a commercial friendly LGPL licensed library. Its the best of both worlds.

Having worked with both ExtJS and SmartClient, how do the two component frameworks compare?

ExtJS is certainly feature rich and looks sharp. It was the reason that I started gwt-ext a while ago when Ext was LGPL. However when working on GWT-Ext, there were a lot of corner cases, gotchas, deferred rendering workarounds and inconsistent class hierarchies in Ext where glue code had to be added to "fix" some of these inconsistencies. For example some layouts allow you to dynamically add new components while a couple of key layouts don't support it. Also another key issue is that a good percentage of widget properties cannot be changed after the widget has been rendered, and in some cases users need to set a property and sometimes they need to call a method to accomplish the same thing.

SmartClient has been developed over the past 8 years and it is extremely stable and virtually bug free. The component model is consistent and it is highly dynamic allowing users to change most properties post-render with the changes reflected immediately. It has significantly more functionality and handles server integration really well. If you browse the SmartClient forums, a few things become quickly apparent:

  1. You almost never hear that "this feature is not available / supported". Pretty much everything that users request is available.
  2. The number of bugs reported in next to zero.
  3. You don't find any unanswered questions.

Another thing that you'll notice if you view the source of the samples in their Showcase is that so much can be done with so little code. A master-detail screen that also sends updates to the server can be written with as few as 10 lines of code when passed a reusable DataSource definition.

Do you have any comments for users on SmartGWT being a wrapper over SmartClient versus being a complete rewrite?

A common misconception that users have is that any third-party library written in GWT magically runs fast, is completely leak free, and renders perfectly on all browsers. As an example a TableGrid written by a third party in GWT from scratch could still perform really poorly, and not display consistently on all browsers. There are obviously several aspects to GWT that helps avoid leaks and such but this does not mean that any third party code written in GWT is 100% leak free. What actually matters is that the framework code is well written and carefully tuned and well tested.

The reality is that SmartClient is fast and stable and provides an excellent base for SmartGWT. In fact, in my experience, SmartClient actually does a better job of solving browser inconsistencies than pure GWT third party libraries. SmartClient offers an accurate and consistent cross-browser layout with an object-oriented skinning system that doesn't require deep CSS expertise or knowledge of browser quirks.

In May you blogged about your decision to step down from the gwt-ext project due to the controversial licensing changes with ExtJS. How has that decision been received by the community?

The community has been very understanding and the other team leaders of gwt-ext have also stepped up and done a great job. Most importantly the community that really grown and its great to see users helping other users.

I've had conversations with the gwt-ext team leads and they have expressed that having an option for users that feel limited with gwt-ext to migrate to SmartGWT is a healthy option. Assistance will be provided to users who are interested in migrating. Ofcourse the gwt-ext project will continue to run the way it currently is.

The evolution of SmartGWT to version 1.0 has been very quick, even assuming you started development in May. Were there lessons you learned in developing gwt-ext that you were able to apply to SmartGWT?

Working on an open source project is mostly about personal satisfaction and the "feel good" aspect of being involved in a project that is of use to several other users. It is also a great learning experience that helps personal development.

On the technical side of things, I was able to apply my learnings during the development of gwt-ext towards SmartGWT while improving upon the common issues faced by the users. I also learned it was very important to pick a project that doesn't involve politics and something that is motivating.

It was extremely distressing to frequently receive emails from the owners of Ext, LLC threating to sue me if I didn't play along with their plans. For instance they wanted me to switch to GPL or else they would find me in violation of their license. Again, no details were provided. I also received another threat where they said that I would hear from their lawyers within 24 hours if I didn't allow them to post on the gwt-ext forum. And this was after I put in a lot of effort building a project which directly supported growth and sales of their own library.

In contrast, the folks at SmartClient have been fully supportive of SmartGWT, providing technical assistance and a safe home for SmartGWT which will be operated under their umbrella. They even wrote a public letter indicating that they will not switch licenses of their LGPL offering. It feels great to be back working on technical stuff with what I consider a superior product.