Google Web Toolkit *

Clrio Damasceno Soares, Daniel da Silva Filgueiras e Fbio Figueiredo da Silva Universidade Federal de Juiz de Fora UFJF-MG Campos Universitrio Bairro Marmelos Juiz de Fora MG Brasil 1- Introduo GWT uma ferramenta para constru !o de interfaces We" mais ami#veis e rpidas$ % GWT foi feito para facilitar e a#ilizar o processo de desenvolvimento das interfaces de aplica &es We" utilizando 'J'($ % desenvolvimento de aplica &es )ue utilizam o con*unto de tecnolo#ias )ue +o*e s!o c+amadas de 'J'( * lu#ar comum, mas todo esse movimento trou-e novos pro"lemas, como o aumento considervel da )uantidade de c.di#o Java/cript em aplica &es 0e"$ 1ssa volta do Java/cript a tona no mercado trou-e pro"lemas da n!o t!o distante #uerra dos nave#adores 0e", onde cada fornecedor 2na poca a Microsoft e a 3etscape4 implementavam a lin#ua#em Java/cript de uma forma diferente$ 5sso terminou por #erar pro"lemas, principalmente para os desenvolvedores, )ue tin+am reescrever partes intera das aplica &es para #arantir a compati"ilidade entre os diversos nave#adores$ ' implementa !o diferenciada do 'J'( pelos nave#adores atuais trou-e mais uma vez o fantasma da incompati"ilidade do Java/cript para a vida dos desenvolvedores$ 6o*e, com o #rande apelo dessa nova tecnolo#ia, sur#iram diversos frame0or7s )ue prometem simplificar o desenvolvimento de aplica &es utilizando 'J'( e um destes frame0or7s o Goo#le We" Tool7it 2GWT4, desenvolvido dentro do Goo#le e li"erado pelos seus desenvolvedores como soft0are livre$ 8iferentemente de outros frame0or7s, )ue normalmente fazem com )ue voc9 ainda ten+a )ue escrever :#anc+os; em Java/cript para a sua aplica !o utilizar as facilidades do 'J'(, o GWT dei-a com )ue voc9 escreva o c.di#o da aplica !o completamente em Java, para )ue voc9 possa ter todas as facilidades )ue o desenvolvimento Java prov9, como am"ientes de desenvolvimento inte#rados de alta )ualidade, tipa#em esttica e de"u# nativo$ 'p.s escrita a aplica !o, um compilador especial transforma o c.di#o Java em c.di#o Java/cript, para )ue ele possa e-ecutar no nave#ador cliente$ 1 como voc9 * deve ima#inar, os desenvolvedores do pro*eto se preocuparam com a compati"ilidade e fizeram com )ue o c.di#o #erado fosse #arantidadamente compat<vel com os nave#adores mais utilizados da atualidade$ ' a"orda#em to GWT, entretanto, tem uma desvanta#em, pois como o c.di#o Java transformado em c.di#o$ Java/cript para e-ecutar no nave#ador, apenas al#umas classes do Java est!o dispon<veis para uso 2em sua maioria classes dos pacotes :*ava$lan#; e :*ava$util;4 e funcionalidades avan adas da lin#ua#em 2como acesso a "ancos de dados4 tem )ue ser feitos utilizando o suporte a invoca !o remota de mtodos do GWT, )ue faz a ponte entre a aplica !o no nave#ador e o c.di#o Java no servidor$ 1.1- O que GWT % GWT o frame0or7 'J'( do Goo#le$ =ra )uem n!o con+ece, 'J'( uma si#la )ue si#nifica 's>nc+ronous Javascript 'nd (M?$ 3a prtica 'J'( proporciona aos usurios umas e-peri9ncias mais ricas, semel+antes @ interatividade atin#ida nos sistemas des7top$ Um "om e-emplo de aplica !o 'J'( o #oo#le maps$

Uma aplica !o escrita em GWT "asicamente dividida em duas partesA Cliente /ervidor

Cliente onde :a m#ica acontece; o local onde o compilador traduz o c.di#o Java para Javascript$ 3esse local ocorrem as maiores limita &es$ 8isp&e-se apenas de al#umas classes da '=5 Java como, por e-emplo, os tipos "sicos da lin#ua#em, seus respectivos 0rappers$ 'l#umas classes do Collections Frame0or7$ ' maior parte do c.di#o escrito no lado do cliente derivada dos componentes, Wid#ets, fornecidos pela api$ 's classes disponi"ilizadas no pacote com.google.gwt.user.client.ui este pacote contm os componentes #rficos$ Servidor a li"erdade total, inclusive para usar as novas funcionalidades da api B$C de Java$ Toda a estrutura de acesso a "anco de dados e )ual)uer outra tecnolo#ia devem permanecer no servidor$

