Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their...
-
Upload
haley-manter -
Category
Documents
-
view
229 -
download
0
Transcript of Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their...
![Page 1: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/1.jpg)
Google Web Toolkit (GWT)
Steve Wargolet
![Page 2: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/2.jpg)
Introduction
Desktop client-server applications and
their drawbacks.
Static-only Web pages
Introduction of Web applications
![Page 3: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/3.jpg)
What is GWT?
Powerful web application development
toolkit
Write -> Debug/Test -> Optimize -> Run
Primarily Java -> JavaScript, HTML, AJAX
Cross-Browser support.
![Page 4: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/4.jpg)
The ‘Right’ Design Pattern
What’s the right design pattern for a
GWT app?
MVC vs. MVP
![Page 5: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/5.jpg)
Client/Server Communication
Remote Procedure Calls (RPC)
Asynchronous
Different mindset
3 Components needed in GWT for RPC
Interface for the service (header)
Implementation of interface
Asynchronous interface for Client
![Page 6: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/6.jpg)
Serialization
Needed for RPC
Serialization is the process of packaging
the contents of an object so that it can
(be) moved from one application to
another application or stored for later
used.
![Page 7: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/7.jpg)
Serialization
Must satisfy at least one of the following
requirements. It is a primitive type (int, char, boolean, etc.) It is an array of serializable types A class is serializable if it meets these three
requirements: It implements either Java Serializable or GWT’s
‘IsSerializable’ interface, either directly, or because it derives from a superclass that does.
Its non-final, non-transient instance fields are themselves serializable, and
It has a default constructor
![Page 8: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/8.jpg)
The ‘Back’ Button Problem
GWT vs. the ‘Back’ button.
URL doesn’t change
Handling the problem
The History Class
Tokens
www.mywebapp.com/myapp
www.mywebapp.com/myapp#registration
![Page 9: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/9.jpg)
1
2
3
![Page 10: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/10.jpg)
Compilation
One of the most advanced features
Optimizations
Three output styles
Obfuscated
Pretty
Detailed
![Page 11: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/11.jpg)
Obfuscated
![Page 12: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/12.jpg)
Pretty
![Page 13: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/13.jpg)
Detailed
![Page 14: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/14.jpg)
Optimizations
Major selling point of GWT
Dead Code Elimination
Constant Folding
Window.alert(“Hello ” + “World”) -> $wnd.alert(“Hello World”)
Copy Propagation
String Interning
Code In-Lining
![Page 15: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/15.jpg)
Optimizations
Code splitting
![Page 16: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/16.jpg)
Permutations
24 Total Permutations
6 Browser types and 4 locales
![Page 17: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/17.jpg)
GWT Designer
Easily build the GUI
Very little CSS experience needed
Drag and Drop
Design Preview
Many included Widgets and Panels
![Page 18: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/18.jpg)
GWT Designer
![Page 19: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/19.jpg)
Panels
Panels contain widgets and other panels.
Define layout
>15 Panels available each with own pros
and cons.
![Page 20: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/20.jpg)
Basic Panels
Root Panel
Top-Most Panel
Automatically created
HTML <body> element
![Page 21: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/21.jpg)
Basic Panels
Absolute Panel
![Page 22: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/22.jpg)
Basic Panels
Vertical/Horizontal Panel – Uses HTML
table
![Page 23: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/23.jpg)
Basic Panels
Grid Flex Table
![Page 24: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/24.jpg)
Basic Panels
Flow Panel - Div
![Page 25: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/25.jpg)
Basic Panels
Dock (Layout) Panel –
North/South/East/West/Center
![Page 26: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/26.jpg)
Widgets
Many useful widgets
Button, textbox, ListBox, …
Easily create events
![Page 27: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/27.jpg)
Composite Class
Wrap a widget(s) in order to hide their
methods
Custom Widgets
Create your own methods
Make existing methods visible
Can’t modify composite outside of itself
Can be reused
![Page 28: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/28.jpg)
Examples
http://code.google.com/webtoolkit/exam
ples/
![Page 29: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/29.jpg)
DEMO
![Page 30: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/30.jpg)
Questions
![Page 31: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/31.jpg)
References
Remick, J. (2011, January 30). What is a web app? here’s our definition. Retrieved from http://web.appstorm.net/general/opinion/what-is-a-web-app-heres-our-definition/
Google. (2011). Google web toolkit . Retrieved from http://code.google.com/webtoolkit/
Kereki, K. F. (2011). Essential gwt building for the web with google
web toolkit 2. Boston, MA: Pearson Education, Inc.
Gupta, I. (2009). Accelerated gwt, building enterprise google web toolkit applications. Berkeley, CA: Apress.
Chaganti, R. (2007). Google web toolkit: Gwt java ajax programming. Birmingham, UK: Packt Pub Ltd.
![Page 32: Google Web Toolkit (GWT) Steve Wargolet. Introduction Desktop client-server applications and their drawbacks. Static-only Web pages Introduction of Web.](https://reader034.fdocuments.in/reader034/viewer/2022050816/551a46da550346545e8b522b/html5/thumbnails/32.jpg)
Title
Body