48
GWT-Kickoff Alberto Mancini - Francesca Tosi [email protected] - [email protected] Kickoff

GWT - AppDays - (25 aprile 2014, pordenone)

Embed Size (px)

DESCRIPTION

Slides del talk tenuto a Pordenone in occasione dellgli AppDays Intorduzione a GWT.

Citation preview

Page 1: GWT - AppDays - (25 aprile 2014, pordenone)

GWT-KickoffAlberto Mancini - Francesca Tosi

[email protected] - [email protected]

Kickoff

Page 5: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T co

s’è

Google Web Toolkit (GWT) is an open source Java software development kit that makes writing AJAX applications like Google Maps and Gmail easy for developers.

http://www.gwtproject.org/

Page 6: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T St

ats Official GWT Report by Vaadin

[2012] - https://vaadin.com/gwt-report-2012-portlet/download/1871870899/Future-of-GWT-Report-2012.pdf

[2013] - (del 10/04/2014 → GWT in crescita)https://vaadin.com/documents/10187/42fbbec4-51c8-426b-8aa8-fe46129353a3

Page 7: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T St

ats

E’ uno fra i framework più

utilizzati

http://zeroturnaround.com/rebellabs/the-curious-coders-java-web-frameworks-comparison-spring-mvc-grails-vaadin-gwt-wicket-play-struts-and-jsf/

Page 8: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T St

ats

Come viene principalmente

utilizzato

Page 9: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T St

ats

Browser & platform support.

Page 10: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T St

ats GWT è

molto usato in Europa

Page 11: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T St

ats GWT

why i love it ;-)

Page 12: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T St

ats GWT

the dark side

Page 13: GWT - AppDays - (25 aprile 2014, pordenone)

right

for ?

Page 14: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T St

ats as of Q4/2012

● SDK downloaded over 1 million times● 100,000+ Active Developers● Deep Integration with Eclipse, IntelliJ, Spring STS/Roo● Used by Google products such as AdWords, Flights,

Wallet● Fun things: GwtQuake, Angry Birds for the Web● GWT Today is a mature, high quality, code base.

Page 15: GWT - AppDays - (25 aprile 2014, pordenone)

... n

ot a

Fra

mew

ork Frameworks that may help

https://github.com/ArcBees/GWTPmodel-view-presenter framework

http://www.jboss.org/erraiCDI, and JPA for GWT

http://www.tessell.org/app framework (on gwt-pectin)

Page 16: GWT - AppDays - (25 aprile 2014, pordenone)

Ecos

yste

mSencha’s GXT - http://www.sencha.com/products/gxt/

https://vaadin.com/gwt

http://code.google.com/p/smartgwt/

Page 17: GWT - AppDays - (25 aprile 2014, pordenone)

Why

Why?

Page 18: GWT - AppDays - (25 aprile 2014, pordenone)

FOSS

The GWT Steering committee was founded in 2012 to help the GWT project become an even bigger success as an open source project.

● Ray Cromwell, Google● Artur Signell, Vaadin● Colin Alworth, Sencha● Mike Brock, RedHat● Thomas Broyer● Stephen Haberman, Bizo● Daniel Kurka, Google● Christian Goudreau, Arcbees● Konstantin Solomatov, Jetbrains

Page 19: GWT - AppDays - (25 aprile 2014, pordenone)

Evol

ving

& M

atur

e Rev. Improvements

2006 GWT 1.0

2007 GWT 1.3/GWT 1.4 First Open Source Release, OSX support / JUnit and ImageBundle

2008 GWT 1.5 Java 1.5 support, Overlay Types, DOM API, CSS Themes, Linkers

2009 GWT 1.6/GWT 1.7GWT 2.0

EventHandlers, EMMA Support, WAR support, Parallelized Builds/Newer browser support, IE8, GPE and AppEngine/DevMode, DraftCompile, UIBinder, LayoutPanel, CodeSplitter, ClientBundle, CssResource

