La gestion des layouts dans les applications web a toujours \u00e9t\u00e9 pour moi un \u00e9pine dans le pieds jusqu’\u00e0 ce que je d\u00e9couvre Sitemesh. Et pourtant, une API de layouting permet d’\u00e9viter de copier\/coller du code inutile pour d\u00e9crire dans chaque page le header, la navigation, le footer, …<\/p>\n
Avant Sitemesh, deux solutions:<\/p>\n
L’inclusion de JSP est basique et tr\u00e9s tr\u00e9s limit\u00e9 car ne peut r\u00e9ellement tirer profit des framework MVC. Pour moi ce n’est pas une solution donc je ne vais pas en parler ici.<\/p>\n
Tr\u00e9s longtemps j’ai utilis\u00e9 Tiles qui a de nombreux avantages :<\/p>\n
Mais qui, h\u00e9las, comprend aussi de nombreux inconv\u00e9nients :<\/p>\n
Sitemesh lui, a une approche forte diff\u00e9rente: Sitemesh utilise le design pattern decorator (l’article de pcaboche sur developpez<\/a>) pour ‘ajouter’ des briques \u00e0 votre page. Concr\u00e9tement, vous ne d\u00e9veloppez que l’int\u00e9rieur des pages, puis vous d\u00e9finissez dans Sitemesh un layout \u00e0 utiliser dans lequel vous donnez les diff\u00e9rents decorator qui vont aller ajouter des parties d’HTML (donc vont aller d\u00e9corer) vos pages.<\/p>\n La principale diff\u00e9rence de Sitemesh se situe dans le fait que vos pages peuvent \u00eatre cr\u00e9es avec n’importe quelle technologie. Par exemple, vous d\u00e9finissez une page \/toto.do en Spring MVC (ou en Struts ou n’importe quel framework que vous aimez), vous utilisez ensuite le filtre Servlet de Sitemesh et vous lui dites d’intercepter les requ\u00eate en *.do, Sitemesh, lorsque vous appelez \/toto.do, va intercepter la requ\u00eate et la d\u00e9corer.<\/p>\n Dans Sitemesh, les d\u00e9corateurs sont eux m\u00eame des pages compl\u00e8te (donc, \/footer.do, \/header.do, \/navigation.do ou \/toto.do peuvent \u00eatre vues ind\u00e9pendamment, en HTML et peuvent toutes \u00eatres des controlleurs SpringMVC), ce qui permet de les d\u00e9veloper et les tester ind\u00e9pendamment. Et en plus, Sitemesh peut d\u00e9corer une page d’une site, par une page d’un autre site!<\/p>\n Derni\u00e8re fonctionalit\u00e9 \u00e9voqu\u00e9e, la gestion des header. Comme les pages d\u00e9cor\u00e9es et les d\u00e9corateurs sont des pages HTML compl\u00e8te, elles contiennent toutes un titre, des CSS, … Sitemesh permet donc, au niveau de la d\u00e9coration, de sp\u00e9cifier des header par d\u00e9faut puis de les r\u00e9\u00e9crire par l’objet d\u00e9cor\u00e9. En fait, Sitemesh parse les diff\u00e9rentes pages HTML et nous donne acc\u00e9s aux \u00e9l\u00e9ments head et body de la page pour pouvoir aller puiser dedans les informations qui nous int\u00e9ressent.<\/p>\n Bien sure, plein d’autres fonctionalit\u00e9s pour ce framework tr\u00e9s simple d’utilisation et de principe mais tr\u00e9s performant, allez voire sur le site … Je pr\u00e9cise quand m\u00eame que j’utilise Tiles depuis 3 ans et que je vient de d\u00e9couvrire Sitemesh que j’utilise pour un nouveau projets et j’en suis tr\u00e9s content.<\/p>\n Petit r\u00e9capitulatif Sitemesh:<\/p>\n Un exemple simple :<\/span><\/strong><\/p>\n 1. D\u00e9finition du filtre de servlet :<\/strong>\n 2. D\u00e9finition du fichier de configuration de Sitemesh :<\/strong>\n 3. Voici enfin la page de layout :<\/strong>\n Ce petit exemple est loin de montrer toutes les possibilit\u00e9s de Sitemesh mais qui permet d’en montrer la simplicit\u00e9 et le fonctionnement g\u00e9n\u00e9rale.<\/p>\n Site officiel de Sitemesh: http:\/\/www.opensymphony.com\/sitemesh\/<\/a><\/a><\/p>\n N’h\u00e9sitez pas \u00e0 faire vos remarques o\u00f9 \u00e0 me poser des questions.<\/p>\n MISE A JOUR <\/em><\/strong><\/strong>\nCet article sur developpez.com: http:\/\/loic-mathieu.developpez.com\/java\/tutoriel\/sitemesh-intro\/<\/a><\/a><\/p>\n\n<filter>\n<filter-name>sitemesh<\/filter>\n<filter-class>com.opensymphony.module.sitemesh.filter.PageFilter<\/filter>\n<\/filter>\n<\/code><\/p>\n\n<?xml version="1.0" encoding="utf-8"?>\n<decorators defaultdir="\/view\/decorator">\n<decorator name="main" page="main.jsp">\n<pattern>\/*<\/pattern>\n<excludes>\n<pattern>\/ErrorPage<\/pattern>\n<\/excludes>\n<\/decorator>\n<decorator name="empty" page="empty.jsp"\/>\n<\/decorators>\n<\/code>\nIci, on d\u00e9finit la JSP main.jsp comme description de layout et je lui dit d’appliquer ce layout \u00e0 toutes les pages \u00e0 l’exclusion de la page \/ErrorPage. Le decorator empty servant \u00e0 pouvoir d\u00e9finir des decorateur … qui ne d\u00e9corent pas!<\/em><\/p>\n\n< ?xml version="1.0" encoding="utf-8"?>\n< %@ taglib uri="<a href="http:\/\/www.opensymphony.com\/sitemesh\/decorator">http:\/\/www.opensymphony.com\/sitemesh\/decorator<\/a>" prefix="decorator" %>\n< %@ taglib uri="<a href="http:\/\/www.opensymphony.com\/sitemesh\/page">http:\/\/www.opensymphony.com\/sitemesh\/page<\/a>" prefix="page" %>\n< !DOCTYPE html PUBLIC "-\/\/W3C\/\/DTD XHTML 1.0 Strict\/\/EN" "<a href="http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-strict.dtd">">http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-strict.dtd"><\/a>;\n<html>\n<head>\n<title><decorator :title default="BELGACOM DEFAULT TITLE"\/><\/decorator><\/title>\n<decorator:head\/>\n<div><page:applyDecorator name="empty" page="\/decorator\/header"\/><\/page><\/div>\n<div><decorator:body \/><\/div>\n<div><page:applyDecorator name="empty" page="\/decorator\/footer"\/><\/page><\/div>\n<\/head>\n<\/html>\n<\/code>\nIci, on d\u00e9finit donc la pages HTML globale, on lui pr\u00e9cise des \u00e9l\u00e9ments du header globaux qui pourront \u00eatre red\u00e9finit dans l’\u00e9l\u00e9ment d\u00e9cor\u00e9, puis on as ensuite la pages HTML de layout elle m\u00eame.<\/em><\/p>\n