GWT A 'new' way to program dynamic web applications  - Usman - Pavan  - Rajakumar
<ul><li>Overview of AJAX development </li></ul><ul><li>Problems with AJAX </li></ul><ul><li>What is GWT ?  </li></ul><ul><...
Classic web application model (synchronous)
Ajax web application model (asynchronous)
Asynchronous JavaScript and XML (AJAX) Server - side Client – side Javascript JAVA <ul><li>+ no page transition, no blocki...
AJAX <ul><li>Asynchronous JavaScript and XML. </li></ul><ul><li>Clientside javascript to asynchronously fetch the data </l...
Drawbacks <ul><li>Multiple languages and framework across stack </li></ul><ul><li>Mixing the js,jsp,xml,java leads mainten...
What is GWT ? <ul><li>A FrameWork for building highly perfomant, Ajax enabled , Javascript front-end web applications . </...
Why GWT ? <ul><li>Rich user Interface </li></ul><ul><li>Open source </li></ul><ul><li>No  need to learn Javascript languag...
Why GWT ? (Cont ... ) <ul><li>OOPS </li></ul><ul><li>Asynchronous Calls </li></ul><ul><li>To share load between client and...
GWT Application Architecture
Modes of Running Gwt application <ul><li>Gwt Application can run in two modes . </li></ul><ul><li>Host Mode </li></ul><ul>...
Google Web Toolkit (GWT) @ deployment time @ development time <html> [...] <script type=&quot;text/javascript&quot;> [...]...
GWT: project structure Package Purpose it/sella/gwt/ The project root package contains module XML files  it/sella/gwt/clie...
GWT Modules <ul><li>*.gwt.xml </li></ul><ul><li>Jsp,Html, ...  </li></ul><ul><li>Entry point class (java class) </li></ul>...
UI widget library
GWT-RPC <ul><li>These are Asynchronous Calls. </li></ul><ul><li>A framework used to exchange java objects . </li></ul><ul>...
RPC plumbing diagram
Corns of GWT <ul><li>Browser compatibility pretty good but issues with some browsers. </li></ul><ul><li>Although java to j...
Corns of GWT ( Cont... ) <ul><li>The appearance of the application depends on the browser. </li></ul><ul><li>Take long tim...
Reference <ul><li>Documentation & Tutorial : </li></ul><ul><li>http://code.google.com/webtoolkit/ </li></ul><ul><li>http:/...
Upcoming SlideShare
Loading in...5
×

Gwt Presentation1

