Introduction to Google Web Toolkit
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Introduction to Google Web Toolkit

on

  • 5,009 views

Slides to support my guest lecture on "Introduction to Google Web Toolkit" in the 1'st semester Master course "Internet Technology" given to Software Engineers at Aalborg University, Faculty of ...

Slides to support my guest lecture on "Introduction to Google Web Toolkit" in the 1'st semester Master course "Internet Technology" given to Software Engineers at Aalborg University, Faculty of Computer Science.

Statistics

Views

Total Views
5,009
Views on SlideShare
5,000
Embed Views
9

Actions

Likes
3
Downloads
127
Comments
0

2 Embeds 9

http://www.slideshare.net 8
http://mayranoemi.wordpress.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Introduction to Google Web Toolkit Presentation Transcript

  • 1. Intro GWT RPC Demo GWT The Google Web Toolkit Jeppe R. Thomsen jenslyn@cs.aau.dk Aalborg University Department of Computer Science October 6, 2009 Jeppe GWT - SW7 1/22
  • 2. Intro GWT GWT Motivation RPC Application Areas Demo Resources The Presentation Not the usual slide style More text - less code Interrupt if you are bored, and ask me something instead E.g. ”You are boring, show me how to code X” Jeppe GWT - SW7 2/22
  • 3. Intro GWT GWT Motivation RPC Application Areas Demo Resources What is GWT - The Google Web Toolkit It is among other things: An AJAX framework A Widget library A Java-to-Javascript compiler Jeppe GWT - SW7 3/22
  • 4. Intro GWT GWT Motivation RPC Application Areas Demo Resources Motivation for using it Communicate with your server through really simple RPC Using e.g. JSON and XML Optimize the JavaScript script downloads based on user profile Using Deferred binding Reuse UI components across projects Use other JavaScript libraries and native JavaScript code Mix handwritten JavaScript in your Java code (JSNI) Easily support the browser’s back button and history adding state to the browser’s back button history Localize applications efficiently Test your code with JUnit Jeppe GWT - SW7 4/22
  • 5. Intro GWT GWT Motivation RPC Application Areas Demo Resources Application GWT is, unlike many other AJAX frameworks, aimed at both webpage- and webapplication- development. The Javascript code is compiled to minimal size The Javascript has any unreachable code purged at compile time Highly versatile and combinable UI widgets. Java source language makes it realistic to do actual application development in Javascript Jeppe GWT - SW7 5/22
  • 6. Intro GWT GWT Motivation RPC Application Areas Demo Resources Pros and Cons Where to use it. Webpages which needs to react to user actions immediately Anywhere you would want some dynamic content on your webpage Where Not to use it. Purely Static (informational) pages which does not change or update often. Anywhere it would be assumed users have disabled Javascript Jeppe GWT - SW7 6/22
  • 7. Intro GWT GWT Motivation RPC Application Areas Demo Resources GWT Resources Download GWT http://code.google.com/webtoolkit/ Widgets Demo http://gwt.google.com/samples/KitchenSink/KitchenSink.html Official Libraries http://code.google.com/webtoolkit/googleapilibraries.html Jeppe GWT - SW7 7/22
  • 8. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Develop in Java Use your favorite IDE Eclipse 3.5 NetBeans 6.7 IDEA 8.1 IntelliJ 7+ Some standard libraries are emulated, others replaced by gwt libraries java.lang java.lang.annotation java.util java.io java.sql Jeppe GWT - SW7 8/22
  • 9. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Reference - libraries 1/3 com.google.gwt.i18n.client.DateTimeFormat Replacement for the java.util.DateTime- Format class in normal Java. This replacement only supports a subset of the normal Java version. com.google.gwt.i18n.client.NumberFormat The same kind of replacement, but then for the java.util.NumberFormat, again providing only a subset of its features. com.google.gwt.user.client.Timer A simplified, browser-safe timer class that can be used to mimic a threaded environment, and which allows you to schedule tasks and actions. Its a simplified version of the java.util.Timer class. Jeppe GWT - SW7 9/22
  • 10. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Reference - libraries 2/3 java.lang ArithmeticException ArrayIndexOutOfBoundsException ArrayStoreException AssertionError Boolean Byte CharSequence Character Class ClassCastException Cloneable Comparable Deprecated Double Enum Error Exception Float IllegalArgumentException IllegalStateException IndexOutOfBoundsException Integer Iterable Long Math NegativeArraySizeException NullPointerException Number NumberFormatException Object Override Runnable RuntimeException Short StackTraceElement String StringBuffer StringBuilder StringIndexOutOfBoundsException SuppressWarnings System Throwable UnsupportedOperationException Void java.lang.annotation Annotation AnnotationFormatError AnnotationTypeMismatchException Documented ElementType IncompleteAnnotationException Inherited Retention RetentionPolicy Target Jeppe GWT - SW7 10/22
  • 11. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Reference - libraries 3/3 java.util AbstractCollection AbstractList AbstractMap AbstractQueue AbstractSequentialList AbstractSet ArrayList Arrays Collection Collections Comparator ConcurrentModificationException Date EmptyStackException EnumMap EnumSet Enumeration EventListener EventObject HashMap HashSet IdentityHashMap Iterator LinkedHashMap LinkedHashSet LinkedList List ListIterator Map Map.Entry MissingResourceException NoSuchElementException PriorityQueue Queue RandomAccess Set SortedMap SortedSet Stack TooManyListenersException TreeMap TreeSet Vector java.io FilterOutputStream OutputStream PrintStream Serializable java.sql Date Time Timestamp Jeppe GWT - SW7 11/22
  • 12. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Coding Modify the DOM JSNI - The JavaScript Native Interface public class JSNIExample { static int myStaticField; void instanceFoo(String s) { } public native void bar(JSNIExample x, String s) /*-{ // Call instance method instanceFoo() on this this.@com.google.gwt.examples.JSNIExample::instanceFoo(Ljava/lang/String;)(s); // Call instance method instanceFoo() on x x.@com.google.gwt.examples.JSNIExample::instanceFoo(Ljava/lang/String;)(s); // Read static field (no qualifier) @com.google.gwt.examples.JSNIExample::myStaticField = val + ” and stuff”; }-*/; } Jeppe GWT - SW7 12/22
  • 13. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Debug the Java code Use hosted mode while developing. Only compile to JavaScript when done. Debug Java code as you normally would Code runs as bytecode and served using an internal Jetty instance Most times changes are immediately visible by just refreshing the integrated browser instead of relaunching hosted mode Use GWT.log() to log user behavior and exceptions. Jeppe GWT - SW7 13/22
  • 14. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Run the Java code Compile to JavaScript when done developing the application Java code compiled to 6(7) permutations of JavaSript to ensure optimal performance in most versions of major browsers IE Firefox Safari Opera Size of JavaScript code minimal. Jeppe GWT - SW7 14/22
  • 15. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Deploy the Javascript Specify one or more <div> elements in a .html file JavaScript will use them to hook bits of GWT functionality into the existing page Initial script will detect browser vendor and version only download relevant permutation of JavaScript public void onModuleLoad() { final Button sendButton = new Button(”Send”); final TextBox nameField = new TextBox(); nameField.setText(”GWT User”); sendButton.addStyleName(”sendButton”); RootPanel.get(”nameFieldContainer”).add(nameField); RootPanel.get(”sendButtonContainer”).add(sendButton); } Jeppe GWT - SW7 15/22
  • 16. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Demo Ask if you want something specific demonstrated. Jeppe GWT - SW7 16/22
  • 17. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Basic Widgets http://code.google.com/webtoolkit/doc/1.6/RefWidgetGallery.html http://gwt.google.com/samples/Showcase/Showcase.html Jeppe GWT - SW7 17/22
  • 18. Intro Code-, Debug-, Run Java GWT Deploy Javascript RPC Demo Demo Widgets & Panels Combining Widgets All widgets can be combined and extended support ease of use allow reusing advanced and specialized widgets which still compile to efficient JavaScript Many advance widget libraries already exist (e.g. SmartGWT) Jeppe GWT - SW7 18/22
  • 19. Intro Motivation GWT Plumbing RPC Server Communication Demo RPC Allows a GWT client to make a call to server-side code Super easy development. All the proxy classes that handle RPC are generated automatically. All you need to do is define your service’s interface and its server-side implementations. GWT client serialization allows client JavaScript to interact with Java classes on the server Jeppe GWT - SW7 19/22
  • 20. Intro Motivation GWT Plumbing RPC Server Communication Demo Plumbing Jeppe GWT - SW7 20/22
  • 21. Intro Motivation GWT Plumbing RPC Server Communication Demo Server Communication Creating Services - Three steps Define the service’s synchronous and asynchronous interfaces Implement the service Call the service Exception Handling Jeppe GWT - SW7 21/22
  • 22. Intro GWT RPC example RPC Demo Demo RPC Demonstration Jeppe GWT - SW7 22/22