Transcript
Page 1: First steps with GWT @ Google IO Extended - Pordenone

First steps with GWTGoogle I/O Extended 2014 - Friuli Venezia Giulia/Veneto

Page 2: First steps with GWT @ Google IO Extended - Pordenone

Giampaolo@trapo1975

+Giampaolo.Trapasso www.cosenonjaviste.it

Page 3: First steps with GWT @ Google IO Extended - Pordenone

GWT (/ˈɡwɪt/)I’m a open source development toolkit for building and optimizing complex browser-

based applications.

Page 4: First steps with GWT @ Google IO Extended - Pordenone

Let me introduce myselfMy complete name is Google Web Toolkit or GWT Web Toolkit if you like I’m 8 years old..

GWT 1.0 - May 17, 2006

I worked at Google as Java-to-Javascript specialist but have still good relations

My home is http://www.gwtproject.org/ I speak Java

also Javascript, CSS, HTML

In my circle of friends: all browsers and 100K developers

Page 5: First steps with GWT @ Google IO Extended - Pordenone

Seriously..what can you do with GWT?

Page 6: First steps with GWT @ Google IO Extended - Pordenone

Google Flightshttps://www.google.it/flights/

Page 7: First steps with GWT @ Google IO Extended - Pordenone

Google Groupshttps://groups.google.com

Page 8: First steps with GWT @ Google IO Extended - Pordenone

Bloggerhttps://www.blogger.com/home

Page 9: First steps with GWT @ Google IO Extended - Pordenone

Evernote homepagehttps://www.evernote.com/Home.action

Page 10: First steps with GWT @ Google IO Extended - Pordenone

Angry Birds for Chromehttps://www.youtube.com/watch?v=F_sbusEUz5w

Page 11: First steps with GWT @ Google IO Extended - Pordenone

Quake II GWT Porthttps://code.google.com/p/quake2-gwt-port/

Page 12: First steps with GWT @ Google IO Extended - Pordenone

Picsharehttp://picshare.jooink.com/

Page 13: First steps with GWT @ Google IO Extended - Pordenone

and more!• http://www.devsniper.com/my-selected-gwt-

applications/

• http://gwtreferencelist.appspot.com/

• http://www.quora.com/What-web-applications-use-Google-Web-Toolkit-(GWT)

Page 14: First steps with GWT @ Google IO Extended - Pordenone

Something about GWT from recent reports

Page 15: First steps with GWT @ Google IO Extended - Pordenone

Java Tools & Technologies Landscape for 2014

http://pages.zeroturnaround.com/Java-Tools-Technologies.html

Page 16: First steps with GWT @ Google IO Extended - Pordenone

Web Framework in use

Page 17: First steps with GWT @ Google IO Extended - Pordenone

The Future of GWT Report 2013https://vaadin.com/gwt/report-2013

Page 18: First steps with GWT @ Google IO Extended - Pordenone

Main GWT components

• Java-to-JavaScript Compiler

• JRE emulation library

• GWT Development Mode

• GWT Web UI class library

Page 19: First steps with GWT @ Google IO Extended - Pordenone

PROs• It uses Java (strong typing)

• Learning curve

• Libraries

• Reuse of server logic

• GWT’s built-in protocol to transfer data between the client and the server without any additional knowledge of how the data is packaged and sent (GWT-RPC)

• IDE and development tools support: refactor, debug, code navigation, unit test

• Handle the browser compatibility and I18N

Page 20: First steps with GWT @ Google IO Extended - Pordenone

PROs• The GWT compiler optimizes the generated code, removes dead code

and even obfuscates the JavaScript

• “Easy” to maintain large project

• JavaScript in the Java source code using the JavaScript Native Interface (JSNI)

• To summarize: highly responsive web applications with heavy lifting on the client-side and reduced chattiness with the server-side

• Workoffline, stateless server, high number of users

• Open source and developed by a community

• Works very well with Google App Engine.

Page 21: First steps with GWT @ Google IO Extended - Pordenone

CONs• It uses Java -> ceremony code

• but GWT 3.0 will use Java 8.0

• It uses Java, something front end developers don’t know

• More code to create UI

• but you can use UIBinder

• Yes, but it’s another abstraction over HTML

Page 22: First steps with GWT @ Google IO Extended - Pordenone

CONs• Long compilation time

• but you can use Dev Mode

• but is going deprecated since depends on browsers/is slow

• but there’s SuperDev Mode

• Too much work even when functionality is simple - include existing JS also

• but GWT is typically used on complex applications

• Quality and number of widget

• but look at GWT Nextgen JsInterop & Web Components Demo: https://www.youtube.com/watch?v=wFMD1GXR2Tg

Page 23: First steps with GWT @ Google IO Extended - Pordenone

Frameworks• Errai framework: http://erraiframework.org/

• GWTP: GWT-Platform

• SmartGWT (SmartClient)

• Sencha GXT (Ext JS look and feel)

• Vaadin: GWT used as engine but JSF like approach, only server side logic

• Vaadin 7.0 will be a superset of GWT

• Useful link: https://vaadin.com/comparison (also with jQuery, RichFaces an more)

• GWTMobile

• mgwt

Page 24: First steps with GWT @ Google IO Extended - Pordenone

FAQ• Does GWT use jQuery? How?

• No it doesn't. GWT generates Javascript but GWTQuery exists.

• Is Gmail built on Google Web Toolkit?

• No, it’s a “urban legend”, but Google Sheet is

• Is it possible to integrate AngularJS with GWT ?

• Yes, take a look at https://github.com/cromwellian/angulargwt

• GWT is no more under Google umbrella, is GWT dead?

• No, 2.7 & 3.0 will be released soon (and take a look to https://www.youtube.com/watch?v=bj93jlfYi5c for the future of GWT)

• Where can I find some examples to try?

• http://www.gwtproject.org/examples.html (look at Showcase!)

• When is GWT appropriate, when is AngularJS appropriate?

• https://groups.google.com/forum/m/#!topic/angular/9P4RD3IbQwk

Page 25: First steps with GWT @ Google IO Extended - Pordenone

Talk is cheap, show me the code