1,586

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,586
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
44
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Gwt Presentation1

  1. 1. GWT A 'new' way to program dynamic web applications - Usman - Pavan - Rajakumar
  2. 2. <ul><li>Overview of AJAX development </li></ul><ul><li>Problems with AJAX </li></ul><ul><li>What is GWT ? </li></ul><ul><li>Why GWT ? </li></ul><ul><li>Sample application </li></ul><ul><li>User Interface with GWT </li></ul><ul><li>RPC </li></ul><ul><li>Cons </li></ul>Agenda
  3. 3. Classic web application model (synchronous)
  4. 4. Ajax web application model (asynchronous)
  5. 5. Asynchronous JavaScript and XML (AJAX) Server - side Client – side Javascript JAVA <ul><li>+ no page transition, no blocking </li></ul><ul><li>No IDE </li></ul><ul><li>Debugging is difficult </li></ul><ul><li>weakly typed </li></ul><ul><li>+ eclipse: debugging, easy development </li></ul><ul><li>good IDE’s </li></ul><ul><li>Debugging is easy </li></ul><ul><li>strongly typed </li></ul>
  6. 6. AJAX <ul><li>Asynchronous JavaScript and XML. </li></ul><ul><li>Clientside javascript to asynchronously fetch the data </li></ul><ul><li>Using the DOM API dynamically modify the page </li></ul><ul><li>Based on javascript,html,xml,css.xhtml,DOM. </li></ul><ul><li>Web browser UI to be more interactive and to respond quickly to inputs </li></ul>
  7. 7. Drawbacks <ul><li>Multiple languages and framework across stack </li></ul><ul><li>Mixing the js,jsp,xml,java leads maintenance problem </li></ul><ul><li>Less modularization </li></ul><ul><li>Less reusable code </li></ul><ul><li>Breaks MVC principle. </li></ul><ul><li>Complicated debugging and testing with different browsers. </li></ul><ul><li>Browsers back button and history maintains problem </li></ul><ul><li>OOPS </li></ul>
  8. 8. What is GWT ? <ul><li>A FrameWork for building highly perfomant, Ajax enabled , Javascript front-end web applications . </li></ul><ul><li>Provides Java-to-javaScirpt Compiler . </li></ul><ul><li>Allow to use the java development tools like netbeans and eclipse. </li></ul><ul><li>Shell to test and debug modules without compilation </li></ul><ul><li>Simple asynchronous browser-to-server RPC </li></ul>
  9. 9. Why GWT ? <ul><li>Rich user Interface </li></ul><ul><li>Open source </li></ul><ul><li>No need to learn Javascript language </li></ul><ul><li>No need to learn DOM Api( use java Api) </li></ul><ul><li>No plugIns required in client side </li></ul><ul><li>Junit integration </li></ul>
  10. 10. Why GWT ? (Cont ... ) <ul><li>OOPS </li></ul><ul><li>Asynchronous Calls </li></ul><ul><li>To share load between client and server </li></ul><ul><li>Keeping only insensitive data on client side </li></ul><ul><li>Not for validation but for the better and rich user interface. </li></ul>
  11. 11. GWT Application Architecture
  12. 12. Modes of Running Gwt application <ul><li>Gwt Application can run in two modes . </li></ul><ul><li>Host Mode </li></ul><ul><li>Hosted Mode is a 'simulated' mode </li></ul><ul><li>Run entirely from Eclipse using the GWT Shell. </li></ul><ul><li>* Consists of a customized Tomcat Web container. </li></ul><ul><li>* Makes debugging easier . </li></ul><ul><li>Web Mode </li></ul><ul><li>Run as pure JavaScript and HTML,compiled from your original Java source code with the GWT </li></ul>
  13. 13. Google Web Toolkit (GWT) @ deployment time @ development time <html> [...] <script type=&quot;text/javascript&quot;> [...] xmlhttp.open(&quot;POST&quot;, url, true); xmlhttp.onreadystatechange = function(func) { if (xmlhttp.readyState == 4) { [...] } } xmlhttp.setRequestHeader('MessageType', 'CALL'); xmlhttp.setRequestHeader('Content-Type', 'text/xml'); </script> <body>[...]</body> </html> JAVA/eclipse javascript Hosted mode JVM IDE Compile to JAVA bytecode Compile to Javascript
  14. 14. GWT: project structure Package Purpose it/sella/gwt/ The project root package contains module XML files it/sella/gwt/client/ Client-side source files and subpackages it/sella/gwt/server/ Server-side code and subpackages it/sella/gwt/public/ Static resources that can be served publicly
  15. 15. GWT Modules <ul><li>*.gwt.xml </li></ul><ul><li>Jsp,Html, ... </li></ul><ul><li>Entry point class (java class) </li></ul><ul><li>Css , Images ,other xmls … </li></ul><ul><li>External java script file </li></ul>
  16. 16. UI widget library
  17. 17. GWT-RPC <ul><li>These are Asynchronous Calls. </li></ul><ul><li>A framework used to exchange java objects . </li></ul><ul><li>Based on the java servlet architecture . </li></ul><ul><li>GWT handle the serialization of java objects. </li></ul><ul><li>GWT-RPC services are not same as web services . . </li></ul>
  18. 18. RPC plumbing diagram
  19. 19. Corns of GWT <ul><li>Browser compatibility pretty good but issues with some browsers. </li></ul><ul><li>Although java to javascript convertion takes place, not all features of java can be implemented .eg multi threading,Calender etc </li></ul><ul><li>Gwt generated javascript and html are very difficult to understand . </li></ul><ul><li>Layouts,panels and some widgets have bugs . </li></ul>
  20. 20. Corns of GWT ( Cont... ) <ul><li>The appearance of the application depends on the browser. </li></ul><ul><li>Take long time to load and heavily uses the client resources. </li></ul>
  21. 21. Reference <ul><li>Documentation & Tutorial : </li></ul><ul><li>http://code.google.com/webtoolkit/ </li></ul><ul><li>http://code.google.com/webtoolkit/tutorials/1.6/index.html </li></ul><ul><li>Libraries </li></ul><ul><li>http://gwt-ext.com/ </li></ul><ul><li>http://extjs.com/products/gxt/ </li></ul><ul><li>Showcase </li></ul><ul><li>http://gwt.google.com/samples/Showcase/Showcase.html </li></ul><ul><li>http://www.gwt-ext.com/demo/#credits </li></ul>
  1. Gostou de algum slide específico?

    Recortar slides é uma maneira fácil de colecionar informações para acessar mais tarde.

×