O Google Web Toolkit (GWT) permite desenvolver aplicações web ricas em Java usando Ajax, transformando o código Java em JavaScript para rodar no navegador. Ele oferece suporte a plugins para Eclipse e NetBeans e permite adicionar estilos CSS. O GWT facilita a criação de interfaces com componentes como botões, caixas de texto e diálogos sem recarregar a página.
1. Google web Toolkit
O Google web toolkit (GWT) é um kit de ferramenta de desenvolvimento para
aplicações web feita pela google ela permite que se faça aplicações ricas com
ajax usando apenas java ele permite a comunicação cliente servidor, você
pode desenvolver com ele em qualquer IDE java além de ser open source.
O gwt basicamente transforma o código java em javascript, que rodará em seu
navegador com isso é possível “debugar “linha por linha do seu código.
Para começar a utilizar o gwt basta simplesmente ir ao site
http://code.google.com/intl/pt-BR/webtoolkit/download.html e baixar o seu
SDK , Kit de Desenvolvimento de Software.
Tanto o ecilpse como o Netbeans já possuem plugins para desenvolver no gwt,
no caso do netbeans basta somente baixar o plugin GWT4NB, presente no
menu ferramentas e no item plugin e após sua instalação selecionar o local
aonde se encontra o SDK e no caso do eclipse basta somente instalar o plugin
sem precisar baixar o SDK já que ele faz isso junto com a instalação.
2. Tão logo se inicie um projeto usando o gwt não importando a IDE existe uma
básica estrutura do gwt como mostra a figura.
GWT no NetBeans
GWT no Eclipse
Reparem que ambos possuem o arquivo com extenção .gwt.xml este arquivo é
o descritor gwt sua função é comandar o processo de transição java/javascript.
A aplicação gwt é constituída a partir de módulos a sua própria arquitetura é
realizada de forma modular então ao criar novos módulos pode-se herdar tudo
o que foi feito em outros módulos.
Agora vamos fazer um pequeno exemplo utilizando o GWT, para esse exemplo
estarei utilizando o netbeans versão 6.8 após a instalação do plugin crie um
novo projeto java web e em frameworks selecione a opção Google Web ToolKit
e em seguida informe o local aonde o SKD se encontra como mostra na figura
abaixo.
3. Tão logo iniciado o projeto existe três componentes principais o
exemplo.gwt.xml, já explicado anteriormente, a classe exemploEntryPoint
como o nome dá a ideia é o ponto de entrada da aplicação é a partir dela que
se constrói a aplicação e o html no qual a aplicação roda.
O descritor gwt chamando a classe Entrypoint para iniciar a aplicação
Html chamando o sua classe java agora javascript
Uma informação importante na estrutura de aplicativos usando o gwt é que as
classes dentro do pacote br.com.client são transformadas em JavaScript,
enquanto dentro de br.com.server o conteúdo permanece em Java rodando
dentro do web-server. Além dessa transformação o GWT também otimiza o
código gerado, removendo método que nunca é usado ou que sempre retorna
o mesmo valor.
Vamos agora criar alguns componentes em gwt com recurso ajax para isso
vamos apenas modificar o arquivo exemploEntryPoint.java.
Reparem a semelhança do gwt com o swing, agora é possível construir
novíssimos conceitos de aplicações ricas com aquele velho conceito básico do
swing do java.
Para esse exemplo criaremos oito componentes básicos quatro botões, um
combobox, um label, uma caixa de dialogo e uma caixa de texto. Com a caixa
de texto será inserido valor no combobox a partir de um botão ou modificará o
texto com o segundo botão, o terceiro botão irá chamar a caixa de dialogo e o
quarto e ultimo botão irá simplesmente mostrar e esconder os componentes
todos esses recursos sem precisar atualizar a tela usando o ajax.
4. Uma tarefa que tirava noite de vários desing pode agora ser feito de maneira
bastante simples, para não delongar muito esse artigo não demonstrarei o
código aqui, mas no final estarei disponibilizando um link com todo o projeto.
O gwt permite que você use qualquer outro recurso em conjunto com ele,
como html, folha de esilo e até mesmo outros frameworks. No nosso caso
estaremos adicionando uma folha de estilo. Em adicionar arquivo escolha a
opção outro e então escolha folha de estilo em cascata.
Reparem que é possível também modificar o estilo do componente gwt.
5. Feito as modificações e adicionando a folha de estilo é somente compilar o
projeto uma desvantagem do gwt é o fato dele exigir um alto poder
computacional para compilar os seus códigos e transforma-los para javascript
além do tempo para executar a operação.
6. Como todos os componentes são classes você pode simplesmente criar uma
classe que “herde” de um componente e modifica-lo se assim o quiser em fim
o céu é o limite.
O gwt é uma ferramenta fantástica nesse exemplo utilizamos o glassfish versão
3 como servidor, mas ele é compatível com qualquer outro servidor java como
o tomcat e o Jboss. Existe hoje várias ferramentas bastante semelhantes com o
gwt servindo inclusive como extenção. Com o crescimento acelerado de sites e
de aplicativos web o grande diferencial é o uso de uma web rica e o uso de
ajax. Utilizar várias janelas ou até mesmo ficar recarregando toda a página
para fazer apenas uma pequena modificação pode se tornar algo meio “chato”
para um usuário final e com o gwt você pode ter inclusive sistemas em apenas
uma janela do seu navegador bem semelhante ao um aplicativo desktop de
uma maneira extremamente fácil.
Links:
http://code.google.com/intl/pt-BR/webtoolkit/
http://gwt.google.com/samples/Showcase/Showcase.html#!CwHyperlink
O projeto:
http://softwarelivre.org/otagonsan/codigofonte/gwt.zip