JSF 2 Damien Gouyette et François Petitit
Damien GOUYETTE François PETITIT
Intervenant <ul><li>Nom de l'intervenant </li><ul><li>Damien GOUYETTE </li></ul></ul>Expert technique java / JEE au sein d...
Objectifs de la présentation <ul><li>À l'issue de cette présentation, vous connaitrez :  </li><ul><li>Les bases de JSF
Les nouveautés de JSF 2 </li></ul></ul>
Sommaire <ul><li>1 - Introduction
2 - Le framework JSF
3 - Les outils </li></ul>4 - Conclusion
Introduction <ul><li>Objectifs de JSF :  </li><ul><li>Fournir un standard JEE, spécifié dans une JSR, pour le développemen...
Maximiser la productivité des développeurs  </li><ul><li>Fournir les fonctionnalités récurrentes et avancées (validations,...
Masquer la complexité </li></ul></ul></ul>
Introduction <ul><li>Historique </li></ul>1.0 1.1 1.2 2.0 2004 2005 2006 2007 2008 2009 JSR 252 JSR 127 JSR 314 Version in...
Exécution dans le navigateur Plug-in requis Exécution côté serveur <ul><li>Les principaux frameworks RIA Java et autres : ...
Sommaire <ul><li>1 - Introduction
2 - Le framework JSF
3 - Les outils </li></ul>4 - Conclusion
2 - Le framework JSF 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composa...
2.1 - JSF2 et JEE  <ul><li>JSF 2 compatible JEE 5, JSF 1.X de base
Fait partie de JEE 6 : </li></ul>
2.1 - JSF 2 et JEE <ul><li>Fait partie du profil « web » de JEE 6 : </li><ul><li>Servlet 3.0
JavaServer Pages (JSP) 2.2
Expression Language (EL) 2.2
Debugging Support for Other Languages (JSR-45) 1.0
Standard Tag Library for JavaServer Pages (JSTL) 1.2
JavaServer Faces (JSF) 2.0
Common Annotations for Java Platform (JSR-250) 1.1
Enterprise JavaBeans (EJB) 3.1 Lite
Java Transaction API (JTA) 1.1
Java Persistence API (JPA) 2.0 </li></ul></ul>
2 - Le framework JSF 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composa...
MVC 2 et JSF 2 Controller web.xml Faces-config (facultatif) Back office Managed  Beans Vue Client Côté client Côté serveur...
2. Le framework JSF 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composan...
2.3 - Cycle de vie Le cycle de vie = les étapes côté serveur lors d'une requête : Restauration de la vue Conversions Valid...
2.3 Conversion <ul><li>JSF fournit : </li><ul><li>Conversion automatique de la valeur d'un attribut de la requête (chaînes...
Support des types primitifs, des dates,
Support de convertisseurs personnalisés et configurables.
Configuration de l'affichage. Exemple : affichage de dates </li></ul></ul><h:outputText value=&quot;#{dateBean.today}&quot...
2.3 - Validation <ul><li>Plusieurs moyens de valider : </li><ul><li>Dans la vue  </li><ul><li>avec des balises fournies pa...
Avec des validateurs personnalisés implémentant l'interface « javax.faces.validator ». Permet de valider au plus tôt avec ...
Sommaire : le framework 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté comp...
2.4 - managed Bean <ul><ul><li>Classe java qui contenant la logique de présentation connectée au métier. </li></ul><li>Sco...
Session
View  2.0
Request </li></ul></ul>
2.4 - ManagedBean <ul><li>JSF 2 simplifie la configuration  </li><ul><li>Avant, déclaration dans le fichier faces-config.x...
2.4 - Vues ↔ ManagedBean <ul><li>Lien vues ↔ contrôleurs grâce à l'Expression Language (EL) </li></ul>@ManagedBean   2.0 @...
Sommaire : le framework 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté comp...
Prochain SlideShare
Chargement dans…5
×

Presentation jsf2

11 684 vues

Publié le

Présentation JSF2

Publié dans : Technologie
  • Soyez le premier à commenter

Presentation jsf2

  1. 1. JSF 2 Damien Gouyette et François Petitit
  2. 2. Damien GOUYETTE François PETITIT
  3. 3. Intervenant <ul><li>Nom de l'intervenant </li><ul><li>Damien GOUYETTE </li></ul></ul>Expert technique java / JEE au sein de GENERALI.  Il assure au sein d'une équipe transverse, du support, de la documentation, et participe à la définition des normes de développement. Damien GOUYETTE est plus particulièrement spécialisé dans le développement d'IHM Blog : http://www.cestpasdur.com <ul><ul><li>François PETITIT </li></ul></ul>Consultant chez OCTO Technology, François s'intéresse tout particulièrement à l'univers Java/JEE. C'est au cours d'une mission dans une équipe transverse d'aide aux projets Java qu'il a rencontré Damien Gouyette, avec qui il a pu approfondir la technologie JSF.
  4. 4. Objectifs de la présentation <ul><li>À l'issue de cette présentation, vous connaitrez : </li><ul><li>Les bases de JSF
  5. 5. Les nouveautés de JSF 2 </li></ul></ul>
  6. 6. Sommaire <ul><li>1 - Introduction
  7. 7. 2 - Le framework JSF
  8. 8. 3 - Les outils </li></ul>4 - Conclusion
  9. 9. Introduction <ul><li>Objectifs de JSF : </li><ul><li>Fournir un standard JEE, spécifié dans une JSR, pour le développement d'IHM riches
  10. 10. Maximiser la productivité des développeurs </li><ul><li>Fournir les fonctionnalités récurrentes et avancées (validations, conversions, Ajax, etc...)
  11. 11. Masquer la complexité </li></ul></ul></ul>
  12. 12. Introduction <ul><li>Historique </li></ul>1.0 1.1 1.2 2.0 2004 2005 2006 2007 2008 2009 JSR 252 JSR 127 JSR 314 Version initiale Correction de bugs Améliorations et corrections JEE 6 multiples nouveautés
  13. 13. Exécution dans le navigateur Plug-in requis Exécution côté serveur <ul><li>Les principaux frameworks RIA Java et autres : </li></ul>1 - Introduction JSF Wicket Spring MVC GWT DOJO Applet JavaFX Flex Silverlight
  14. 14. Sommaire <ul><li>1 - Introduction
  15. 15. 2 - Le framework JSF
  16. 16. 3 - Les outils </li></ul>4 - Conclusion
  17. 17. 2 - Le framework JSF 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composants 2.6 - AJAX 2.0 2.7 – Templating de pages 2.0 2.8 – JSP vs Facelet 2.9 -Traitement des ressources
  18. 18. 2.1 - JSF2 et JEE <ul><li>JSF 2 compatible JEE 5, JSF 1.X de base
  19. 19. Fait partie de JEE 6 : </li></ul>
  20. 20. 2.1 - JSF 2 et JEE <ul><li>Fait partie du profil « web » de JEE 6 : </li><ul><li>Servlet 3.0
  21. 21. JavaServer Pages (JSP) 2.2
  22. 22. Expression Language (EL) 2.2
  23. 23. Debugging Support for Other Languages (JSR-45) 1.0
  24. 24. Standard Tag Library for JavaServer Pages (JSTL) 1.2
  25. 25. JavaServer Faces (JSF) 2.0
  26. 26. Common Annotations for Java Platform (JSR-250) 1.1
  27. 27. Enterprise JavaBeans (EJB) 3.1 Lite
  28. 28. Java Transaction API (JTA) 1.1
  29. 29. Java Persistence API (JPA) 2.0 </li></ul></ul>
  30. 30. 2 - Le framework JSF 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composants 2.6 - AJAX 2.0 2.7 – Templating de pages 2.0 2.8 – JSP vs Facelet 2.9 -Traitement des ressources
  31. 31. MVC 2 et JSF 2 Controller web.xml Faces-config (facultatif) Back office Managed Beans Vue Client Côté client Côté serveur B.O.
  32. 32. 2. Le framework JSF 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composants 2.6 - AJAX 2.0 2.7 – Templating de pages 2.0 2.8 – JSP vs Facelet 2.9 -Traitement des ressources
  33. 33. 2.3 - Cycle de vie Le cycle de vie = les étapes côté serveur lors d'une requête : Restauration de la vue Conversions Validations Mises-à-jour des managed beans Invocation du métier & navigation Création de la réponse Requête Réponse
  34. 34. 2.3 Conversion <ul><li>JSF fournit : </li><ul><li>Conversion automatique de la valeur d'un attribut de la requête (chaînes de caractères) en objet Java.
  35. 35. Support des types primitifs, des dates,
  36. 36. Support de convertisseurs personnalisés et configurables.
  37. 37. Configuration de l'affichage. Exemple : affichage de dates </li></ul></ul><h:outputText value=&quot;#{dateBean.today}&quot;> <f:convertDateTime dateStyle=&quot;full&quot; type=&quot;date&quot; /> </h:outputText> -> Mardi 13 octobre 2008
  38. 38. 2.3 - Validation <ul><li>Plusieurs moyens de valider : </li><ul><li>Dans la vue </li><ul><li>avec des balises fournies par JSF <h:inputText value=&quot;#{ contactBean . name }&quot;> <f:validateLength minimum=&quot;2&quot; maximum=&quot;30&quot; /> </h:inputText>
  39. 39. Avec des validateurs personnalisés implémentant l'interface « javax.faces.validator ». Permet de valider au plus tôt avec des validateurs personnalisés. Exemples : validation d'adresse mail... </li></ul><li>Dans le managed bean </li><ul><li>en ajoutant des messages d'erreur dans le contexte JSF </li></ul><li>Dans les entités et/ou dans les managed beans en utilisant la JSR-303 ( Hibernate validator ), en utilisant le tag « f:validateBean » </li></ul></ul>
  40. 40. Sommaire : le framework 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composants 2.6 - AJAX 2.0 2.7 – Templating de pages 2.0 2.8 – JSP vs Facelet 2.9 -Traitement des ressources
  41. 41. 2.4 - managed Bean <ul><ul><li>Classe java qui contenant la logique de présentation connectée au métier. </li></ul><li>Scope : </li><ul><li>Application
  42. 42. Session
  43. 43. View 2.0
  44. 44. Request </li></ul></ul>
  45. 45. 2.4 - ManagedBean <ul><li>JSF 2 simplifie la configuration </li><ul><li>Avant, déclaration dans le fichier faces-config.xml : </li></ul></ul><ul><ul><li>Après, déclaration avec des annotations directement dans le managed bean : </li></ul></ul><managed-bean> <managed-bean-name>bidonBean</managed-bean-name> <managed-bean-class> org.parisjug.jsf.controller.ContactManagedBean </managed-bean-class> <managed-bean-scope>request</managed-bean-scope> </managed-bean> @ManagedBean @RequestScoped public class ContactManagedBean { … }
  46. 46. 2.4 - Vues ↔ ManagedBean <ul><li>Lien vues ↔ contrôleurs grâce à l'Expression Language (EL) </li></ul>@ManagedBean 2.0 @RequestScoped 2.0 public class ContactBean { // propriétés et accesseurs private String name ; … //code métier Public String add (){ … return «  success  »; } } ... <h:inputText value=&quot;#{ contactBean . name }&quot;> <f:validateLength minimum=&quot;2&quot; maximum=&quot;30&quot; /> </h:inputText> … <h:commandButton action=&quot;#{ contactBean . add }&quot; /> ... ContactBean.java new.xhtml
  47. 47. Sommaire : le framework 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composants 2.6 - AJAX 2.0 2.7 – Templating de pages 2.0 2.8 – JSP vs Facelet 2.9 -Traitement des ressources
  48. 48. <ul>2.5 - Orienté composant </ul><ul><li>Un composant est un élément d'interface utilisateur, configurable et réutilisable .
  49. 49. Un composant peut être une simple zone de texte, ou complexe (table paginée).
  50. 50. Exemples de composants complexes : tables paginées, éditeur WYSIWYG...
  51. 51. Gestion d'évènements sur les composants (sans AJAX)
  52. 52. Les composants vivent sur le serveur </li><ul><li>Chaque action utilisateur donne lieu à des traitements pour mise à jour côté serveur.
  53. 53. L'état des composants est restauré puis sauvegardé à chaque cycle Requête / Réponse. </li></ul></ul>
  54. 54. 2.5 - Les composants Navigateur client Form Label:nom InputText:nom Label:prenom InputText: prenom Button:ok Panel Panel Côté serveur View
  55. 55. 2.5 - Les composants <ul><li>JSF2 propose EZComp 2.0 </li><ul><li>Déclaration : /webapp/ressources/hello/hello.xhtml </li></ul></ul><ul><ul><li>Utilisation : /webapp/index.xhtml </li></ul></ul>//Déclaration des attributs du composant < composite:interface > < composite:attribute name=&quot;qui&quot; required=&quot;true&quot; /> </composite:interface> // Implémentation du composant < composite:implementation > <span>Hello # {cc.attrs.qui} </span> </composite:implementation> <html xmlns:ez=&quot; http://java.sun.com/jsf/composite/hello &quot;> … < ez :hello qui=&quot;world&quot; /> …
  56. 56. Ezcomp demo
  57. 57. 2.5 - Les composants <ul><li>Librairies : www.ajaxjsf.net (anc. jsfmatrix) </li></ul>
  58. 58. Sommaire : le framework 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composants 2.6 - AJAX 2.0 2.7 – Templating de pages 2.0 2.8 – JSP vs Facelet 2.9 -Traitement des ressources
  59. 59. 2.6 - AJAX <ul><li>Gestion native d'AJAX -> il suffit d'ajouter la balise <f:ajax> 2.0
  60. 60. Optimisation : traitement et rendu partiels </li></ul><h:inputText value=&quot;...&quot; id =&quot;lastName&quot;> <f:validateLength minimum=&quot;2&quot; maximum=&quot;30&quot; /> <f:ajax render=&quot; lastNameMessage &quot;/> </h:inputText> <h:message id=&quot; lastNameMessage &quot; for =&quot;lastName&quot; />
  61. 61. Ajax demo
  62. 62. Sommaire : le framework 2.1 – JSF & JEE 2.2 - Pattern de JSF 2.3 - Cycle de vie 2.4 - Les managed beans 2.5 - Orienté composants 2.6 - AJAX 2.0 2.7 - Templating de pages 2.0 2.8 - JSP vs Facelet 2.9 -Traitement des ressources
  63. 63. Templating / réutilisation <ul><li>template.xhtml </li></ul><ul><li>Page utilisant ce template </li></ul><ui:composition template=&quot;/pages/templates/template.x html&quot;> <ui:define name=&quot; contenu &quot;> < h1>Hello world</h1> </ui:define> </ui:composition> <html> <h:body> <ui:include src=&quot; header.xhtml &quot; /> <div id=&quot;contenu&quot;> <ui:insert name=&quot; contenu &quot;>valeur par defaut</ui:insert> </div> <ui:include src=&quot; footer.xhtml &quot; /> </h:body> </html>
  64. 64. 2.8 JSP VS. Facelet <ul><li>JSP : compilé en servlet </li><ul><li>Permet de limiter les composants à créer (c:if), ceux ci ne seront alors pas présents dans l'arbre JSF.
  65. 65. Tags JSP récupèrent leurs valeurs à la phase 1 (restore_view) </li></ul><li>Facelet : arbre de composant </li><ul><li>JSF récupèrent leurs valeurs à la phase 6 (render_response)
  66. 66. Bénéfices du cycle de vie (conversion, validation...)
  67. 67. Plus lent que les JSP du fait du cycle de vie.
  68. 68. Templating / réutilisation </li></ul></ul>
  69. 69. 2.9 Ressources statiques <ul>CSS, javascript, images <li>Emplacements </li><ul><li>/resources
  70. 70. /META-INF/resources </li></ul><li>Structure des resources </li><ul><li>[localePrefix][libraryName] [libraryVersion]resourceName[resourceVersion]
  71. 71. [] = facultatif
  72. 72. EL : #{resource['<library name>:<resource name>']} </li></ul></ul><ul><ul><li><h:outputScript library=&quot;jquery-ui&quot; name=&quot;jquery-ui.custom.min.js&quot; target=&quot;head&quot; /> </li></ul></ul>
  73. 73. Facelet demo
  74. 74. En plus... <ul><li>Quelques autres fonctionnalités intéressantes : </li><ul><li>Internationalisation des textes affichés
  75. 75. Différents profils d'utilisation : développement, production, unitTest, etc. 2.0
  76. 76. Support de Groovy pour les composants JSF (managed beans, validateurs, convertisseurs...)
  77. 77. Disponibilité de GET en plus de POST :Bookmark 2.0 </li></ul></ul>
  78. 78. Sommaire <ul><li>1 - Introduction
  79. 79. 2 - Le framework JSF
  80. 80. 3 - Les outils </li></ul>4 - Conclusion
  81. 81. Les outils <ul><li>Librairies de composants </li><ul><li>Richfaces 4.0 Alpha 1, IceFaces, PrimeFaces... </li></ul><li>Serveurs d'application </li><ul><li>Glassfish, Jboss, Tomcat, Jetty </li></ul><li>IDE </li><ul><li>NetBeans 6.8M1, Eclipse et JbossTools 3.1 M4, IntelliJ IDEA... </li></ul><li>Création d'un composant </li><ul><li>Archetypes Maven, Richfaces CDK </li></ul></ul>
  82. 82. Les outils <ul><li>Tests </li><ul><li>Outils spécifiques à JSF permettant des tests « white-box », côté client et serveur, statiques, performances : Jboss JSFUnit, FacesTester </li><ul><li>Exemple de test JSFUnit :
  83. 83. public void testHelloWorld() { JSFClientSession client = new JSFClientSession(&quot;/index.faces&quot;); JSFServerSession server = new JSFServerSession(client); client.setParameter(“input_name_text”, “Damien”); client.submit(“submit_button”); assertEquals(&quot;/hello.jsp&quot;, server.getCurrentViewID()); assertTrue(client.getWebResponse().getText().contains(“Hello, Damien”)); assertEquals(&quot;Damien&quot;, server.getManagedBeanValue(&quot;#{name.text}&quot;)); } </li></ul><li>Outils web génériques pour des tests « black-box » : Selenium, HTTPUnit... </li></ul></ul>
  84. 84. Sommaire <ul><li>1 - Introduction
  85. 85. 2 - Le framework JSF
  86. 86. 3 - Les outils </li></ul>4 - Conclusion
  87. 87. Synthèse des nouveautés de JSF 2 Nouvelles fonctionnalités Simplification AJAX inclus et optimisé Développement de composants facilité Profils d'utilisation Navigation facilitée Externalisation des ressources statiques Réduction de la conf XML grâce aux annotations Nouveaux scopes pour les managed beans Support de GET en plus du POST
  88. 88. Pour aller plus loin <ul><li>Code source de l'application : http://www.cestpasdur.com/svn/webapp-contacts-jsf2/
  89. 89. Refcard JSF2 : http://refcardz.dzone.com/refcardz/javaserver-faces-20
  90. 90. Le site de la spécification JSR-314 : http://jcp.org/en/jsr/detail?id=314
  91. 91. Blog Ed Burns, un des spec leader : http://www.java.net/blogs/edburns
  92. 92. Liste des librairies tierces-parties : http://www.jsfmatrix.net/
  93. 93. Le livre d'Antonio Goncalves sur JEE 6 en général: « Beginning Java EE 6 platform with Glassfish v3 » </li></ul>
  94. 94. Questions / Réponses
  95. 95. Sponsors
  96. 96. Merci de votre attention!
  97. 97. Licence <ul><li>http://creativecommons.org/licenses/by-nc-sa/2.0/fr/ </li></ul>

×