Modèle correct pour l'agencement d'une page web?

**lucpolak** · 22/04/2012, 17h28

Bonjour,

Je suis un débutant en JSF. Je suis entrain de réaliser une appli WEB et justement je galère a concevoir une architecture MVC qui tienne la route. Je m'explique.

Avant d'entrer dans le coeur du sujet, j'ai un souci de structuration. J'ai une page qui est classiquement découpée en 3 parties (un header, un menu gauche et le contenu au centre. Comme vous vous en doutez, j'aurais un certain nombres de pages, et faire du copier-coller pour avoir la même chose ne m’intéresse pas. J'ai donc crée une page principale (mainpage.jsp) qui fait une série de <jsp:include pour inclure des morceaux de code. Jusque ici tout va presque bien. Mais par contre, j'ai prévu une gestion de widgets dynamique et paramétrables. J'ai une table qui contient une liste de widgets en fonction de leur position. Un widget est donc défini par une page qui lui est propre et une position dans le template.

En l’occurrence, dans le contenu a gauche (leftcontent), je vais avoir un widget qui va charger la page "menu.jsp". Donc pour faire des includes dynamiques, je n'ai pas trouvé de solution en jsf, je le fais donc en jsp avec l'instruction <%@include... J'ai donc un mélange de <jsp:include> et de <%@include>. Sachant que l'un inclue le résultat de la page alors que l'autre la page elle même puis effectue le rendu, ce qui n'est pas exactement la même chose... soit !

Donc, tant bien que mal, j'ai un code assez léger et propre. les widgets ne contiennent que les balises qui les concerne (pas besoin de faire 1 page par écran en copiant

Pour la gestion du contenu, j'aimerais faire un mvc du genre de joomla. C'est à dire que je passe des paramètres com et view pour respectivement component et view. En fonction de ces 2 éléments, je trouve la page à charger /components/<com>/<view>.jsp. La ici je me débrouille encore mais je dois le faire en JSP pour que les includes fonctionnent.

Aussi, je me pose la question sur la cohérence de mon code. Est-ce logique ? Quel modèle utilisez vous dans des applications professionnelles. Car oui, je souhaite que mon appli soit évolutive facilement. Je travaille au boulot sur un veau de 2200 page et rien n'est factorisé, c'est un gros bordel ! J'aimerais autant que mon appli soit propre :-).

Merci de vos réponses :-)

Lucpolak

**Jacobian** · 22/04/2012, 19h12

MVC joomla n'a rien avoir avec celui du JSF je te conseil d'aller jeter un coup d'oeil sur les cours JSF dans la section dédié pour comprendre comment ca marche.

**lucpolak** · 23/04/2012, 10h33

Envoyé par Jacobian

MVC joomla n'a rien avoir avec celui du JSF je te conseil d'aller jeter un coup d'oeil sur les cours JSF dans la section dédié pour comprendre comment ca marche.

Merci pour ta réponse. Par contre, les tuto, j'en a fait le tour. J'ai regardé sur tous les sites et le problème c'est qu'ils ne proposent pas une archi coplète. Ils mettent en oeuvre le JSF mais il n'y a rien de concret dans le cas de projets plus volumineux. Que proposerait-tu comem archi ? Que fais tu d'habitude ?

Merci

**OButterlin** · 23/04/2012, 10h55

Tu utilises quelle version de JSF, 1.2 ou 2.0 ?
Si 1.2, tu devrais ajouter Facelets qui permet de faire du templating
Avec la 2.0, c'est en standard

**lucpolak** · 23/04/2012, 11h12

Envoyé par OButterlin

Tu utilises quelle version de JSF, 1.2 ou 2.0 ?
Si 1.2, tu devrais ajouter Facelets qui permet de faire du templating
Avec la 2.0, c'est en standard

Alors j'ai regardé un peu du côté des facelets(je suis en JSF 2.1) mais il me semble que en passant par facelets, je ne peut plus intégrer du code java classique (<% ... %>) vu que je dois faire des fichiers XHTML. Bon la je ne suis plus très sur de ce que je dis c'est peut être n'importe quoi :-).

