32
Présentation Wicket JUG Lausanne – 11/02/2010 Christian Blavier 1 © OCTO 2010

Wicket - JUG Lausanne

Embed Size (px)

DESCRIPTION

Présentation de 2h sur Wicket donnée le 11/02/2010 au JUG Lausanne. A regarder avec les sources de la démo ici : http://github.com/cblavier/twicker

Citation preview

Page 1: Wicket - JUG Lausanne

Présentation Wicket

JUG Lausanne – 11/02/2010Christian Blavier

1© OCTO 2010

Page 2: Wicket - JUG Lausanne

Je me présente

Christian BlavierArchitecte chez OCTO Technology

Mes dadas :- Industrialisation des développements- Méthodologies agiles- Ruby On Rails- NoSQL

2© OCTO 2010

Page 3: Wicket - JUG Lausanne

Qu’est-ce que Wicket ?

3© OCTO 2010

Page 4: Wicket - JUG Lausanne

Ou bien ?

4© OCTO 2010

Page 5: Wicket - JUG Lausanne

Non, c’est plutôt

5© OCTO 2010

Page 6: Wicket - JUG Lausanne

Gènes de Wicket

Framework d’IHM WEB Open-Source (Apache) Java + HTML … (separation of concerns) Maîtrise du HTML Orienté composant

6© OCTO 2010

Page 7: Wicket - JUG Lausanne

Hello World !

<h1 wicket:id=“msg”>[Text goes here]</h1>

+add(new Label(“msg”, “Hello World !”));

=<h1>Hello World !</h1>

7© OCTO 2010

2 fichiers : HelloWorld.java et HelloWorld.html

Page 8: Wicket - JUG Lausanne

Projet Wicket minimal

pom.xmlsrc/main /webapp/WEB-INF/web.xml /java /com/octo/wicket/HelloWorld.java /com/octo/wicket/HelloWorld.html /com/octo/wicket/WicketApplication.java

8© OCTO 2010

Maven en natif ! J’ai fait le choix de mettre les fichiers HTML dans « resources »

Attention Netbeans ne supporte pas le rechargement à chaud des fichiers HTML en dehors du répertoire webapp (configuration Maven possible)

Page 9: Wicket - JUG Lausanne

Maintenant la démo

Tour de l’application Twitter like Spring / Hibernate JUnit / Unitils Maven / Jetty / HSQLDB / Jrebel

9© OCTO 2010

Part 0

Hello World++

Part 1

Liste de twitts

Part 2

Modèles avancés

Part 3

Validation

Part 4

AJAX

Part 5

jQuery

Page 10: Wicket - JUG Lausanne

Maintenant la démo

10© OCTO 2010

TwickerService

TwickerApplication

HomePage.java .html

MessageMessageMessage

Instancie

Poste des messagesRécupère des messages

Persistance(Hibernate)

HSQLDB

MessageMessageMessage

Page 11: Wicket - JUG Lausanne

Pour jouer avec l’application

Télécharger les sourcesgit clone git://github.com/cblavier/twicker.git

11© OCTO 2010

Configurer jRebel (optionnel)

export MAVEN_OPTS="-noverify –javaagent:$JREBEL_DIR/jrebel.jar

-Drebel.wicket_plugin=true $MAVEN_OPTS"

Lancer l’applicationmvn jetty:run

Page 12: Wicket - JUG Lausanne

Part 0 / Hello world++

Prévisualisation HTML Idéal pour collaborer avec des graphistes S’il s’agit d’un enjeu important sur votre projet, il faudra faire des compromis Pensez à wicket:remove !

Intégration des ressources graphiques ResourceReference

wicket:link, référence automatiquement les ressources contenues dans le package courant

Tests unitaires Utilisation de WicketTester Puissant mais brouillon et mal documenté

12© OCTO 2010

removeLink.add(new Image("icon", new ResourceReference(DiscountsEditList.class, "remove_icon.gif")));

Page 13: Wicket - JUG Lausanne

Part 1 / Première liste de twitts

The component Triad ! html markup / component / model

13© OCTO 2010

Page 14: Wicket - JUG Lausanne

Part 1 / Première liste de twitts

14© OCTO 2010

Wicket component = MVC controller + MVC viewWicket model = MVC model

Page 15: Wicket - JUG Lausanne

Part 1 / Première liste de twitts

Les modèles dynamiques rendent la gestion du binding transparente

15© OCTO 2010

Page 16: Wicket - JUG Lausanne

Part 1 / Première liste de twitts

Intégration Spring : http://cwiki.apache.org/WICKET/spring.html#Spring-Solutions Application Object approach : à oublier Proxy Approach : beaucoup trop verbeux Annotation Approach : meilleure solution !

Notes : On peut injecter des beans dans la WicketApplication, voir exemple Petite gymnastique à effectuer pour les tests afin d’injecter des mocks

16© OCTO 2010

private Mock<TwickerService> twickerServiceMock;

@Beforepublic void before() { tester = new WicketTester(new TwickerTestApplication()); AnnotApplicationContextMock mockContext = ( (TwickerTestApplication) tester.getApplication()).getMockContext(); mockContext.putBean("defaultTwickerService", twickerServiceMock.getMock());}

Page 17: Wicket - JUG Lausanne

Part 2 / Modèles avancés

Les données contenues dans la page sont sérialisées en session.

Attention à l’empreinte mémoire !