' fi#ura acima ilustra o )ue e como sria$ 8ispon<vel em D +ttpAEEima#es$#oo#le$com$"rEima#esF+lGptBHIsourceG+pI)G#0tI#"vGJIa)GfIo)GK 'cesso LC dez JCCM

1.2- orque o GWT!

Fazer um sistema de informa !o em Java envolve muito mais tarefas do )ue simplesmente a codifica !o do sistema$ 'tualmente at mesmo a tarefa de escol+er as tecnolo#ias )ue ser!o utilizadas em cada camada da aplica !o n!o das mais simples$ % GWT, por e-emplo, s. mais um frame0or7 para a camada de apresenta !o de uma aplica !o$ ' #rande diferen a destas novas op &es )ue o seu resultado muito mais "onito )ue uma p#ina 6TM? tradicional 2e isto o"tido com muito menos esfor o4$ =orm, o "om e vel+o 6TM? ainda 2e ser por muito tempo4 Ntil, pois se*a em des7tops )uanto em dispositivos m.veis, )ual)uer coisa )ue tem cone-!o com a 0e" possui automaticamente al#uma forma de mostrar conteNdo 6TM?$ =or fim o GWT permite )ue os desenvolvedores de fazer de"u#$ O camada de apresenta !o das suas aplica &es We" P /endo assim, GWT a op !o para )uem )uer pu"licar suas aplica &es We" em 6TM?, porm prefere codificar em Java do )u9 em Javascript$

1."- #$r$cter%stic$s& Compilador )ue transforma c.di#o Java em Java/criptQ Gera apenas c.di#o utilizado 21conomia de espa o4Q Cria vers&es da aplica !o para cada tipo de "ro0serQ 8ividida em Cliente e /ervidorQ Usa os famosos princ<pios de Hemote =rocedure Call 2H=C4$

1.'- ($nt$gens& 1vita incompati"ilidades entre "ro0sers e plataformasQ 1rros encontrados em tempo de compila !oQ /uporte o teste Unitrio com JunitQ 1limina trec+os de c.di#o n!o utilizados$ 8ispon<vel para Windo0s, ?inu- e Mac =ro*eto %pen-/ource do Goo#le 3!o necessrio sa"er Java-/cript 1conomia de 1spa o =rocesso de do0nload diferenciado

O poss<vel utilizar )ual)uer :de"u##er;Java com o GWTQ % c.di#o #erado compat<vel com a maioria dos nave#adoresQ /uporte especial ao "ot!o :voltar;do nave#adorQ 5nte#ra !o completa com o JUnitQ /uporte a internacionaliza !o padr!o do JavaQ Controle total so"re a aplica !o e possi"ilidade de e-tens!o utilizando a J/35 2Java/cript3ative5nterface4Q 2Ruase4 todo o c.di#o escrito Java, nada de a"surdos de Java/criptQ MU5T%/ componentesQ

1.)- *es+$nt$gens& 3em todas as classes da "i"lioteca padr!o de Java s!o emuladasQ 6 menor controle so"re o c.di#o do cliente no aplicativo$ 3!o poss<vel utilizar todas as classes do Java, apenas um con*unto delasQ

2- re,$r$ndo o -mbiente O necessrio )ue voc9 fa a o do0nload do ar)uivo )ue contm o frame0or7, ele est dispon<vel em 2infelizmente s. e-istem vers&es das ferramentas de desenvolvimento para Windo0s e ?inu-, mas as aplica &es #eradas e-ecutam na maioria dos nave#adores4A +ttpAEEcode$#oo#le$comE0e"tool7itEdo0nload$+tml 'lm do frame0or7, interessante )ue voc9 utilize um am"iente de desenvolvimento 2como o 1clipse ou 3etBeans4 e ten+a tam"m o 'nt instalado na sua m)uina$ % 'nt est dispon<vel emA +ttpAEEant$apac+e$or#E 'p.s fazer o do0nload do ar)uivo do frame0or7, voc9 deve colocar a pasta descompactada no ='T6 do seu sistema operacional, para )ue as ferramentas de lin+a de comando possam ser e-ecutadas com facilidade$ 'o instalar o 'nt, lem"re se de definir a varivel de am"iente J'S'T6%M1 apontando pro diret.rio onde foi instalado o seu Java 8evelopment Uit 2J8U4 e de colocar a pasta :"in; da instala !o do 'nt tam"m no ='T6 do seu sistema operacional, para poder e-ecutar as c+amadas ao 'nt pela lin+a de comando$ Se*a no lin7 a"ai-o um v<deo de instala !o do GWT com eclipseA Cli)ue a)ui Obser+$o&