**Jacobian** · 23/04/2012, 11h38

voici un exemple d'utilisation de facelet:
insertTemplate.xhtml

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html">
<head>
<title>Facelets example</title>
</head>
<body >
<div style="border-bottom: grey 2px solid; border-left: grey 2px solid; border-right: grey 2px solid; border-top: grey 2px solid; height: 100%; margin: 4px auto; text-align: center; width: 100%;">
<ui:insert name="header">
       <ui:include src="header.xhtml" />
</ui:insert></div>
<table width="100%" >
        <tr>
                <td width="20%">
                <div style="height: 250px; width: 100%; background-color: #e0e0e0; text-align: center;">
                 <br></br>
                <ui:insert name="sidemenu">
                <h:form>
                         <h:commandLink value="Home"></h:commandLink>
                         <br />
                         <br />
                         <h:commandLink value="News"></h:commandLink>
                         <br />
                         <br />
                         <h:commandLink value="Articles"></h:commandLink>
                         <br />
                         <br />
                         <h:commandLink value="About Us"></h:commandLink>
                         <br />
                         <br />
                 </h:form>
                 </ui:insert></div>
                 </td>
                 <td width="85%">
                 <ui:insert name="content">Content displayed from Template </ui:insert>
                 </td>
                 </tr>
</table>
<div style="border-bottom: grey 2px solid; border-left: grey 2px solid; border-right: grey 2px solid; border-top: grey 2px solid; height: 100%; margin: 4px auto; text-align: center; width: 100%;">
<ui:insert name="footer">
       <ui:include src="footer.xhtml" />
</ui:insert></div>
</body>
</html>

la page home.xhtml :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
         xmlns:ui="http://java.sun.com/jsf/facelets"
         xmlns:h="http://java.sun.com/jsf/html"
         xmlns:f="http://java.sun.com/jsf/core">
<ui:composition template="WEB-INF/templates/insertTemplate.xhtml">
<ui:define name="content">
        This is an example of a simple Facelets template.<br/>
        Here Header, Footer and Side Menu bar appears from template.(insertTemplate.xhtml)<br/>
        This section appears from templateClient.(home.xhtml)
</ui:define>
</ui:composition>
</html>

**lucpolak** · 23/04/2012, 11h42

Merci pour l'exemple.
Par contre si dans ce dernier je veux faire quelque chose comme :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
 
<ui:define name="content">
       <%
       List<Widget> listw = ...
       for(Widget w : listw)
       {
             %>
 	<jsp:include page="<%=w.getPage()%>"/> 
             <%
       }
       %>
</ui:define>

**Jacobian** · 23/04/2012, 13h54

tu peux utiliser

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

ui:repeat

**lucpolak** · 24/04/2012, 11h02

Envoyé par Jacobian

tu peux utiliser

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

ui:repeat

J'ai essayé mais comment je fais pour inclure une page dynamique ??

J'ai crée un bean pour mes widgets et j'ai fait ca :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<ui:repeat value="#{WidgetsBean.widgets}" var="w">
  <jsp:include page="#{w.page}"/>
</ui:repeat>

Je me doutais que ca n'allait pas marcher car le tag jsp:include n'est pas autorisé...

Alors comment faire ?

EDIT : J'ai également essayé avec un ui-include mais apparement c'est pas fait pour fonctionner dans un ui-repeat mais plutôt un <c:forEach>...

Merci

**lucpolak** · 24/04/2012, 12h16

Bon,

en mettant ça ça fonctionne :-)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<c:forEach items="#{WidgetsBean.widgets}" var="w">
<ui:include src="#{w.page}"/>
</c:forEach>

Par contre faut que je bascule tout en XHTML. Alors juste une petite précision. A priori le XHTML (JSF + Facelets) c'est censé être suffisant pour ne pas avoir besoin de JSP ? Vu que c'est une décision important, j'aimerais ne pas me tromper.

Merci de votre feedback et pour vos conseils.