5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 1/56
13/03/12 1
GWT y
SmartGWT
1
Br. Carlos Alberto Borda [email protected]
Desarrollo de interfaces
Web
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 2/56
13/03/12 2
Índicepresentación:Introducción
¿Qué es GWT?
SmartGWT ¿Más listo queGWT?
La tecnología en acción
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 3/56
INTRODUCCIÓN
Primera parte:
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 4/56
13/03/12 4
Introducción
La web síncronaHasta finales de los 90 la web sólo podía funcionar demanera ineficiente ya que se producía la recarga total decada página cada vez que había que actualizar parte de sucontenido. No se podía recargar sólo esa parte.
Para evitar esto se inventó la técnica del framing, queconsiste en el uso de los elementos HTML frame y frameset para dividir las páginas de los sitios web en distintas“páginas” independientes a su vez.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 5/56
13/03/12 5
Introducción
FramesUsualmente una para la cabecera, otra para un menú y otrapara el contenido, que era la que realmente se recargaba.Por la cantidad de problemas que conllevaba esta técnicaera poco recomendable, pero durante muchos años fue laúnica manera de abordar el problema.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 6/56
Introducción
La web asíncronaMicrosoft y Netscape (1996 – 1997) empezaron a utilizar, deforma nativa, elementos que cargaban contenido en unapágina de manera asíncrona, pero de forma muyrudimentaria y alejada de la ingeniería del software.
No fueron sino los desarrolladores de Microsoft (1998)quienes empezaron a aplicar los applets de Java de maneraingeniosa para realizar el envío de datos al servidor y lacarga asíncrona de contenido de manera más elegante.
En 2002, la comunidad de desarrolladores que colaborabanen el proyecto optó por definir la interfaz XMLHttpRequest
(vigente a día de hoy), que debía ser implementada portodos los navegadores para sustituir a los applets eneste cometido.
13/03/12 6
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 7/56
Introducción
La web asíncronaEsta interfaz sería utilizada por código JavaScript para enviar y recibir datos de manera asíncrona utilizando XML para eltransporte de los datos.
Finalmente, se le dio nombre a todo lo anterior: AJAX.
13/03/12 7
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 8/56
13/03/12 8
Introducción
¿Entonces que es AJAX?Como su nombre indica AJAX es:
Asynchronous
JavaScript
And
XMLSi bien puede ser
Synchronous
And
Not XML
JSONHTML
Text/plain
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 9/56
13/03/12 9
Introducción
¿Para qué sirve todo esto?Para que la experiencia de los usuarios en la web seanotablemente mejor. A grandes rasgos:
Evitamos recargar el contenido de una páginainnecesariamente con todo lo que ello conlleva. (reducción detráfico, por lo tanto, de tiempos)
Podemos utilizarlo elegantemente junto a técnicas JavaScriptpara crear aplicaciones web centradas en la experienciade usuario. Rich Internet Applications.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 10/56
13/03/12 10
Introducción
Rich Internet ApplicationsComo a los ingenieros de software nos encantan losacrónimos nos referiremos a ellas como RIAs.
Con mayor o menor fortuna, el objetivo en el desarrollo deRIAs es conseguir aplicaciones web similares a las de
escritorio (pero que se ejecuten en el navegador).Un caso de éxito: Google Docs.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 11/56
13/03/12 11
Introducción
Rich Internet ApplicationsPara ello se suele utilizar
HTML
AJAX
Mucho café
Pero no olvidemos que también existenFlex / Flash: el mejor competidor.
Silverlight: de Microsoft.
JavaFX: de Oracle.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 12/56
13/03/12 12
Introducción
JavascriptEs un lenguaje de script orientado a objetosmuy distinto a lo que esperamos de un lenguajecomo Java o C#.
Se utiliza para manipular el DOM de una páginaweb: accedemos a los elementos que conformanuna página y los modificamos. Desde el estilo deun botón hasta el contenido de una tabla.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 13/56
13/03/12 13
Introducción
JavascriptCada navegador tiene su propio intérprete que, en la vidareal, viene a ser la lacra de esta tecnología…
…porque el mismo código puede nofuncionar igual en dos navegadoresdistintos.
Este indeterminismo nos lleva a varias alternativas
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 14/56
13/03/12 14
Introducción
Diseñar para un navegador en concreto y convencer anuestro cliente de que eso es razonable
Primer problema: nosotros tendemos a desarrollar paraFirefox / Chrome pero ellos usan Internet Explorer (¡inclusoel 5 y el 6!) y no lo van cambiar:
Tienen aplicaciones funcionando en Explorer y no
van a funcionar en otro navegador.Sus procesos de negocio son complejos: delegan
en departamentos que mantienen sussistemas y su acuerdo a nivel de servicio sóloincluye Internet Explorer – la opción clásica ymás segura ya que está respaldada por unagran empresa detrás –
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 15/56
13/03/12 15
Introducción
Segundo problema: si accedemos a desarrollar para Explorernos encontraremos con que no dispondremos de herramientasimprescindibles para el desarrollo web, estándares de facto,como FireBug.
Tercer problema: como ingenieros de software debemosbuscar, entre otras cosas, la mantenibilidad del sistema y nopermitir este tipo de situaciones. Si dentro de unos años laversión del navegador para la que hemos desarrollado elsistema queda obsoleta y el cliente quiere pasar página puedeque le estemos obligando a utilizar software obsoleto y conproblemas de seguridad o a que tire nuestra aplicación a labasura. Y eso nos haría poco profesionales.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 16/56
13/03/12 16
Introducción
Diseñar para un navegador en concreto pero realizar laspruebas en varios. En caso de error buscar una solución paraél.
Esta forma de trabajar no es la ideal ya que puede habersituaciones donde la solución sea muy costosa, sobre todo si sedesea desarrollar para más de dos navegadores distintos.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 17/56
13/03/12 17
Introducción
Mantener una rama de desarrollo de JavaScript por para tipode navegador, específica, probada, segura y estable. Laaplicación detecta el navegador y carga el códigodesarrollado para él.
Los problemas de este sistema son evidentes, pero las ventajastambién.
Es una tarea tediosa e implica multiplicar el esfuerzo.Pero es determinista y cuantificable, requisitos necesariospara ser aceptable desde el punto de vista de la Ingeniería delSoftware.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 18/56
13/03/12 18
Introducción
¿Qué opción elegiríaGoogle?
Pista:
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 19/56
¿QUÉ ES GWT?
Segunda parte:
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 20/56
13/03/12 20
¿Qué es GWT?
¿Y que es GWT?Google Web Toolkit
Google quiere que seamos más productivos y nos regala latecnología GWT, su kit de desarrollo Web.
GWT es un conjunto de herramientas y widgets que
proporciona una forma de crear RIA utilizando AJAX sin tocarni una sola línea de Javascript (si no se desea).
Para ello, el desarrollo de la interfaz se hace en Java, al estilode una aplicación Swing.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 21/56
No es magia… es uncompilador.
El compilador de GWT genera Javascript a partir de las clases Java que escribimos y laGWT Class Library , que es un JRE optimizado para la traducción a Javascript . Estaoptimización consiste, básicamente, en utilizar un subconjunto de tipos del JRE.
13/03/12 21
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 22/56
13/03/12 22
¿Qué es GWT?
El compilador de GWT conoce las particularidades de losnavegadores y para cada navegador genera un archivo Javascript distinto, que se cargará en el navegadoradecuado automáticamente.
Si, además, utilizamos las capacidades multilenguaje deGWT (gracias a la librería I18N) se generará un archivo
Javascript por cada navegador e idioma quedefinamos.
A cada uno de estos archivos se les denomina en ladocumentación como permutación.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 23/56
13/03/12 23
¿Qué es GWT?
El código Javascript que se genera no sólo funciona como seespera, sino que además es muy eficiente.
A parte de haber mapeado la semántica y las funciones deforma eficaz el código se puede ofuscar para minimizar sutamaño (y su legibilidad).
Existen 3 niveles de ofuscación:
Obfuscated (por defecto)
Pretty
Detailed
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 24/56
13/03/12 24
¿Qué es GWT?
Ejemplo Detailed function isHostedMode(){
var result = false;
try {
var query = $wnd.location.search;
return (query.indexOf ($intern_5) != -1 ||
(query.indexOf($intern_6) != -1 || $wnd.external &&$wnd.external.gwtOnLoad)) && query.indexOf($intern_7) == -1;
}
catch (e) {
}
isHostedMode = function(){
return result;}
;
return result;
}
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 25/56
13/03/12 25
¿Qué es GWT?
Ejemplo Pretty function isHostedMode(){
var result = false;
try {
var query = $wnd_0.location.search;
return (query.indexOf('gwt.codesvr=') != -1 ||
(query.indexOf('gwt.hosted=') != -1 || $wnd_0.external &&$wnd_0.external.gwtOnLoad)) && query.indexOf('gwt.hybrid') == -1;
}
catch (e) {
}
isHostedMode = function(){
return result;}
;
return result;
}
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 26/56
13/03/12 26
¿Qué es GWT?
Ejemplo Obfuscated function C(){if(q&&r){var b=n.getElementById(R);var
c=b.contentWindow;if(B()){c.__gwt_getProperty=function(a){return
I(a)}}lmsgwt=null;c.gwtOnLoad(z,R,t,y);o&&o({moduleName:R,session
Id:p,subSystem:S,evtGroup:Y,millis:(new
Date).getTime(),type:Z})}} function D(){if(u[$]){t=u[$];return
t}var e;var f=n.getElementsByTagName(_);for(var g=0;g<f.length;+
+g){if(f[g].src.indexOf(ab)!=-1){e=f[g]}}if(!e){var h=bb;vari;n.write(cb+h+db);i=n.getElementById(h);e=i&&i.previousSibling;w
hile(e&&e.tagName!=eb){e=e.previousSibling}}function j(a){var
b=a.lastIndexOf(fb);if(b==-1){b=a.length}var
c=a.indexOf(gb);if(c==-1){c=a.length}var
d=a.lastIndexOf(hb,Math.min(c,b));return d>=0?
a.substring(0,d+1):Q};if(e&&e.src){t=j(e.src)}if(t==Q){var
k=n.getElementsByTagName(ib);if(k.length>0){t=k[k.length-
1].href}else{t=j(n.location.href)}}else if(t.match(/^\w+:\/\//)){}else{var l=n.createElement(jb);l.src=t+kb;t=j(l.src)}if(i)
{i.parentNode.removeChild(i)}return t}
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 27/56
13/03/12 27
¿Qué es GWT?
Además, GWT nos proporciona unos widgets básicos.Estos widgets son de calidad: eficientes y libres de errores.
Gracias a esto podemos dedicar el tiempo que tenemosasignado a pruebas para probar la funcionalidad, y no lacorrección.
Estos widgets pueden ampliarse mediante nuestrosconocidos mecanismos de herencia para crear widgets máscomplejos.
A continuación un ejemplo muy sencillo.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 28/56
13/03/12 28
¿Qué es GWT?
Ejemplo: Botón que al pulsar abre un pop-up
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 29/56
13/03/12 29
¿Qué es GWT?
public Widget onInitialize() {HorizontalPanel hPanel = new HorizontalPanel();
Button normalButton = new Button(“Normal Button”);
normalButton.addClickListener(new ClickHandler(){
public void onClick(ClickEvent event) {
Window.alert(“Stop poking me!”);
}
});
hPanel.add(normalButton);
return hPanel;
}
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 30/56
13/03/12 30
¿Qué es GWT?
A no ser que te guste desarrollar Javascript, te interesaGWT sea cual sea la tecnología utilizada en la parteservidor de tu aplicación.
GWT es un mecanismo de generación de Javascript a partirde Java. El resultado final es HTML + Javascript que secomunica con un servidor mediante distintos mecanismos,
estándares para cualquier tecnología en el servidor: XML
RPC
Texto / HTML
JSON
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 31/56
13/03/12 31
¿Qué es GWT?
Puedes seguir publicando tus servicios en el lado servidor yutilizarlos en el cliente.
Puedes desarrollar la interfaz en Java con Eclipse y tu parteservidor en .NET con Visual Studio.
Por supuesto también en PHP, Java, Python, Ruby , etc.
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 32/56
¿Qué es GWT?
Motivos para usarlo
Enfoque Orientado a objetos.
Patrones de diseño y UML.
Reutilización de código.
Depuración en Eclipse.
Utilizar tests Junit .
Internacionalización.
Utilizar tu propio Javascript mediante JSNI.
Ofuscación.
Gestionar el historial web (flechas anterior y siguiente).
Aumentar tu rendimiento evitando particularidades de los
navegadores.
13/03/12 32
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 33/56
¿Qué es GWT?
Problemas de GWT
La librería de clases GWT no acepta todos los tipos de la JRE.
Es un enfoque inusual.
Es dificil utilizarlo sobre proyectos ya existentes.
No existen widgets avanzados GWT.
Toda la aplicación se ejecuta en una página. Hay distintos
enfoques con respecto a la seguridad.
La compilación a Javascript es lenta.
En general, las aplicaciones RIA pueden disparar el consumo dememoria.
13/03/12 33
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 34/56
SMARTGWT ¿MÁS LISTOQUE GWT?
Tercera parte:
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 35/56
SmartGWT ¿Más listo que GWT?
¿Más listo que GWT?SmartGWT es un framework basado en GWT.
Consiste principalmente en una extensa librería de widgets que utilizan la librería AJAX SmartClient, es decir, es unaenvoltura de SmartClient para GWT.
Además, están preparados para que una complicadacomunicación cliente-servidor sea más sencilla.
Realmente es una importante alternativa a utilizar GWT yaque proporciona mayor nivel de abstracción, nos regalamucho más que GWT.
Se puede integrar totalmente con GWT.
13/03/12 35
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 36/56
SmartGWT ¿Más listo que GWT?
ListGrid, valioso aliado.
Es una tabla muy potente
Permite reordenar sus columnas
Ordenar filas por cualquier columna
Filtrar filas en tiempo real por cualquier columna
Agrupar filas por campos.
Además es muy adaptablePodemos cargar todo el contenido
simultáneamente o bajo demanda
Permite anidar tablas facilmente
Incorporar iconos, botones o cualquier otroelemento es trivial
Tiene una interfaz para crear filtros (Criteria)
Se puede editar sobre ella y añadir validación a loscampos.
Y se puede conectar al servidor, haciendo transparenteel proceso de alta, baja y modificación.
13/03/12 36
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 37/56
SmartGWT ¿Más listo que GWT?
13/03/12 37
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 38/56
SmartGWT ¿Más listo que GWT?
Tiene cuatro licencias:
LGPL: gratuita, licencia comercial y no comercial.
Professional: soporte para Hibernate, exportación a excel,interfaz visual… 745$ por desarrollador – ilimitada.
Power: características avanzadas de filtrado + modulos paramejorar la eficiencia. 1900$ por desarrollador – ilimitada.
Enterprise: garantía + utilidades. Llame y pregunte por elprecio
13/03/12 38
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 39/56
SmartGWT ¿Más listo que GWT?
El gran problema que tiene SmartGWT es la carencia dedocumentación.
Lamentablemente, las mejores fuentes de información (en inglés)son:
Blogs.
Foros.
Sentido común.No se puede esperar gran cosa de la wiki oficial, aunque sí del foroSmartClient .
Esto no es casual: el servicio de soporte oficial de SmartGWT /SmartClient es de pago.
En varios blogs encontraréis comentarios de desarrolladores de
SmartClient defendiendo su documentación. Cada uno que juzgue.
13/03/12 39
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 40/56
ACCIÓN
Tercera parte:
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 41/56
Acción.
Amueblando la casa Java JDK .
Eclipse.
Plugin Google para Eclipse.
GWT SDK .
Plugins para los navegadores: cuando abramos unnavegador para ejecutar la aplicación en el modo dedepuración nos aparecerá un aviso para que lodescarguemos y un enlace.
13/03/12 41
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 42/56
Acción.
Descomprimir Eclipse.
Descomprimir GWT SDK.
Instalar plugin para eclipse.
Amantes de la consola:
Ir al directorio donde se ha descomprimido GWT SDK.
Ejecutar webAppCreator –out MiApp es.babel.MiApp
13/03/12 42
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 43/56
Acción.
¿Qué es cada cosa?Paquete src:
Client: código del lado cliente que será transformado a Javascript .
Server: código del lado cliente.
Shared: código que comparten cliente y servidor. Estasclases deben implementarse con cuidado:
GWT SDK no acepta todos los tipos del JRE.
En el servidor no se puede ejecutar el código que se traducea Javascript.
13/03/12 43
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 44/56
Acción.
NombreProyecto.gwt.xml: en terminología GWTeste archivo se denomina módulo.
En el módulo definimos:
Qué otros módulos heredamos (User, HTTP, JSON, Junit, XML).
La clase entry-point. Esta es una clase que implementala interfaz EntryPoint cuyo método OnModuleLoad() es elmétodo de entrada al código del lado cliente.
Path a código traducible a Javascript.
Path a recursos estáticos (imágenes, CSS, etc.)
Propiedades.Generadores.
13/03/12 44
ó
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 45/56
Acción.
Con el fin de reutilizar partes de nuestro proyecto,podemos definir varios módulos y utilizar el mecanismode herencia en un módulo a más alto nivel.
El entrypoint sólo se definiría en dicho módulo.
13/03/12 45
ó
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 46/56
Acción.
Paquete test: este paquete es opcional. En él se incluyen lostest JUnit del proyecto.
Paquete war: la aplicación web. En él encontraremos losrecursos estáticos (html, imágenes, css…) y código javascript.
Hay un recurso estático especialmente interesante:
NombreProyecto.HTML
13/03/12 46
ió
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 47/56
Acción.
Este archivo se denominaHost Page
enterminología GWT.
Puede tener vacío el bloque <BODY> ya que GWTse encarga de todo el contenido visual.
Pero GWT también puede insertar ciertos widgets
en lugares determinados de este HTML mediante eluso del atributo id de las etiquetas HTML.
Gracias a ello, podemos añadir la funcionalidad deGWT a aplicaciones que ya existen.
Importante: las Host Pages pueden ser
generadas también por un servlet o por una JSP.
13/03/12 47
A ió
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 48/56
Acción.
Alternativa al layout por defecto.
Puede que nuestro código de lado servidor no sea Java o que,por cualquier circunstancia, prefiramos o necesitemos tenerseparado el código del cliente.
Podemos crear un proyecto GWT sin paquete server y que,gracias a su servidor incorporado, podremos comunicar con
el lado servidor y, aún así, depurar normalmente.
Consejo: debemos tener un archivo de propiedades en elque se defina la url del servidor y utilizarlo en las llamadasasíncronas a servicios.
13/03/12 48
A ió
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 49/56
Acción.
Mecanismo GWT RCP:
Mecanismo mediante el que cliente y servidor
comparten objetos Java a través de HTTP.
Evidentemente, el cliente debe estar implementado en Java.
En el paquete client creamos una interfaz(EjemploService) que, a su vez, implementeRemoteService.
Los métodos que definamos en la interfazcorresponden a servicios que vamos a invocar en elservidor.
En el paquete server creamos la claseEjemploServiceImpl que herede deRemoteServiceServlet e implemente la interfaz quehemos creado (EjemploService).
EjemploServiceImpl es un Servlet . Hay que añadirlo
al descriptor Web.xml.13/03/12 49
A ió
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 50/56
Acción.
Esto es AJAX, necesitamos callbacks que se ejecutencuando el servicio haya dado una respuesta.
Añadiremos un parámetro callback a los servicios quehemos definido en EjemploService utilizando el patrónProxy.
Creamos una interfaz con el mismo nombre pero
añadiendo la terminación Async en el mismo paquete.EjemploServiceAsync.
Si no la creamos, Eclipse nos lo recordará y la creará pornosotros si queremos.
Tendrá los mismos métodos, pero para cada uno de ellos
el tipo de resultado será void y tendrá un nuevoparámetro AsyncCallback<T>, donde T es el tipo deresultado.
13/03/12 50
A ió
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 51/56
Acción.
GWT implementará esta interfaz por nosotrosmediante Generadores.
La instanciaremos así:EjemploServiceAsync ejmpSvc=GWT.Create(EjemploService.class);
Y cuando invoquemos a los métodos de ejmpSvc
creamos una clase AsyncCallback anónima (o no,dependiendo de tu diseño).
La implementación de esta clase conlleva laimplementación de dos métodos: onFailure yonSuccess.
13/03/12 51
A ió
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 52/56
Acción.
JSONRequestBuilder
Existe otro mecanismo que no es GWT RCP para lacomunicación entre cliente y servidor.
Este mecanismo es parecido, pero desacopla casitotalmente ambos mundos.
Sólo se comparten las estructuras JSON que se envían oreciben.
Ojo con los callbacks: siempre se devuelven envueltosen una función.
13/03/12 52
A ió
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 53/56
Acción.
JSONRequestBuilder
En la documentación se utiliza JSNI para parsear el JSON, pero no es necesario.
Consiste en el envío de una llamada asíncrona conparámetros
URL destinoDatos envío
Nombre del callback
13/03/12 53
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 54/56
CONCLUSIONES
Cuarta parte:
Conclusiones
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 55/56
Conclusiones.
GWT sienta las bases para un cambio radical en eldesarrollo web.
SmartGWT y, previsiblemente, otros terceros estánaprovechando el tirón para situarse en el escenario.
No es una solución universal para todos los problemas y,
como hemos visto, plantea algunos.Hoy por hoy y desde el punto de vista del mundo laboral,es la mejor manera de desarrollar RIAs junto conFlex(Muerto).
13/03/12 55
5/14/2018 introduccion Gwt-SmartGwt - slidepdf.com
http://slidepdf.com/reader/full/introduccion-gwt-smartgwt 56/56
13/03/12 56
Java For Smart Information Technologies
http://www.j4sit.com
CuscoUniversidad San Antonio Abad
Facultad De Ing. Informatica y Sistemas4To Piso
ContactosIng. Vladimir Illis Ascue Lovon Br. Carlos Alberto Borda Benito
Email: [email protected] Email: [email protected] : 984381913 cel: 984722333
Top Related