% 'nt uma ferramenta para a automa !o de "uilds no seu pro*eto, por e-emplo, atualiza o classpat+, compila o c.di#o separando os $*ava e os $class em diret.rios distintos, #era *avadoc do pro*eto, confi#ura e e-ecuta a aplica !o$ 1ntre suas maiores virtudes o fato de ser independente de /istema %peracional, pois feito em Java$ =or )ue usar 'nt se meu 581 favorito faz muitas dessas fun &esF =or)ue 'nt alm de ser independente de /%, tam"m independente de 581 alm das principais 581s do mercado * tra"al+arem com o 'nt +o*e$ Primeiro passo:

% 'nt um pro*eto open source, produzido pelo #rupo Ja7arta da Funda !o 'pac+e$ =ara tra"al+ar com o 'nt voc9 precisa deA JJ/8U instalado, pois o 'nt uma aplica !o Java 'nt 2l.#ico4$ ?em"re-seA muitas 581s * vem com o '3T em"utido 2*edit, eclipse, etc$$4$ Mas se voc9 )uiser aprender como tudo funciona, instale o ant voc9 mesmoP Soc9 deve "ai-ar o 'nt a)uiA +ttpAEE*a7arta$apac+e$or#EantE"indo0nload$c#i$

"- .od$ndo um$ $,lic$o 3a pasta samples, dentro da pasta de instala !o do GWT, e-istem al#uns e-emplos prontos para serem e-ecutados$ =ara isto, entre em al#uma pasta dentro de samples e e-ecute o ar)uivoA /nome ,rogr$m$0-s1ell.cmd 21osted mode3 O4 /nome ,rogr$m$0-com,ile. cmd 2Web 5ode3 'p.s a compila !o 2We" Mode4, deve-se e-ecutar o ar)uivo +tml de mesmo nome da aplica !o, contido na pasta www/<caminho da aplica o! ' Fi#ura L mostra a e-ecu !o em 6osted Mode do e-emplo Mail contido na pasta samples$ 3este caso, para e-ecutar a aplica !o em We" Mode, deve-se e-ecutarA Mail-compile.cmd 1m se#uida, deve-se a"rir o se#uinte ar)uivo no nave#adorA WWW/com.google.gwt.sample.mail.Mail/Mail.html

Figura 1 - Rodando uma aplicao GWT

".1- #ri$ndo -,lic$6es % GWT prov9 um m.dulo 2$,,lic$tion#re$tor.cmd4 para cria !o de aplica &es por lin+a de comando, sem a necessidade de )ual)uer 581$ 3a pasta de instala !o do #0t, e-ecuteA applicationCreator.cmd org.ufscar.client.HelloWorld 2para criar a aplica !o no diret.rio atual4 O4 applicationCreator.cmd out <dire"#rio de sa$da! org.ufscar.client.HelloWorld 2para especificar outro diret.rio de cria !o da aplica !o4 ' Nltima pasta do camin+o deve ser sempre :client;$ '#ora, e-ecuteA HelloWorld-shell.cmd 26osted mode4 O4 HelloWorld-compile.cmd 2We" mode4

".2- #ri$ndo -,lic$6es com 7cli,se % Goo#le We" Tool7it possui um m.dulo 2pro*ectCreator$cmd4 responsvel pela cria !o de pro*etos 1clipse$ ' sinta-e de e-ecu !o a se#uinteA projectCreator.cmd eclipse <nome projeto applicationCreator.cmd eclipse <nome projeto <nome aplica!"o 8epois, "asta a"rir o pro*eto usando o 1clipse$

"."- #ri$ndo -,lic$6es com 8et9e$ns =ara a cria !o de aplica &es para o 3etBeans, pode-se usar o plu#in : gwt#n$; dispon<vel em +ttpsAEE#0tVn"$dev$*ava$netE$ % uso do 581 3etBeans ser o foco deste tutorial$ Crie uma nova aplica !o We", escol+endo o Frame0or7 Goo#le We" Tool7it 2fi#ura J4$

:igur$ 2 - #ri$o de 4m$ -,lic$o GWT no 8et9e$ns

'ntes de rodar a aplica !o, certifi)ue-se de )ue as "i"liotecas :#0t-dev-0indo0s$*ar;, :#0t-servlet$*ar; e :#0t-user$*ar; est!o inseridas no pro*eto$ Caso elas n!o ten+am sido inseridas automaticamente, insira-as manualmente 2=ropriedades de =ro*eto -KBi"liotecas -K 'dicionar J'HE=asta4 2ve*a Fi#ura W4$ 1las est!o contidas na pasta de instala !o do GWT$