17© OCTO 2010

Page LabelModelLabel

rendergetObject

ListViewModelListView

getObjectrender

PageStoreSerialization

Page 18: Wicket - JUG Lausanne

Part 2 / Modèles avancés

• Il faut considérer le modèle Wicket comme un cache de niveau 1 (durée d’une requête HTTP)

• Les modèles volumineux (par ex : données issues de la base) ne doivent pas être sérialisés en session mais être détachés

18© OCTO 2010

Page LabelModelLabel

rendergetObject

ListViewModelListView

getObjectrenderPageStoreSerialization

detach detach

detachdetach

Page 19: Wicket - JUG Lausanne

Part 2 / Modèles avancés

19© OCTO 2010

Imodel cheeseModel = new LoadableDetachableModel(){ @Override public Object load() { return dao.getCheeses(); } }

Equivalents !

Page 20: Wicket - JUG Lausanne

Part 2 / Modèles avancés

Quelques modèles existant :

20© OCTO 2010

Page 21: Wicket - JUG Lausanne

Part 2 / Modèles avancés

Possibilité d’imbriquer les modèles

21© OCTO 2010

LoadableCheeseModel cheeseModel = new LoadableCheeseModel(cheeseId);PropertyModel nameModel = new PropertyModel(cheeseModel, “name”);String name = (String) nameModel.getObject();nameModel.detach();

Page 22: Wicket - JUG Lausanne

Part 3 / Formulaires

22© OCTO 2010

Page 23: Wicket - JUG Lausanne

Part 3 / Validation

form.add(new TextField("age") .setRequired(true) .setLabel(new Model("age")) .add(NumberValidator.minimum(18)));

23© OCTO 2010

Validateur fourni Validateur custom

<!-- html --> <div wicket:id="feedback"></div>

/* Java */ add(new FeedbackPanel("feedback"));

FeedbackPanel

# Index.properties Required=Provide a ${label} or else... myform.name.Required=You have to provide a name. password.Required=You have to provide a password. phonenumber.Required=A telephone number is obligatory.

Messages

public class MyValidator extends AbstractValidator {

...}

Page 24: Wicket - JUG Lausanne

Part 4 et 5 / Ajax

Des composants Ajax disponibles Des Behaviors Ajax Ne pas oublier le outputMarkupId ! Utilisation de librairies de composants tierces

24© OCTO 2010

Page 25: Wicket - JUG Lausanne

Part 5 / Passage d’état

25© OCTO 2010

HTTP est un framework sans état

Passer un état d’un écran à un autre se fait traditionnellement de 2 manières différentes Passage de données dans l’URL Passage de données par la session HTTP

Wicket utilise la deuxième solution, et s’en occupe pour nous Rend l’approche POO beaucoup plus naturelle

public class EditPersonLink extends Link { private final Person person; public EditPersonLink(String id, Person person) { super(id); this.person = person; } public void onClick() { setResponsePage(new EditPersonPage(person)); }}

Page 26: Wicket - JUG Lausanne

Autres fonctionnalités intéressantes

Gestion du layout Attention à la prévisualisation

Création de composants Extrêmement simple : un fichier Java et un extrait HTML associé

Maitrise des URLs Permet de créer des URLS RESTFUL

Fonctionne sur GAE Nécessite 2 ou 3 lignes de configuration pour désactiver la persistance

fichier

26© OCTO 2010

Page 27: Wicket - JUG Lausanne

Avantages / inconvénients

Avantages Framework simple, facile d’accès Grande maîtrise du HTML produit Collaboration développeurs / web designers inédite POO aisée, création de composants intuitive Bonne productivité Communauté importante

Inconvénients Documentation en ligne très perfectible Toutes les situations ne sont pas testables facilement Peu adapté pour des IHMs dynamiques (ex: interfaces à la GMail) Un framework RIA de plus ?

27© OCTO 2010

Page 28: Wicket - JUG Lausanne

Et par rapport aux autres frameworks ?

Par rapport à JSF Wicket est beaucoup plus simple dans l’ensemble (cycle de vie, ajax, création de

composants …) Mauvaise maitrise du HTML en JSF (exacerbée par l’utilisation de frameworks

comme RichFaces)

Par rapport à Tapestry Extrêmement similaires dans leur approche Wicket repose plus sur le Java que tapestry et à l’avantage de mettre en œuvre

du simple HTML On peut considérer Wicket comme un successeur de Tapestry

Par rapport à GWT Les deux prônent un retour au Java, à la POO et au Swing code-style Wicket permet de maîtriser son HTML là où GWT nous dispense d’en écrire GWT est probablement plus productif

28© OCTO 2010

Page 29: Wicket - JUG Lausanne

Pourquoi maîtriser le HTML ?

29© OCTO 2010

Design artistique Référencement

AccessibilitéCompatibilité avec les navigateurs

Page 30: Wicket - JUG Lausanne

Maturité

30© OCTO 2010

Wicket

Une version 1.5 arrive avec notamment une refonte du WicketTester

Page 31: Wicket - JUG Lausanne

Ressources conseillées

http://wicketinaction.com/ http://martijndashorst.com/blog/ http://chillenious.wordpress.com/ http://yeswicket.com/

31© OCTO 2010

(merci pour les exemples !)

MUST READ !

Page 32: Wicket - JUG Lausanne

C’est fini ! Des questions ?

32© OCTO 2010