Agora o GWT 1.3 RC é totalmente aberto ( opensource ), incluindo a ferramenta de debugging.

A idéia principal é usar criar um comunidade de desenvolvimento da ferramenta, principalmente para eliminar e erros e criar novas funcionalidades.

Anuncio do lançamento do GWT (Google Web Toolkit ) 1.3 RC OpenSource

Outros artigos sobre AJAX:

Criando uma aplicação em PHP para trabalhar com o Google Calendar

Yahoo! TV: Agora com Ajax.

Componentes do YUI-EXT produzem interfaces profissionais em AJAX!

Yahoo! UI Library – Conheça o AJAX do Yahoo.

Ajax/Javascript Com DHTMLGoodies: Resulta em interfaces profissionais

ADOBE doa código fonte para Mozilla, que pretende criar Framework AJAX

Ajax com Dojo: Tem até gráfico!

JQuery – Uma nova forma de programar em JavaScript

Pyjamas: Criando aplicações AJAX programando em python

Aprendendo AJAX com Google Web Toolkit (GWT) e Eclipse

Um Cliente Samba Feito em Ajax

Ajax é com o Eclipse

Post original do blog E-tinet pode ser acessar pelo link direto GWT 1.3 Release Candidate é 100% de Código Aberto, mas AJAX. O Blog E-tinet - Simplesmente Tecnologia tem autoria de Pedro Delfino dos Santos Neto. Para entrar em contato com o autor acesse /contato. E visite o meu twitter em @pedrodelfino para saber o que eu estou fazendo.

Curso Linux Ubuntu

Para quem não conhece o GWT, ou não sabe como começar a trabalhar com o AJAX usando o GWT, veja também o POST Aprendendo AJAX com Google Web Toolkit (GWT) e Eclipse.

Features:

1. Dynamic, reusable UI componentsCreate a Widget by compositing other Widgets. Lay out Widgets automatically in Panels. Send your Widget to other developers in a JAR file.
2. Really simple RPCTo communicate from your web application to your web server, you just need to define serializable Java classes for your request and response. In production, GWT automatically serializes the request and deserializes the response from the server. GWT’s RPC mechanism can even handle polymorphic class hierarchies, and you can throw exceptions across the wire.
3. Browser history managementNo, AJAX applications don’t need to break the browser’s back button. GWT lets you make your site more usable by easily adding state to the browser’s back button history.
4. Real debuggingIn production, your code is compiled to JavaScript, but at development time it runs in the Java virtual machine. That means when your code performs an action like handling a mouse event, you get full-featured Java debugging, with exceptions and the advanced debugging features of IDEs like Eclipse.
5. Browser compatibleYour GWT applications automatically support IE, Firefox, Mozilla, Safari, and Opera with no browser detection or special-casing within your code in most cases.
6. JUnit integrationGWT’s direct integration with JUnit lets you unit test both in a debugger and in a browser…and you can even unit test asynchronous RPCs.
7. InternationalizationEasily create efficient internationalized applications and libraries.
8. Interoperability and fine-grained controlIf GWT’s class library doesn’t meet your needs, you can mix handwritten JavaScript in your Java source code using our JavaScript Native Interface (JSNI).
9. As we mentioned when we released the 1.2 Release Candidate, you can now develop and debug with GWT on Mac OS X in addition to Linux and Windows. We are pretty proud of this particular feature because GWT is now about as “platform independent” as you can get: develop on Windows, Linux or Mac OS X and deploy to IE, Firefox, Safari and Opera on any platform, without any special cases in your code. (If you want a bit more detail about our implementation of Mac OS X support, our release nomenclature and other tidbits, this recent InfoQ interview may interest you.)

Post original do blog E-tinet pode ser acessar pelo link direto Conheça a Atualização do GWT – Google Web Toolkit 1.2, mais Ajax. O Blog E-tinet - Simplesmente Tecnologia tem autoria de Pedro Delfino dos Santos Neto. Para entrar em contato com o autor acesse /contato. E visite o meu twitter em @pedrodelfino para saber o que eu estou fazendo.

Curso Linux Ubuntu

Resumindo com o GWT você cria aplicações AJAX a partir classes em JAVA, o framework do Google faz todos o trabalho de conversão dos códigos do JAVA para JavaSript e XML, tornando o desenvolvimento do AJAX restrito somente na programação JAVA.

Cada vez que eu uso o meu Gmail penso: o AJAX realmente facilita as coisas, no Google varias aplicações usam o AJAX, com isso podemos criar site/aplicações web com a mesma tecnologia que o Google usa.