:igur$ " - -dicion$ndo $s bibliotec$s necess;ri$s do GWT ".".1- #ri$ndo $ ,rimeir$ $,lic$o 28et9e$ns3 Crie uma nova aplica !o We", de nome 1-emploGWT, escol+endo o Frame0or7 Goo#le We" Tool7it 2Fi#ura J4$ % nome do m.dulo GWT pode ser )ual)uer um$ Samos usar or#$ufscar$6elloWorld$ /er criado o pro*eto 1-emploGWT contendo nos pacotes de c.di#o fonte o ar)uivo 6elloWorld1ntr>=oint$*ava 2a classe principal4 e o ar)uivo 6elloWorld$#0t$-ml 2o ar)uivo )ue contm informa &es so"re o pro*eto4$ Toda aplica !o GWT inicia-se por uma classe espec<fica, )ue implementa um 1ntr>=oint )ue, para n.s a classe 6elloWorld1ntr>=oint$*ava$ % primeiro mtodo )ue e-ecutado c+ama-se onModule?oad24$ Certifi)ue-se de )ue o pro*eto conten+a as "i"liotecas necessrias do GWT$ /!o elas :#0t-dev-0indo0s$*ar;, :#0t-servlet$*ar; e :#0t-user$*ar;$ Caso as "i"liotecas n!o foram inseridas automaticamente, insira-as manualmente 2=ropriedades de =ro*eto XBi"liotecas X'dicionar J'HE=asta4 2ve*a Fi#ura W4$ 1las est!o contidas na pasta de instala !o do GWT$ ' fi#ura V mostra a e-ecu !o do pro*eto neste ponto$ %"s$A ' e-ecu !o em 581s sempre cria a vers!o We" da aplica !o$

Figura 4 - Hello World com GWT

"- #oncluso %"servamos )ue para )uem * desenvolve para We" o GTW um modo de tra"al+o )ue veio para ficar pois alm de utilizar Frame0or7s facilita e muito na cria !o alm de )ue o resultado final muito mais a#radavl$ Todavia novos Frame0or7s ainda est!o sur#indo para resolver outros pro"lemas, entretanto o c.di#o produzido por GWT compat<vel com os "ro0sers mais utilizados e c.di#o 6TM?YC//YJavascript )ue funcione "em em todos os "ro0sers n!o uma tarefa das mais triviais$ % Goo#le We" Tool7it uma plataforma muito interessante e sem dNvida ser cada vez mais re)uisitada na medida em )ue esta utiliza uma lin#ua#em muito popular, o Java$ 1m"ora al#uns dos seus componentes ainda ten+am al#uns "u#s, est constantemente a ser corri#ida e aperfei oada, tornando-se cada vez mel+or a cada vers!o disponi"ilizada$ '- .e<er=nci$s

F1H3'81/, =aulo$ Inici$ndo com GWT. Dhttp://www.phpaulo.com.br/tag/gwt/K 'cesso emA LC dez$ JCCM$

8ispon<vel

emA

8535Z, Sin<cius$ GWT (iso Ger$l. 8ispon<vel emA Dhttp://loogica.wordpress.com/2007/01/04/gwt-parte-1- isao-geral/K 'cesso emA LC dez$ JCCM$ FH11, Java$ GWT. 8ispon<vel emA Dhttp://!a a"ree.uol.com.br/artigo/874221/#$icia$do-como-%&'.html/K 'cesso emA LC dez$ JCCM$ G1'H[, 8avid$ #ri$ndo loc$is com o Google Web Toolkit. 8ispon<vel emA Dhttp://www.ibm.com/de eloperwor(s/br/librar)/!-gwt"u1/i$de*.html/ K 'cesso emA LC dez$ JCCM$ =H%GH'M'H, Hevista$ ' revista portu#uesa de pro#rama !o$ Google Web Toolkit, =ortu#al, n$ LM, p$ V-M, a"ril JCCM$ =H%GH'M'H, Hevista$ ' revista portu#uesa de pro#rama !o$ Google Web Toolkit =ortu#al, n$ JC, p$ LV-JW, *un+o JCCM$ $rte-2,

C6'T, Ciclo$ #1$t $,,lic$tion b$sed on google Web Toolkit. 8ispon<vel emA D http://laurel.datsi."i.upm.es/+ssoo/,-&/'raba!os/2007-2008/017/i$de*.e$/K 'cesso emA LC dez$ JCCM$ TTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTT \Tra"al+o da disciplina =lataformas de ?in#ua#em Java, do curso de p.s-#radua !o em 8esenvolvimento de /istemas
com Tecnolo#ia Java$