Google Web Toolkit Introduction Michel Buffa daprès le ppt original de Didier Girard – 04 juillet 2007.

Présentation au sujet: "Google Web Toolkit Introduction Michel Buffa daprès le ppt original de Didier Girard – 04 juillet 2007."— Transcription de la présentation:

1 Google Web Toolkit Introduction Michel Buffa daprès le ppt original de Didier Girard – girard.d@sfeir.com 04 juillet 2007

2 Sommaire Comment GWT fonctionne ? Les fonctionnalités

3 Composants graphiques plus évolués Des composants tous plus beaux les uns que les autres

4 Serveur sans état Client avec état Meilleure scalability ApplicationIHM+Métier + Session Serveur dapplications Métier + Session Base de données Données

5 Au début, Ajax cest cool Cest beau Efficace Les clients en redemandent

6 Les difficultés Cross-navigateur Fuite mémoire Lourdeur du chargement Peu de « Docteur es Javascript » Pas de bons IDE Bug (javascript est un langage interprété) Pas de debug Sécurité …

7 COMMENT GWT FONCTIONNE ?

8 Lobjectif Permettre de développer simplement, des applications – Cross navigateurs – Efficaces – Stables Dans un environnement amical pour les développeurs – Support des IDE, Debugging, refactoring, typage fort,…

9 Lapproche Développer en Java Compiler le Java en Javascript/CSS

10 Hello World Démonstration

11 Browser IE, Firefox, Safari, Opera Browser IE, Firefox, Safari, Opera RWA in Java Java Runtime Library Architecture java.lang java.util Java.io Code de lapplication GWT GUI Library Panels Popup Stack Absolute Vertical … Panels Popup Stack Absolute Vertical … Widgets Button MenuBar Radio Tree Check Table TextArea …. Widgets Button MenuBar Radio Tree Check Table TextArea …. Javascript Application GWT Runtime 100Ko GWT Runtime 100Ko GWT Compiler GWT Compiler

12 TOUR DHORIZON

13 Des widgets « 100% java » Démonstration (Kitchen Sink)

14 Support de lhistorique « Single Page Interface », mais gestion de lhistorique ! Démonstration (Kitchen Sink) Le code History.addHistoryListener(myCommand);

15 Support de RPC (JSON/XML-RPC) AJAX est dabord une histoire de requêtes asynchrones – Avec GWT, cest simple !

16 Absolute Panel Permet de développer efficacement – Un vrai bonheur ! Il y a bien dautres Panel : Grid, Row, Flex, Vertical, Tab,…

17 Support multi-navigateur et multi-plateforme Et ça marche…

18 Support des CSS Tous les composants GWT supportent nativement les CSS

19 Support du debug

20 Support de javascript JSNI, une API astucieuse Beaucoup de bibliothèques de javascript populaires sont déjà « wrappées » : scriptaculous, yui, timeline,… Démonstration public static native void alert(String msg) /*-{ $wnd.alert(msg); }-*/;

21 Optimisation du code Le javascript est optimisé durant la compilation Seul le javascript nécessaire est téléchargé par le navigateur – Javascript pour la plateforme cible – Seule lAPI effectivement utilisée est téléchargée

22 Très bonne scalabilité Avec GWT les serveurs sont stateless Il est donc très facile daugmenter la puissance CPU des serveurs – Plus de « session affinity »

23 Des outils GWT est supporté par tous les grands IDE Java : Eclipse, NetBeans, IntelliJ IDEA, Jdeveloper,… Publicité : GWT Designer pour Eclipse (payant)

24 La communauté GWT Plusieurs millions de téléchargements Plusieurs dizaines de millier dabonnés sur les mailing listes de développeurs Des ouvrages De nombreux articles/tutoriaux Des formations Des blogs

25 GWT 1.7.1 aujourdhui ! (IE8, FF 3.5, SF 4) GWT 1.4 – Par exemple : ImageBundle (téléchargement optimisé dimages), une espèce de base dimages – Passage de 12 requêtes HTTP à une seule… ClippedImage timeIcon = new ClippedImage("icons.png", 22, 0, 22, 22); GWT 1.5 apporte le support des annotations de code et de la généricité – Du coup, on peut par exemple passer des classes entity du serveur (java) vers le client (java compilé en javascript) – Nécessite les sources des annotations – GWT 1.6 : + de widgets, plugin eclipse officiel

26 GWT Gears Gears permet daccéder à une base local depuis javascript. Il existe une API pour GWT : – http://code.google.com/p/gwt-google-apis/ http://code.google.com/p/gwt-google-apis/ 26 Google Confidential

27 GWT est efficace Il est couramment admis que développer avec GWT permet dêtre plus efficace pour le développement de gros projets de web applications – Refactoring – Debugging – Serveur Stateless – Cross-navigateurs – I18N – Hosted mode – JSNI

28 QUELQUES TRUCS

29 Attention, un langage peut en cacher un autre Le code qui sexécute côté client nest pas du java, mais du javascript. Par exemple « long » nexiste pas en javascript ! 29 Google Confidential

30 LES IDEES REÇUES

31 Java est nécessaire sur le serveur Non, GWT nimpose pas de technologie sur le serveur GWT est simplement plus pratique à utiliser avec Java sur le serveur

32 Le code Javascript généré est difficile à débugger Il est possible, via les options du compilateur, davoir un code javascript lisible.

33 Les widgets GWT ? Bof…. Les widgets GWT sont des widgets de bases. Il existe beaucoup de projet qui proposent des widgets évolués – GWT Ext – GWT Rialto – Tatami – GWT Widget – GWTaculous – … 33 Google Confidential

34 Les applications GWT sont lourdes Le code généré est optimisé et gzippable – La démo Google Showcase pèse 60K !

35 GWT ne supporte pas lexistant Faux – Il est tout à fait possible dintégrer des composants GWT dans une page HTML classique.

36 GWT est propriétaire Mais non – GWT est sous licence opensource Apache depuis la version 1.3 (12/2006)

37 MISC Version de JDK ? – Codez le code serveur et client en jdk 5/6 mais attention, côté client toutes les classes du SDK ne sont pas re- implémentées (mais la plupart le sont) Intégration avec Spring ? – Facilité depuis GWT 1.4 Intégration avec Hibernate ? – Facilité avec GWT 1.5 avec les annotations de code (attention néanmoins : il faut les sources !) Intégration avec les EJBs – Naturel avec les entity beans – Nécessite un wrapper pour les session beans – Normalement full support avec GWT 1.5

38 Misc GWT pour mobiles : http://code.google.com/p/gwt- mobile-webkit/http://code.google.com/p/gwt- mobile-webkit/ GWT on the Wave : http://code.google.com/p/cobogwave/ http://code.google.com/p/cobogwave/ GWT-gdata : accèder aux APIs Google depuis GWT (youtube, google map, search, calendar, etc.) : http://code.google.com/p/gwt-gdata/ http://code.google.com/p/gwt-gdata/ 38 Google Confidential

39 Ressources GWT : http://code.google.com/webtoolkit/ Forum pour les développeurs : http://groups.google.com/group/Google-Web-Toolkit Blog officiel : http://googlewebtoolkit.blogspot.com/ onGWT, Tracking news on GWT : http://www.ongwt.com/