Apache Wicket : Application Web simplement avec Java

Apache Wicket : Application Web simplement avec Java Nicolas Giard

Agenda • Qu’est ce que Wicket ? • Concepts Fondamentaux • Développer un Composant Personnalisé • Q&R

Wicket en bref • Open Source (Apache Sofware Foundation) • Orienté Composant • Pure Java + Pure xHTML • Simple • Communauté enthousiaste

Qu’est ce que Wicket • La technologie : Orienté Composant, manipulation ‘Programmatique’ des balises • La mission : Apporter le développement objet à la couche présentation d’une application Web • La récompense : S’amuser dans son travail et être de nouveau bons amis avec son manager

Les réponses de Wicket • Faire simplement des choses simples. • Utiliser un modèle de Composant Orienté Objet où les composants sont réellement autonomes. • Réappliquer le pattern Modele-Vue-Controleur sur les composants plutôt que sur les requètes, avec les modèles comme point d’entrée. • Avoir une séparation de contenu propre entre HTML et Java. • Proposer une gestion d’état transparente et complètement automatisée. • Réduire au minimum les besoins de configuration. • Plus d’XML! • Rendre la création et l’utilisation de composants personnalisés plus simple que n’importe quel autre framework.

Composant vs ‘Traditionnel’ • Traditionnel • Struts, WebWork, Spring MVC, etc. • Eprouvé sur le web • Beaucoup de développeurs Web disponibles • Composants • JSF, Wicket, Tapestry, etc. • Modèle traditionnel pour le développement d'UI sur les clients lourds • Beaucoup de développeurs disponibles

Caractéristiques • Composition des Pages • Panels, Borders et héritage de balise • Support excellent de la localisation et des styles • Chargement de template et de resource (_fr.html, .xml) • Model localisé (e.g. pour les labels) • Chargement sophistiqué des ressources (par composition & héritage) • Détection automatique des possibilités du client • Mécanisme de conversion • Intégration • Spring • Guice • Hibernate • JasperReports • OSGi • Composants fantaisistes • ‘triable’, ‘filtrable’, ‘paginable’, tableau orienté données • date picker, editeur de texte, Google Maps • Panneaux à Onglets, navigation, arbre, wizard

Caractéristiques • Gestion de l’état • Sessions à type sûr • Support du clustering • Support du bouton ‘précédent’ • Double stratégies de ‘submit’ • render redirect / redirect to buffered response / none • Support des Test Unitaires • Tests basés sur JUnit • Rapports d’erreur et gestion des logs étendus • Support natif d’Ajax • Ajax sans écrire de JavaScript, Dojo, Scriptaculous, ... • Contribution à l’en-tête HTML • Javascript & CSS • ‘Mounting’ d’URL • URL intelligible • Sécurité au niveau du Composant

Concepts de Wicket • Application • Session • RequestCycle • Composants • Behaviors • Models

Application • Point d’entrée principal de votre application web • Configuration • Afficher les tags spécifiques Wicket? • Vérifier les changements dans le html tout les …? • Définir la page d’accueil • Factories pour • Session • RequestCycle • Security • … • Configurée dans le web.xml : <filter> <filter-name>wicket</servlet-name> <filter-class>org.apache.wicket.protocol.http.WicketFilter</filter-class> <init-param> <param-name>applicationClassName</param-name> <param-value>example.MyApplication</param-value> </init-param> <load-on-startup>1</load-on-startup> </filter>

Session • Abstraction d’une session utilisateur • Typiquement stockée dans HttpSession • Conserve les données spécifiques à la Session • Locale, infos du Client (browser, vendor, version) • Vos propres données? • Utilisateur authentifié • Contenu d’un panier pour un site de commerce • Historique limité des pages pour le support du bouton Précédent

Session publicclass MySession extends WebSession { private ShoppingCart cart; public ShoppingCart getCart() { … } publicvoid setCart(ShoppingCart cart) { … } } … mysession.setCart(new ShoppingCart()); … ShoppingCart cart = mysession.getCart(); cart.add(quantity, selectedProduct);

