-Tutorial GWT- Parte1. Desarrollo de una aplicación Web usando GWT.

Este tutorial sera dividido en tres partes, ya que se cubriran los diferentes aspectos a tener en cuenta al momento de desarrollar una aplicación Web usando el Google Web Toolkit (GWT) bajo el sistema operativo Linux (Ubuntu) y usando el IDE Eclipse. Antes de comenzar, se debe tener instalado Eclipse (ver el tutorial Como instalar Eclipse en Ubuntu). El primer paso a seguir es descargar el GWT de la pagina oficial del proyecto http://code.google.com/webtoolkit/ en un directorio cualquiera, preferiblemente que se encuentre en nuestro home. El archivo descargado tiene la extensión .tar.bz2, para descomprimirlo usamos la siguiente instrucción por consola: tar xvjf gwt-linux-1.5.3.tar.bz2 Aunque se pueden crear proyectos para Eclipse usando algunas herramientas del GWT, en nuestro caso vamos a usar el plugin para Eclipse desarrollado por Cypal, llamado Cypal Studio for GWT, este lo podemos descargar del sitio oficial: http://www.cypal.in/ Una vez descargado y descomprimido, copiamos los archivos *.jar en la carpeta plugins del Eclipse (En caso de tener instalado el Eclipse en el directorio opt debemos tener permisos de root). Una vez realizados estos pasos, procedemos a abrir el Eclipse. Entramos por Window → Preferences damos click a la opción Cypal Studio, allí especificamos la ruta donde se encuentra el GWT, tal como se ve en la siguiente figura:

Damos click en Apply y luego en OK.

Para verificar que todo esté bien, vamos a realizar una aplicación de prueba. Para esto creamos un proyecto tipo Dynamic Web Project y configuramos el proyecto de la siguiente forma:

Damos click en Finish (Es posible que Eclipse te sugiera otra perspectiva, sin embargo, es preferible conservar la perspectiva Java).

Una vez creado el proyecto, nos ubicamos en la raíz y con click derecho seleccionamos New → Other... Nos ubicamos en la opción Cypal Studio y creamos un nuevo modulo, tal como se muestra en la siguiente figura:

Damos click en Next y configuramos el modulo de la siguiente forma:

Click en Finish para terminar.

Con esto se ha creado la jerarquía y archivos suficientes para hacer nuestro primer ejemplo. En el archivo HolaMundo.java ingresamos el siguiente código:

com.camigira.ejemplo.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.ClickListener;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.Widget;

public class HolaMundo implements EntryPoint {

public void onModuleLoad() {
Button button = new Button("Prueba");
button.addClickListener(new ClickListener() {
public void onClick(Widget sender) {
Window.alert("Hola Mundo");
}
});
RootPanel.get().add(button);
}
}

Para probar si funciona, nos ubicamos en el archivo HolaMundo.gwt.xml damos click derecho Run As → GWT Hosted Mode Application. Con esto nos debería aparecer tanto el GWT Development Shell como el navegador de prueba con un botón, el cual al darle click hace aparecer una ventana de alerta con la frase Hola Mundo.

Por: Camilo Giraldo J