Quando falamos em RIA, logo lembramos de código JavaScript, JQuery, primefaces, richfaces, etc. Mas porque não podemos ter uma aplicação com componentes ricos codificando apenas com código Java? O GWT (Google Web Toolkit) é um framework que nos permite fazer isso, mas para deixar a aplicação bonita, ainda temos que ter um grande trabalho com CSS para estilizar a aplicação. O GXT (Ext GWT) é um framework open-source que veio para complementar o GWT. Assim podemos programar apenas em Java, sem se preocupar com nenhum código javascript, ou html ou css e ainda assim tem componentes bonitos e ricos com o look and feel do ExtJS. Na palestra vamos aprender um pouco mais sobre o GXT, seus recursos, prós e contras, além de ver uma aplicação de exemplo e um pouco de código!
8. Dificuldade de Frameworks tradicionais
● Várias Linguagens
○ Server
■ java, ruby, php, C#,...
■ templates (HTML,XML, markup...)
■ Glue languages (OGNL)
○ Client
■ JavaScript
■ HTML ● Setup do Projeto Complicado
○ Código Server-side
○ Código Client side
● Server vs. Client
○ Templates
○ Não compartilha código
○ Arquivos Estáticos
○ Muitas configs
○ JavaScripts
○ Muita conversão
10. Como o GWT é diferente
● Código em Java (maioria)
● 'compilado' para js/html
● Não precisa
○ páginas templates
○ 'glue languages'
○ scripting
● Uso completo de ferramentas Java
○ Eclipse debugger
○ Code complete
○ Continuous compilation
● Código compartilhado entre client/server
11. Anatomia de um Projeto GWT
● Código Java
○ client - compilado para js/html e executado no browser
○ server - compilado para java e executado no lado server
○ shared - compartilhado
● .gwt.xml - arquivo de configuração
● .html - que irá abrigar o seu código
● .css - para embelezar
12. Código UI
● Widgets (objetos Java)
○ Seu código é criado através de herança ou
composição
● Customizável
● Configurável
● Parecido com Swing (:/)
● Pode extender
13.
14.
15. Compilador GWT
● Código Java -> Código JS otimizado -> cross browser
● Otimiza o código -> métodos in-lining, remove código
morto, otimiza strings e mais
● Framentos de código JS para apps grandes e startup mais
rápido
● JS é minimizado e obfuscado
16. Comunicação com Server
● Remote Procedure Calls -> chamadas server passando
objetos Java
● Com RPC não precisa lidar com serialização e
deserialização de objetos Java
● Suporta XML e/ou JSON
17.
18. Desenvolvimento
● Run, Build, Debug e testes -> tudo em Java
● GWT tem o “Development Mode” -> pode debugar antes
do código ser transformado em JS
20. party JavaScript library
•
JavaScript Native Interface (JSNI)
JSNI can be used in many ways
• Implement a Java method directly in JavaScript
• Wrap type-safe Java method signatures around existing JavaScript
Integração JavaScript codeJavaScript and vice-versa
• Call from com código into Java code
• Throw exceptions across Java/JavaScript boundaries
• Read and write Java fields from JavaScript
nday, October 11, 2010
28. Ext GWT Widgets
● Alta performance
● Pode customizar tema
● Data widgets
○ Tree e TreeGrid
○ Lists e Grids
● Forms
● Menu, menu bars e toolbars
● Panels, windows e dialogs
29. Data Widgets
● Row, cell, seleção Linha ou célula
● Suporte a teclado
● Ligado a Data Stores
● Renderização rápida
30. Forms
● Forms ricos
● Auto complete / assist combo box
● Validação nativa
● Labels à esquerda ou topo
● Supporte a Multi column
● Editor HTML
31. ToolBars and Menus
● Conjunto de toolbars, button bars, e menus
● Pode colocar qualquer widget nas toolbars e menu
32. Panel, Windows e Dialogs
● Pode mover e redimencionar
● Collapse / Expand
● Button bar
● Suporte modal
35. Loaders & Stores
● Models - objetos de domínio (POJO)
● DataLoader - carrega dados com ajudar do Proxy e Reader
● DataReader - faz o parser dos dados
● DataProxy - responsável por carregar dados do server
● Stores & Records - stores são a versão cache dos Models no lado client
enquanto que as Records são cada instância dos Models (pode editar)
36. Drag and Drop
● Suporte Drag and Drop em todos os componentes