2010 GWT 2.1 RequestFactory, Editor Framework, Validation, MVP, Cell Widgets

2011 GWT 2.2/GWT 2.3GWT 2.4

GWT Designer, HTML5 support/Better AppEngine integration/Maven and RequestFactory enhancements

2012 GWT 2.5 SuperDevMode, Elemental, UiRenderers, FragmentMerging, ClosureCompiler

2013 GWT 2.5.1 ….

2014 GWT 2.6 ….

Page 20: GWT - AppDays - (25 aprile 2014, pordenone)

Bro

wse

rs

Page 21: GWT - AppDays - (25 aprile 2014, pordenone)

Bro

wse

rs

Page 22: GWT - AppDays - (25 aprile 2014, pordenone)

xché

una codebase e tante 'incarnazioni' dell'applicazione.

Page 23: GWT - AppDays - (25 aprile 2014, pordenone)

Bor

n to

be

...Why GWT? The beginnings of rich internet applications started taking off in 2004-2005 with Gmail/Google Maps. jQuery didn't even exist yet. There was a vacuum for tools to build large scale web applications, and leveraging the already mature Java toolchain of IDEs, libraries, build tools, testing frameworks, made good sense.

Ray Cromwell

Page 24: GWT - AppDays - (25 aprile 2014, pordenone)

Now

aday

s ● Plethora of languages compiling to js (..., python, C/C++, Ocaml, Haskel, ...)

● Good and awesome js libraries & frameworks

Closure Tools

Page 25: GWT - AppDays - (25 aprile 2014, pordenone)

Seco

ndo

noi

● non tutte le applicazioni sono uguali

● ed alle volte alcune richiedono strumenti inustitati

Page 26: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T-B

oofc

vGWT-Boofcv sample at:http://goo.gl/3IJQgs

Page 27: GWT - AppDays - (25 aprile 2014, pordenone)

DEM

O

http://picshare.jooink.com

Page 28: GWT - AppDays - (25 aprile 2014, pordenone)

Mar

ker B

ased

AR

http://code.google.com/p/gwt-webgl/http://code.google.com/p/gwt-nyartoolkit/

http://picshare.jooink.com

Page 29: GWT - AppDays - (25 aprile 2014, pordenone)

Mob

ile (&

tab)

too

Page 30: GWT - AppDays - (25 aprile 2014, pordenone)

Com

e Fu

nzio

na

<video/>

<canvas/>

http://code.google.com/p/gwt-nyartoolkit/

Ny

HTTP

Page 31: GWT - AppDays - (25 aprile 2014, pordenone)

java

→ G

WT

Using Java libraries into the browser

Page 32: GWT - AppDays - (25 aprile 2014, pordenone)

JS →

GW

T

Using js libraries with java

Page 33: GWT - AppDays - (25 aprile 2014, pordenone)

Dee

per

Deeper.

Page 34: GWT - AppDays - (25 aprile 2014, pordenone)

GW

TGWT is a toolkit to develop Ajax web application with Java.

The programmer writes Java code and this code is translated into HTML and Javascript via the GWT compiler.

The compiler creates browser specific HTML and JavaScript to support all the major browsers correctly.

Page 35: GWT - AppDays - (25 aprile 2014, pordenone)

Tool

s in

the

Tool

kit

+ GWTc, compiler Java to Javascript+ Emulated JRE+ Web UI class library (Widgets)+ Eclipse Plugin, SpeedTracer, Designer

It's open source, completely free, and used by thousands of developers around the world (in Google AdWords,Orkut,Blogger,Groups)

Page 36: GWT - AppDays - (25 aprile 2014, pordenone)

Com

pile

r GWT compiler

● java to javascript optimizing compiler

● translates java AST into js AST

● splits code into fragments to improve loading performance

Page 37: GWT - AppDays - (25 aprile 2014, pordenone)

Link

er● responsible for the final form of the generated js

xsiframe is the standard one