Primeiro vamos fazer o download do GWT no http://code.google.com/webtoolkit ( tem a versão para Linux e windows, estarei usando o Linux mas pouca coisa muda para o windows ). Outro requisito é ter o Eclipse instalado ( com Web Tools Project – WTP), eu usei O Eclipse Callisto para facilitar o trabalho, e claro estou considerando que o JAVA esta instalando e configurado. Vamos começar instalando o GWT, eu intalei em /opt mas pode ser em qualquer diretório, ( bom seria colocar o diretório do GWT em sua variável PATH).

Será criado o diretório gwt-linux-1-0.21, ou seja o /opt/ gwt-linux-1-0.21 é o diretório que esta instalado o GWT.

Estrutura de arquivos do GWT, O arquivo index.html traz os links para as documentações e exemplos incluídos no pacote padrão.

Agora crie um diretório onde ficará o nosso projeto de teste.

Criando o Projeto no padrão do Eclipse.

O GWT traz dois utilitários para a criação do projeto já no padrão do Eclipse com todas as bibliotecas necessárias já configuradas.

Onde EtiGwt é o nome no projeto criado.

Depois execute:

Acima foi criado a estrutura básica de um projeto no Eclipse, com as devidas configurações das bibliotecas
do GWT.

Agora acesse o seu eclipse e importe o projeto criado. ( menu File -> Import )

Acesse o diretório onde você criou o projeto

Será carregado o projeto criado pelo GWT, no exemplo o EtiGwt

Com isto estará criado a estrutura padrão do nosso projeto no eclipse

Onde, o código de exemplo gerado esta no pacote com.eti.client ( o arquivo .java). O pacote com.eti tem um diretorio public que guarda os arquivos HTML que são usados para apresentar os componentes do GWT.

Rodando o código de exemplo.

Apenas para demonstrar como é feita a execução de uma aplicação feita em GWT, vá até o shell dentro do diretório onde esta o projeto do eclipse e execute.

Será executado a aplicações sem a necessidade de fazer a compilação.

Clicando no botão Click me, você verá a pequena e famosa mensagem , “Hello World!”

Estudando um pouco o código é bem simples:

01 componente Button: que é o botão click me

01 componente Label: Que é o texto “Hello World”

Foi adicionado uma ação ao clicar no componente Button ( com o button.addClickListener …), esta ação mostra a mensagem no Label modifica o texto padrão do Label ( setText() ) como “” ( ou seja em branco ). Ao fim é chamado o gerenciador de painéis (Panel, esta é uma classe muito importante) para colocar os dois componentes nas devidas especificações do artigo EtiGwt.html, através da TAG id dentro do html.

GWT a documentação:

A grande vantagem é que o GWT tem um ótima documentação ( claro que não é tudo, mas para começar esta muito bom ), e vamos usar um exemplo da documentação para mostrar mais um código.

Acesse o arquivo index.html dentro do diretório de instalação do GWT.

Depois acesse o link da documentação.

Você terá exemplos dos componentes (Widgets) disponíveis, e toda a documentação das classes sempre com um pequeno exemplo de código.

Acesse a documentação do pacote com.google.gwt.user.client.ui.

Acesse o linke o componente COMPOSITE.

Copie o exemplo ( o código em verde ) o cole no eclipse dentro do arquivo EtiGwt.java, como abaixo.

Repare que o eclipse aponta vários erros no código isto porque os “imports” das classes necessárias não estão feitos, o eclipse mesmo já sugere quais são as classes que estão faltando ( basta clicar em um linha que esta indicando o erro) . Abaixo os “imports” depois da modificação feita automaticamente pelo eclipse

Cole também o código abaixo com o chamado do “RootPanel.get” dentro do método onModuleLoad() existente, para mostrar o novos componentes no fim da tela O código completo deve ficar mais ou menos assim.