RequestCycle • Etapes du “Request Cycle”: • Création de l’objet request cycle • Décodage de la requète • Identification des ‘cibles’ de la requète (page, component, …) • Exécution des événements (onClick, onSubmit, …) • Réponse (page, component, image, pdf, …) • Nettoyage

RequestCycle • Deux types de requètes: • Stateful • Liée à une session d'utilisateur spécifique • Pas ‘bookmarkable’ • Stateless • Pas nécessairement liée à une session d’utilisateur spécifique • ‘Bookmarkable’

Composants • Encapsule la manipulation des balises • Peut recevoir des événements • onClick, onSubmit • Sait lui même comment et où il doit s’afficher • Créer un Composant personnalisé est aussi simple que d’écrire ‘extends’ • L’héritage de wicket.Component fait le reste • Disponible dans le classpath de l’application

Composants • Classe mère Ultime : org.apache.wicket.Component • Label • MultiLineLabel • TextField • PasswordTextField • Image • Link • Tree • BookmarkablePageLink • JasperReports • ListView • Loop • PagingNavigator • ImageMap • Button • Ajax… • Sorting, Paging, Repeaters • Wizard • DatePicker

Composants et balises • Un composant est identifié dans le balisage par wicket:id Html: <h1 wicket:id=“msg”>Gets replaced</h1> Java:new Label(“msg”, “Hello, World!”); Final (les tags wicket peuvent être masqués du source html): <h1>Hello, World!</h1>

Composants et balises • Un composant peut avoir son propre fichier html: • Page • Panel • Border • Mettre les fichiers Java, HTML et ressources dans le même package

Example : Hello, World!

Behaviors • Les Behaviors sont des ‘plug-ins’ pour les Composants • Ils peuvent modifier les balises HTML des Composants item.add(new AbstractBehavior() { public void onComponentTag(Component component, ComponentTag tag) { String css = (((Item)component).getIndex() % 2 == 0) ? "even" : "odd"; tag.put("class", css); } }); Output:<tr class=“odd”>…</tr><tr class=“even”>…</tr>

Behaviors • Modifier les attributs des balises du Composant • Ajouter des évenements javascript • Ajouter un ‘comportement Ajax’ component.add(new AjaxSelfUpdatingBehavior(Duration.seconds(1)));

Models • Les Models associent vos POJO’s aux composants Wicket Label(“nom”, model) <<Personne>> +nom : String +ville : String PropertyModel

Models • Le binding en Java n’est pas aisé • Ne fera pas d’update: new TextField(“txt”, personne.getNom()) • Provoquera une NullPointerException: new Label(“rue”, personne.getAdresse().getRue()) • Solution: les expressions type OGNL/EL • PropertyModel: • new PropertyModel(personne, “nom”) • new PropertyModel(personne, “adresse.rue”) • Prévenir le NullPointer à l’update: Personne p = new Personne(); new TextField(“rue”, new PropertyModel(p, “adresse.rue”));

Pourquoi un composant personnalisé? • Eelco Hillenius: « Imagine being told that you can use Java as your programming language, but at the same time being told not to create your own classes. [...] I fail to understand why that has to be different for UI development, and Wicket proves it doesn't have to be so. »

Combien de temps pour un composant ? 464 pages … 20 minutes et encore…

Example: Password strength weak medium strong

Example: Password strength • Les Panels permettent le regroupement • Ils ont leur propre ficher html • Peuvent être échangé dans les pages par d’autres composants • Peuvent contribuer au header de la page html • Peuvent contenir autant de composants que souhaité, même d’autres panels

Example: Password strength

Les Composants sont reutilisables • Mettre le tout dans un JAR • Packager toutes les ressources nécessaires: • HTML, JavaScript, Images, CSS • class file • Mettre le JAR dans le classpath • Prêt à être (re)utilisé

Apache Wicket : Application Web simplement avec Java