there are linkers for generating web-workers, gadgets, chrome extensions, …

Page 38: GWT - AppDays - (25 aprile 2014, pordenone)

defe

rred

bin

ding

Deferred Binding:feature of the GWT compiler that works by generating many versions of code at compile time, only one of which needs to be loaded by a particular client during bootstrapping at runtime.

Each version is generated on a per browser basis, along with any other axis that your application defines or uses.

RPC CallsWidgets tuned for specific browsersInternationalization

Page 39: GWT - AppDays - (25 aprile 2014, pordenone)

defe

rred

bin

ding

Deferred binding has several benefits:

● Reduces the size of the generated JavaScript code (downloaded by each client) - including just the code needed to run the browser/locale instance (used by the Internationalization

module)● Automatic generation of code (saving development time) to

implement an interface or create a proxy class (used by the

GWT RPC module)● Since the implementations are pre-bound at compile time,

there is no run-time penalty to look up an implementation in a data structure as with dynamic binding or using virtual functions.

Page 40: GWT - AppDays - (25 aprile 2014, pordenone)

Emul

ated

JR

EGWT includes a library that emulates a subset of the Java runtime library.

http://www.gwtproject.org/doc/latest/RefJreEmulation.html

InputStream

Threads ?

Page 41: GWT - AppDays - (25 aprile 2014, pordenone)

JNSI GWT borrows from the Java Native Interface (JNI) concept to

implement JavaScript Native Interface (JSNI).

Writing JSNI methods is a powerful technique, but should be used sparingly because writing bulletproof JavaScript code is notoriously tricky.

Needed for JSO (Javascript Overlay Types)

Page 42: GWT - AppDays - (25 aprile 2014, pordenone)

JNSI

public static native void alert(String msg) /*-{ $wnd.alert(msg);}-*/;

$wnd: the root browser window GWT widgets are being rendered to

$entry(..): method that makes code reentry safe.

http://www.lustforge.com/2012/11/11/gwt-jsni-variables-an-exhaustive-list/http://www.gwtproject.org/doc/latest/DevGuideCodingBasicsJSNI.html

Page 43: GWT - AppDays - (25 aprile 2014, pordenone)

Wid

gets UiComponents

http://www.gwtproject.org/doc/latest/RefWidgetGallery.html

2.0+ LayoutPanelshttp://www.gwtproject.org/doc/latest/DevGuideUiPanels.html#LayoutPanels

from the Jul 2013 - GWT Meetup

What are some of pain points or decisions bad in hindsight?...● Bad out of box UI

...

SmartGWT, GXT

Page 44: GWT - AppDays - (25 aprile 2014, pordenone)

UiB

inde

r ● The UiBinder is a framework designed to separate Functionality and View of User Interface.

● The UiBinder framework allows developers to build gwt applications as HTML pages with GWT widgets configured throughout them.

● The UiBinder framework makes easier collaboration with UI designers who are more comfortable with XML, HTML and CSS than Java source code

● The UIBinder provides a declarative way of defining (parts of the) User Interface.

● The UIBinder seperates the programmic logic from UI.

● The UIBinder is similar to what JSP is to Servlets.

Page 45: GWT - AppDays - (25 aprile 2014, pordenone)

UiB

inde

r● DSL (xml) to lay-out (declaratively) widgets

● no loops, no conditionals, no if statements

● UiBinder allows you to lay out your user interface.

● (offers direct support for internationalization)

Page 46: GWT - AppDays - (25 aprile 2014, pordenone)

GW

T - R

PC

Lets the client and the server to exchange java objects over http.

Page 47: GWT - AppDays - (25 aprile 2014, pordenone)

Bat

tlePl

an Domani:

● Codelab 2h: GWT mobile app10:30 → 12:30

● Codelab 4h: GWT hands-on14:00 → 18:00

Page 48: GWT - AppDays - (25 aprile 2014, pordenone)

Than

ks

Alberto [email protected]

Francesca [email protected]