Ola Pessoal,Neste post, irei mostrar um exemplo de como desenvolver aplicacoes web usando o Framework de template Facelets que e facilmente integrado no JSF. O Facelets oferece alguns vantagens:Facilidade na criacao de templates;Elimina o "JSP Compiler to Servlet" incrementando de 30% a 50% a performance da aplicacao;Facilidade para criar componentes reutilizaveis;Usa XHTML como tecnologia de view do JSF;Precisao para reportar erros.Quando se desenvolve aplicacoes em JSF, e recomendavel o uso Facelets, em vez de usar include nas subview no JSF.O exemplo a ser mostrado sera desenvolvido usando JSF 1.2, IDE Eclipse e o servidor JBoss.Antes de comecar, precisamos baixar o Facelets, acesse o site: https://www.dev.java.net/files/documents/3448/99102/facelets-1.1.15.B1.zip, recomendo a usar a versao 1.1.15 no JBoss, depois de baixar, descompacta o arquivo e copia os seguintes jar:el-api-1.0.jarel-impl-1.0.jarjsf-facelets.jarCole este jars no seguinte diretorio do JBoss:jboss-4.2.3.GA/server/default/deploy/jboss-web.deployer/jsf-libs/Precisamos baixar apenas o Facelets, as bibliotecas do JSF nao precisa baixar, pois no diretorio jsf-libs do JBoss, ja contem as bibliotecas do JSF.A versao do JBoss que estou usando e 4.2.3.Ao final do post, o projeto sera disponibilizado para download, para quem quiser baixar.O projeto final tera um layout de acordo com a imagem abaixo:1. Passo: Estrutura do projeto web:2. Passo: Antes de comecar a criar as paginas e necessario fazer algumas configuracoes tanto no arquivo web.xml quanto no faces-config.xml, primeiro iremos configurar o arquivo web.xml, adicionando alguns parametros de contexto.<?xml version="1.0" encoding="UTF-8"?><web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <display-name>facelets</display-name> <!-- Use Documents Saved as *.xhtml --> <context-param> <param-name>javax.faces.DEFAULT_SUFFIX</param-name> <param-value>.xhtml</param-value> </context-param> <!-- Special Debug Output for Development --> <context-param> <param-name>facelets.DEVELOPMENT</param-name> <param-value>true</param-value> </context-param> <!-- Optional JSF-RI Parameters to Help Debug --> <context-param> <param-name>com.sun.faces.validateXml</param-name> <param-value>true</param-value> </context-param> <context-param> <param-name>com.sun.faces.verifyObjects</param-name> <param-value>true</param-value> </context-param> <!-- Servlet JSF --> <servlet> <servlet-name>javax.faces.FacesServlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>javax.faces.FacesServlet</servlet-name> <url-pattern>*.faces</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list></web-app>web.xmlAgora vamos adicionar o FaceletViewHandler no arquivo faces-config.xml<?xml version="1.0" encoding="UTF-8"?><faces-config xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd" version="1.2"> <application> <!-- Facelets --> <view-handler> com.sun.facelets.FaceletViewHandler </view-handler> </application></faces-config>faces-config.xml3. Passo: Agora vamos criar as paginas para ser usadas no Facelets, do tipo .xhtml, para criar com estas extensoes no Eclipse, basta criar um novo arquivo file e colocar o nome + a extensao .xhtml.<!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"><head> <title>Facelets com Eclipse e JBoss Application Server</title> <link href="css.css" rel="stylesheet" type="text/css" /></head><body><div id="tudo"> <div id="topo"> <ui:insert name="topo"> <ui:include src="topo.xhtml" /> </ui:insert> </div> <div id="centro"> <div id="menu"> <ui:insert name="menu"> <ui:include src="menu.xhtml" /> </ui:insert> </div> <div id="principal"> <ui:insert name="principal"> </ui:insert> </div> </div> <div id="rodape"> <ui:insert name="rodape"> <ui:include src="rodape.xhtml" /> </ui:insert> </div></div></body></html>template.xhtmlNo codigo acima, temos algumas tags do Facelets, o ui:insert serve para definirmos um ponto de substituicao no template, o ui:include serve para incluir um fragmento.Agora vamor criar as paginas de fragmentos.Pagina topo:<ui:fragment 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"> TOPO </ui:fragment>topo.xhtmlA tag ui.fragment e usada para definir um bloco de conteudo.Pagina de menu:<ui:fragment 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"> <h:form> <ul> <li><h:outputLink value="index.faces">LINK1</h:outputLink></li> <li><h:outputLink value="index.faces">LINK2</h:outputLink></li> <li><h:outputLink value="index.faces">LINK3</h:outputLink></li> <li><h:outputLink value="index.faces">LINK4</h:outputLink></li> </ul> </h:form></ui:fragment>menu.xhtmlPagina do rodape:<ui:fragment 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"> RODAPE </ui:fragment>rodape.xhtmlAgora vamos criar uma pagina que ira fazer o relacionamento de composicao com o template.Pagina index do Facelets:<!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="/template.xhtml"> <ui:define name="principal"> <h1><h:outputText value="Exemplo de Facelets usando Eclipse e