Introduction à Google Web Toolkit (GWT) - Philippe Kernevez - February 2009
Upcoming SlideShare
Loading in...5
×
 

Introduction à Google Web Toolkit (GWT) - Philippe Kernevez - February 2009

on

  • 406 views

Introduction à Google Web Toolkit (GWT) - Philippe Kernevez - February 2009

Introduction à Google Web Toolkit (GWT) - Philippe Kernevez - February 2009

Statistics

Views

Total Views
406
Views on SlideShare
406
Embed Views
0

Actions

Likes
0
Downloads
2
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Introduction à Google Web Toolkit (GWT) - Philippe Kernevez - February 2009 Introduction à Google Web Toolkit (GWT) - Philippe Kernevez - February 2009 Presentation Transcript

  • JUGL – présentation GWT Http://www.jugl.ch 5 février 2009
  • Licence Creative Commons Contrat Paternité Pas d'Utilisation Commerciale Partage des Conditions Initiales à l'Identique 2.0 France http://creativecommons.org/licenses/by-nc-sa/2.0/fr/ Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 2
  • Information Cette présentation et les exemple sont disponibles à cette adresse https://forge.octo.com/svn/jugl/2009-01 Gwt Pour récupérer l'ensemble des sources et la présentation en local il suffit de taper la ligne de commande dans le repertoire de destination > svn co "https://forge.octo.com/svn/jugl/2009-01 Gwt" . Pour les démonstrations GWT pur (sans maven) il faut avoir GWT (1.5.3+) dans son PATH, pour les autres il faut avoir Installé maven Un jdk 1.5 dans son path (en tapant java –version) Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 3
  • GWT un framework d'application web Approche GWT Développer dans le langage Java Compiler le code Java en JavaScript et Html (au lieu de byte code avec un jdk) Gwt c'est : Des outils: compilateur, IDE (Java), scripts Une partie du Jdk Un framework de composant: les composants graphiques de base Une architecture orientée service: • One page application • Des services de données sur le serveur Gwt se propose de simplifier les points suivants Crossbrowser Fuite mémoire (DOM / Javascript) La complexité de développement JavaScript L'outillage de développement (débugger, designer, roundtrip) Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 4
  • Positionnement GWT GWT a été mis en opensource (décembre 2006, licence Apache 2.0) C'est une communauté fermée (Google) qui avance vite C'est une nouvelle position (éditeur et opensource) pour Google on ne connait pas l'implication de google dans la durée Vu l'engouement pour GWT, il sera de plus en plus difficile pour Google de ne plus supporter GWT Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 5
  • Architecture GWT En terme d'architecture, la technologie de rapproche de Flex SilverLight One page application Avec support de l'historique (et des bookmark ?) code Java Compatible Java 5 (depuis mai 2008) Version Java 6 en cours d'élaboration compilateur Html/JavaScript: compilation tardive et conditionnelle Particularité: GWT n'utilise jamais les *.class, ce sont des reliquats des IDE ou des outils (ANT, Maven) Démo HelloWord compilé avec Gwt Dissection du code compilé Navigateur embarqué et débugage Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 6
  • Support de Java 5 Types (boolean, byte, char, short, int, long, float, and double), Object, String, arrays, user-defined classes, etc. Par contre tout les types arithmétiques sont mappés sur un double, limitation JavaScript Le type long est mappé sur 2 entier de 32 bits par un mécanisme GWT (pour >1.5) • • Le type long ne peut pas être utilisé dans des appels natifs Cela a un impact sur les performances Exception: support de try/catch/finally Certaine exception ne peuvent pas survenir (OutOfMemory, etc.) JavaScriptException est ajoutée Assertions: elles sont supportées mais doivent activées explicitement Multithreading and Synchronization: le verbe synchronize est supporté mais est ignoré (le JavaScript est monothread) Les méthodes Object.wait(), Object.notify(), et Object.notifyAll() provoque une erreur de compilation Réflexion: il n'y a pas de support de la réflexion Seul existe Object.getClass().getName() Finalisation: pas de support Liste des classes supportées http://code.google.com/intl/fr/docreader/#p=google-web-toolkit-doc-1-5&s=google-web-toolkitdoc-1-5&t=RefJreEmulation Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 7
  • Structure d'un projet GWT Code Java de la partie cliente, compilé par GWT Code Java de la partie serveur, compilée par le JDK Ressources statiques de la WebApp Descripteur du module GWT Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 8
  • Les avantages de GWT pour la partie IHM Fonctionnalités AJAX Productivité des développements Efficience du runtime Minimisation du trafic Minimisation des ressources • Mode obsucate Elimination du code mort lors de la compilation Possibilité de se brancher sur du code JavaScript existant public static native void message(String pMsg) /* { $wdn.alert(pMsg); } */; Il est très simple de se créer des composants réutilisables C'est des POJO Utilisation de CSS il faut gérer l'affectation d'un ID à la main si on veut l'utiliser dans la CSS Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 9
  • Composants disponibles GWT = librairie de composants bas niveau (style SWING) http://code.google.com/intl/fr/docreader/#p=google-web-toolkitdoc-1-5&s=google-web-toolkit-doc-1-5&t=DevGuideWidgetGallery Il existe un grand nombre de librairies complémentaires GWT Ext MyGWT GWT Rialto GWTWidgets … Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 10
  • Outils disponibles – A la main GWT 'à la main' > cd code1-simpleHelloWord > createHelloWordApplication.cmd > cd generated > HelloWord-compile.cmd Ou > HelloWord-shell.cmd Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 11
  • Outils disponibles – ANT Tache ANT http://braindump.dk/tech/gwt-task-for-ant/ Project creator http://code.google.com/intl/fr/docreader/#p=googleweb-toolkit-doc-1-5&s=google-web-toolkit-doc-15&t=DevGuideProjectCreator > cd code1-simpleHelloWord > createEclipseAndAntProject.cmd > cd generated > ant -f HelloWord.ant.xml Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 12
  • Outils disponibles – Maven Plugins Maven http://code.google.com/p/gwt-maven/ http://mojo.codehaus.org/gwt-maven-plugin/ > cd codecode2-maven > mvn clean install ou > mvn gwt:gwt ou > mvn gwt:debug Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 13
  • Outils disponibles GWT Designer (payant) Télécharger le plugin Eclipse • http://download.instantiations.com/WBPro/continuous/latest/update/E-3.3/ ou • http://download.instantiations.com/WBPro/continuous/latest/update/E-3.4/ Autres Outils disponibles http://code.google.com/intl/fr/webtoolkit/tools.html Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 14
  • Internationalisation > cd codecode3-maven-withI18n > mvn gwt:gwt Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 15
  • Optimisation des images http://code.google.com/intl/fr/docreader/#p=google-web-toolkit-doc-15&s=google-web-toolkit-doc-1-5&t=DevGuideImageBundles Les images sont de plus localizables Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 16
  • Optimisation des images et internationalisation > cd codecode3-maven-withI18n > mvn gwt:gwt Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 17
  • Architecture client serveur > cd codecode4-server > mvn gwt:gwt Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 18
  • Deffered Binding - Directives de compilation Gestion de Crossbrowser L'internationalisation Des logs Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 19
  • Création de framework Il suffit de faire un jar contenant Les sources Java Le fichier de configuration du module De déclarer dans le module les ressources statiques (images, css) que les clients devront embarquer Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 20
  • GWT et les tests GwtTestCase Demo > cd codecode3-maven-withI18n > mvn gwt:test Ou > mvn clean install Test selenium En utilisant selenium RC pour les échanges asynchrones Cela reste compliqué Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 21
  • Intérêts de faire du Java pour la partie cliente Simplification du développement Plus simple Moins de technologies à maitriser Roundtrip rapide Il est facile de faire un 'petit' framework pour faire des composant réutilisable Intégration dans le build (intégration continue) On utilise les outils classique coté serveur Maven / Ant Checkstyle & Co Génération de code et/ou utilisation d'annotation Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 22
  • Pour aller plus loin Avec GWT plus besoin de connaitre JavaScript et Html, est-ce du développement 100% Java ? Pas forcément on peut le voir comme un remplaçant de JS et Html sur le client et avoir un serveur PHP, Grails, etc. Faut-il mélanger le code serveur et le code client dans le même projet ? C'est le fonctionnement par défaut de GWT, ce n'est pas forcément adapté en entreprise On peut le séparer en plusieurs module/projet Quelle alternative à GWT RPC ? On peut prendre la main sur le protocole pour le remplacer (par exemple JSON) par contre il faudra gérer plus de chose 'à la main' Intégration avec Google Gears pour le support du mode déconnecté Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 23
  • Quelques incompréhensions "Il faut utiliser Java sur le serveur" Non, on peut utiliser n'importe quel technologie pour mettre à disposition les données sur le serveur (PHP, etc.) "Il n'est pas possible de débuguer le code JavaScript généré, il est illisible" Il n'est pas lisible en mode obfucated, mais on peut le générer en mode DETAILLED. La bonne approche est de débuguer le code Java depuis Eclipse "Les applications GWT sont grosses et longue à télécharger" Non le code est optimisé et compressé "On ne peut pas faire de Html / JavaScript dans une application GWT" Il est possible de mixer les 2, même si ce n'est pas le mode recommandé "Quel rapport avec les Applets ?" Aucun, à part le langage Java Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 24
  • Trucs et astuces Avoir des profils différents pour le dev et la production Pour diminuer les options de compilation et le temps de développement Eviter à tout prix l'intégration de code JavaScript via l'utilisation de native Cela court-circuite le mécanisme de libération de la mémoire JavaScript et créer des fuites mémoire Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 25
  • Ressources Cette présentation https://forge.octo.com/svn/jugl/2009-01 Gwt GWT http://code.google.com/intl/fr/webtoolkit/ Forum http://groups.google.com/group/Google-Web-Toolkit Blog http://googlewebtoolkit.blogspot.com/ On GWT http://www.ongwt.com/ Université du SI sur la mise en œuvre de GWT pour une charte d'ergonomie http://www.universite-du-si.com/Webcast.aspx , Session A5 Ergonomie 2.0 (inscription obligatoire et gratuite) Copyright © 2009 – OCTO Technology – Licence CC – Creative Commons 2.0 France – Paternité – Pas d'Utilisation Commerciale – Partage des Conditions Initiales à l'Identique 26