google web toolkit - spatineo€¦ · since gwt 2.0: dev mode code is run in the browser as java...

Click here to load reader

Post on 21-May-2020

1 views

Category:

Documents

0 download

Embed Size (px)

TRANSCRIPT

  • Google Web ToolkitIntroduction to GWT Development

    GeoMashup CodeCamp 2011University of Helsinki

    Department of Computer Science

    Ilkka Rinne & Sampo Savolainen / Spatineo Oy

    24. lokakuuta 11

  • Google Web Toolkit

    24. lokakuuta 11

  • Google Web ToolkitCode your browser apps in Java

    24. lokakuuta 11

  • Google Web ToolkitCode your browser apps in Java

    Test your app locally in your browser

    24. lokakuuta 11

  • Google Web ToolkitCode your browser apps in Java

    Test your app locally in your browser

    Debug your code using regular IDE debuggers

    24. lokakuuta 11

  • Google Web ToolkitCode your browser apps in Java

    Test your app locally in your browser

    Debug your code using regular IDE debuggers

    24. lokakuuta 11

  • Google Web ToolkitCode your browser apps in Java

    GWT compiles your app into optimized JavaScript

    Test your app locally in your browser

    Debug your code using regular IDE debuggers

    24. lokakuuta 11

  • Google Web ToolkitCode your browser apps in Java

    GWT compiles your app into optimized JavaScript

    Test your app locally in your browser

    Debug your code using regular IDE debuggers

    24. lokakuuta 11

  • Google Web ToolkitCode your browser apps in Java

    GWT compiles your app into optimized JavaScript

    Test your app locally in your browser

    Debug your code using regular IDE debuggers

    Deploy anywhere (it’s just JS + CSS + HTML)

    24. lokakuuta 11

  • Don’t Worry About

    24. lokakuuta 11

  • Don’t Worry AboutCoding in JavaScript (embed JavaScript code

    with JSNI if you really have to)

    24. lokakuuta 11

  • Don’t Worry AboutCoding in JavaScript (embed JavaScript code

    with JSNI if you really have to)

    Developing in browser (use the Java IDE you like)

    24. lokakuuta 11

  • Don’t Worry AboutCoding in JavaScript (embed JavaScript code

    with JSNI if you really have to)

    Developing in browser (use the Java IDE you like)

    Implementation details of client-server communication over HTTP

    24. lokakuuta 11

  • Don’t Worry AboutCoding in JavaScript (embed JavaScript code

    with JSNI if you really have to)

    Developing in browser (use the Java IDE you like)

    Implementation details of client-server communication over HTTP

    Writing cross-browser compatible JavaScript + DOM

    24. lokakuuta 11

  • Development ModeSince GWT 2.0: dev mode code is run in the

    browser as Java (GWT Dev Plugin)

    IDE Java debugging, code hot swapping as you save & refresh. Speeds things up!

    Dev mode also runs a local server to simulate your server side GWT code

    (RPC Servlets)

    24. lokakuuta 11

  • UI ComponentsBasic components for building “Java-like”

    GUIs for browser applications:

    Page & panel layouts

    Buttons, trees, tables, input fields, etc.

    24. lokakuuta 11

  • UI ComponentsBasic components for building “Java-like”

    GUIs for browser applications:

    Page & panel layouts

    Buttons, trees, tables, input fields, etc.

    24. lokakuuta 11

  • UI ComponentsBasic components for building “Java-like”

    GUIs for browser applications:

    Page & panel layouts

    Buttons, trees, tables, input fields, etc.

    24. lokakuuta 11

  • UI ComponentsBasic components for building “Java-like”

    GUIs for browser applications:

    Page & panel layouts

    Buttons, trees, tables, input fields, etc.

    24. lokakuuta 11

  • UI ComponentsBasic components for building “Java-like”

    GUIs for browser applications:

    Page & panel layouts

    Buttons, trees, tables, input fields, etc.

    24. lokakuuta 11

  • UI Components

    Demo: http://gwt.google.com/samples/Showcase/Showcase.html

    Basic components for building “Java-like” GUIs for browser applications:

    Page & panel layouts

    Buttons, trees, tables, input fields, etc.

    Extended by third party developers to provide more elaborate components

    24. lokakuuta 11

    http://gwt.google.com/samples/Showcase/Showcase.html#!CwCheckBoxhttp://gwt.google.com/samples/Showcase/Showcase.html#!CwCheckBox

  • Google API IntegrationGoogle API integration using separate libraries

    Gears API Library 1.3

    Gadgets API Library 1.2

    Google AJAX Search API Library 1.1

    Google Maps API Library 1.1

    Google Chart Tools (aka Visualization) Library 1.1

    Google Language API Library 1.1

    Google Ajax Loader API Library 1.1

    Google+ API Library 0.2-alpha

    Google Books API Library 0.2-alpha

    Google Latitude API Library 0.2-alpha

    etc.

    Note: use 1.1.1-RC1 for now!

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

    Currentlyreleased:

    24. lokakuuta 11

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

  • JRE Emulation LibraryFinal GWT apps run in JavaScript (without JRE)

    GWT Provides JRE emulation forJRE 1.5 basic functionality, but not all of it.

    http://code.google.com/webtoolkit/doc/latest/DevGuideCodingBasicsCompatibility.html

    Be especially careful with time/date handling, regular expressions, number formatting, timers

    24. lokakuuta 11

    http://code.google.com/webtoolkit/doc/latest/DevGuideCodingBasicsCompatibility.htmlhttp://code.google.com/webtoolkit/doc/latest/DevGuideCodingBasicsCompatibility.html

  • Java-to-JavaScript Compiler

    When you’re ready to deploy your code, ask GWT to compile

    GWT generates JS, HTML, CSS, packages them into a WAR file with image resources etc.

    Ready to be deployed on a Java Servlet Containeror Google App Engine

    Note: Extract .nocache.js and .cache.html + resources from the WAR file to run without a Servlet Container

    24. lokakuuta 11

  • Let’s see some code!

    GWT Development in Eclipse

    Codecamp demo application

    Deployment to Google App Engine

    24. lokakuuta 11