Introducción a GWT“Google Web Toolkit”

ADWE Murcia, 6 de Julio 2011Miguel García, @mglpia

miguel.garcia.lopez@gmail.com

lunes 25 de julio de 11

• AJAX: Asynchronous JS and XML XmlHttpRequest

• “Sitio Web” vs. “Aplicación Web”

• SPI: Single Page Interface

• “Centrado en el Servidor” vs “el Cliente”

• Serialización en JSON, XML

• JavaScript muy optimizado hoy en día

Previo

lunes 25 de julio de 11

• Nota: GWT != GAE (Google App Engine)

• Toolkit desarrollo clientes Web - RIA

• Centrado en el navegador: CPU, RAM, pide por esa boca

• Desarrollo en Java Lenguaje muy extendido

• Abstrae de diferencias navegadores

• Detalles a continuación...

Qué es GWT

lunes 25 de julio de 11

Plugin para Eclipse

• Creación de proyectos GWT

• Integración debugger, “Run as...”

• Editores para ficheros usados por GWT

• Integración tests unitarios

• Otros: Maven plugin, NetBeans, IntelliJ

lunes 25 de julio de 11

Compilador GWT• “Compila” código Java > JavaScript + HTML

• Una versión distinta por navegador/engine

• No uso de binarios (.jar): código fuente

• Clases del JRE/JDK “blacklisted” ¡(Re-)Escritas en JS!

• Posibilidad de llamar métodos “nativos” JS

• OBFUSCATED, PRETTY, DETAILED

lunes 25 de julio de 11

Interfaz Usuario• Extensa librería de widgets Composite

• Diseño/layout vía:

• “A pelo”, programáticamente panel.setLayout(...)

• UIBinder XML-based, componentes/handlers inyectados @UiField, ...

• GWT Designer Diseño gráfico drag-and-drop

• HTML + GWT (= HTML + JS)

• “Wrappers” librerías componentes JS ExtJS,YUI...

• Soporte para internacionalización

• “CSS-skinning”lunes 25 de julio de 11

Comunicación con ServidorAntes que nada... IMHO no es lo mejor para data-centric apps

(Vía http://www.zkoss.org/)

lunes 25 de julio de 11

Comunicación con Servidor

• Con un servidor Java: GWT-RPC

• Librería peticiones HTTP

• Librerías manejo JSON y XML

• API/Naturaleza asíncrona onSuccess() onError()

• Múltiples opciones 3ªs partes resty-gwt, ...

lunes 25 de julio de 11

Ejecución y Depuración

• Depuración: “en Java” + Plugin navegador Hosted Mode

• Herramientas examen Web Firebug + PRETTY/DETAILED

• GWT Logging Framework

• Código servidor: lo que queramos Mundo Java, o PHP, o ...

lunes 25 de julio de 11

Otros• APIs de Google GWT-izadas Maps, Charts, ...

• Soporte al historial navegador

• No Eclipse-exclusivo Otros IDEs, command-line, Maven

• Documentación de alta calidad, detalles, tutoriales

• Patrones de arquitectura: MVC, MVP, ...

• Reutilización código JavaScript

• Speed Tracer Google Chrome Plugin

lunes 25 de julio de 11

“Caso de Éxito”• Aplicación gestión equipos de vídeo móviles

• Servidor Java EE (Glassfish 3.1 OSE, EJB’s + REST)

• BDD PostgreSQL 9.0

• Aplicación de escritorio Swing (NetBeans Platform)

• Cliente(s) web: ubicuidad, ligero, móvil/tablets

• resty-gwt cliente REST, gwt-google-apis Google Maps

• atmosphere[-gwt] para “comet” (“server push”)

lunes 25 de julio de 11

Demo

• Primera toma de contacto desarrollo GWT...

lunes 25 de julio de 11

Enlaces de Interés• http://code.google.com/p/murgtug-mediaplayer/

• http://code.google.com/webtoolkit

• http://code.google.com/p/gwt-rest/

• http://java.net/projects/gwt4nb/pages/Home

• http://mojo.codehaus.org/gwt-maven-plugin/

• http://code.google.com/p/gwtchismes/

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

• http://www.youtube.com/watch?v=PDuhR18-EdM

• http://www.youtube.com/watch?v=aW--Wlf9EFs

lunes 25 de julio de 11