package com.eti.client;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.CheckBox;
import com.google.gwt.user.client.ui.ClickListener;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.VerticalPanel;
import com.google.gwt.user.client.ui.Widget;
/**
*
* Entry point classes define onModuleLoad().
*/
public class EtiGwt implements EntryPoint {
/**
* A composite of a TextBox and a CheckBox that optionally enables it.
*/
public static class OptionalTextBox extends Composite implements ClickListener {
private TextBox textBox = new TextBox();
private CheckBox checkBox = new CheckBox();
/**
* Constructs an OptionalTextBox with the given caption on the check.
*
*
* @param caption
* the caption to be displayed with the check box
*/
public OptionalTextBox(String caption) {
// Place the check above the text box using a vertical panel.
VerticalPanel panel = new VerticalPanel();
panel.add(checkBox);
panel.add(textBox);
// Set the check box’s caption, and check it by default.
checkBox.setText(caption);
checkBox.setChecked(true);
checkBox.addClickListener(this);
// All composites must call setWidget() in their constructors.
setWidget(panel);
// Give the overall composite a style name.
setStyleName(“example-OptionalCheckBox”);
}
public void onClick(Widget sender) {
if (sender == checkBox) {
// When the check box is clicked, update the text box’s enabled state.
textBox.setEnabled(checkBox.isChecked());
}
}
/**
* Sets the caption associated with the check box.
*
*
* @param caption
* the check box’s caption
*/
public void setCaption(String caption) {
// Note how we use the use composition of the contained widgets to provide
// only the methods that we want to.
checkBox.setText(caption);
}
/**
* Gets the caption associated with the check box.
*
* @return the check box’s caption
*/
public String getCaption() {
return checkBox.getText();
}
}
/**
* This is the entry point method.
*/
public void onModuleLoad() {
final Button button = new Button(“Click me”);
final Label label = new Label();
button.addClickListener(new ClickListener() {
public void onClick(Widget sender) {
if(label.getText().equals(“”)) {
label.setText(“Hello World!”);
else
label.setText(“”);
}
}
}
);
// Assume that the host HTML has elements defined whose
// IDs are “slot1″, “slot2″. In a real app, you probably would not want
// to hard-code IDs. Instead, you could, for example, search for all
// elements with a particular CSS class and replace them with widgets.
//
RootPanel.get(“slot1″).add(button);
RootPanel.get(“slot2″).add(label);
// Create an optional text box and add it to the root panel.
OptionalTextBox otb = new OptionalTextBox(“Check this to enable me”);
RootPanel.get().add(otb);
}
}


Execute novamente a aplicação:

Teremos agora no fim da pagina, um checkBox e abaixo um TextBox, onde o TextBox pode ser habilidade e desabilitado com base no checkBox .

Analisando rapidamente o código:

Criamos um método em nossa classe que tem como objetivo mostrar um TextBox (OptionalTextBox) onde é possível desabilita-lo através de um CheckBox Estes dois componentes foram alinhados com o gerenciador de painéis (Panel) na vertical ( ou seja um abaixo do outro ).Foi atribuído ao CheckBox um texto padrão que neste caso é o titulo do Check, checkBox , .setText(caption).Foi atribuído uma ação ao Check Box, que será o responsável por habilitar e desabilitar o TextBox.

Conclusão:

Temos em mãos um ótimo framework e claro com todo o suporte do google, este exemplo é realmente simples usei um exemplo pronto da documentação do GWT, experimente isto, pegar cada classe e fazer o testes. O Gerenciador de painéis DockPanel é muito interessante e vale a pena ser estudado. Neste exemplo não foi usado acesso a bando de dados, tarefa que claro esta disponíveis no GWT, também existe a possibilidade de integrar o GWT com o acesso ao banco de dados em PHP, o mais comum e default seria fazer acesso a banco de dados com JDBC, o GWT traz as classes necessárias para fazer esta interface.

Aguardo comentários, e sugestões para estudar e criar aplicações em GWT.

Link interessantes sobre o GWT:

Site com muitos tutoriais e links de novos component GWT

Plugin do eclipse para desenvolvimento Web

intellij.net IDE com suporte ao GWT

Outros artigos sobre AJAX:

Criando uma aplicação em PHP para trabalhar com o Google Calendar

Yahoo!TV: Agora com Ajax.

Componentes do YUI-EXT produzem interfaces profissionais em AJAX!

Yahoo! UI Library – Conheça o AJAX do Yahoo

Ajax/Javascript Com DHTMLGoodies: Resulta em interfaces profissionais

ADOBE doa código fonte para Mozilla, que pretende criar Framework AJAX

Ajax com Dojo: Tem até gráfico!

JQuery – Uma nova forma de programar em JavaScript

Pyjamas:Criando aplicações AJAX programando em python

Aprendendo AJAX com Google Web Toolkit (GWT) e Eclipse

Um Cliente Samba Feito em Ajax

Ajax é com o Eclipse

Post original do blog E-tinet pode ser acessar pelo link direto Aprenda AJAX com Google Web Toolkit (GWT), Usando o IDE Eclipse. O Blog E-tinet - Simplesmente Tecnologia tem autoria de Pedro Delfino dos Santos Neto. Para entrar em contato com o autor acesse /contato. E visite o meu twitter em @pedrodelfino para saber o que eu estou fazendo.

Curso Linux Ubuntu