Sentindo a necessidade de tutoriais em português sobre como iniciar uma aplicação básica em jsf, resolvi escrever sobre o assunto de forma rápida e até certo ponto resumida, deixando que você enfrente alguns problemas para aguçar sua curiosidade sobre a tecnologia JSF 
Dependências
Netbeans IDE 6.0 (ou qualquer IDE que você ache melhor, sabendo fazer as devidas alterações)
Tomcat 6.0.14 (ou outro container web JEE 5)
“Basicamente só esses dois resolvem, pois o Netbeans já tras as bibliotecas necessárias ao JSF”
Iniciando
Na aba de projetos do netbeans (Projects), clique com o botão direito do mouse e escolha, New Project. Depois em Web -> Web Application. Dê o nome para seu projeto e abaixo selecione o container Tomcat 6.0.14. Clique Next. Na tela de seleção do framework, escolha JavaServer Faces somente. Finish.
Implementando
O Netbeans criou para você uma nova tela jsp com um HelloWord em JSF. Vamos modificar as coisas um pouco.
O Netbeans criou seu web.xml e o faces-config.xml já configurados para rodar o JSF. Estou disponibilizando os fontes, para uma idéia real do que está sendo feito por trás. Vamos lá..
Estrutura de diretório:
[Projeto]
-web
-WEB-INF
-web.xml
<context-param> <param-name>com.sun.faces.verifyObjects</param-name> <param-value>false</param-value> </context-param> <context-param> <param-name>com.sun.faces.validateXml</param-name> <param-value>true</param-value> </context-param> <context-param> <param-name>javax.faces.STATE_SAVING_METHOD</param-name> <param-value>client</param-value> </context-param> <servlet> <servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>0</load-on-startup> </servlet> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>/faces/*</url-pattern> <!–- Altere essa linha para [ <url-pattern>*.jsf</url-pattern> ] -–> </servlet-mapping> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list>
Estamos declarando um servlet chamado de Faces Servlet que está sendo mapeado por *.jsf. Isso quer dizer, que todo arquivo chamado com nome_qualquer.jsf, será carregado pelo servlet do jsf. Esse é o servlet que faz todo controle do JSF em nossas aplicações.
O outro arquivo que o Netbeans já criou e configurou para nós foi o faces-config.xml, que contém a estrutura e mappeamento dos nossos BackingBeans. Ele é o arquivo mais importante para uma aplicação JSF, pois também contém as regras de navegação da aplicação e várias outras coisas.
O faces-config.xml fica no mesmo diretório do web.xml, e sua estrutura está como abaixo:
<?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"> </faces-config>
Perceba que não existe ainda nenhuma configuração especial dentro do arquivo, pois nenhuma regra foi criada ainda.
Um outro arquivo criado foi o welcomeJSF.jsp que contém duas tags JSF. A primeira é a <f:view /> que informa ao JSF onde começa o arquivo para o jsf e onde termina. Ou seja, ele só reconhecerá as tags e atributos JSF que estiverem dentro da view. E a outra tag é a <h:outputText />, que é apenas uma saída de texto, onde o valor da saída é expresso pelo value=”".
Vamos começar a fazer as coisas a nosso modo realmente. Altere o arquivo welcomeJSF.jsp para o seguinte (lembrando que a parte que não é apresentada, não sofrerá modificações):
welcomeJSF.jsp
<f:view>
<h:form id="formLogin">
<h:messages />
<br />
<h:outputText value="Login" />
<h:inputText value="#{loginBean.login}" />
<br />
<h:outputText value="Senha" />
<h:inputText value="#{loginBean.senha}" />
<br />
<h:commandButton action="#{loginBean.logar}" value="Entrar no Sistema" />
</h:form>
</f:view>
No código acima estamos fazendo uma pequeno formulário de login, bem simples. Onde o primeiro dado que é soliciado do usuário é o login, e logo após sua senha. Seria uma tela básica de login em um sistema qualquer.
Usamos dois outputText que nós já conhecemos e dois inputText que são entradas de texto. No final, geram inputs html assim: <input type=”text” value=”Valor que vier do backingBean” name=”aleatorio” />. E também usamos o h:commandButton que gera um botão html com uma ação definida pelo método chamado no action. Perceba que definimos um, <h:messages />. Ele é responsável por exibir mensagens jsf, como erros de validação, erros de conversão, mensagens que definimos de alertas, como abaixo será mostrado.
Perceba que também estamos fazendo referência a um backingBean através do value e do action do botão. Porém ainda não criamos esse backingBean. Mas o que são backingBeans?
BackingBeans: Como o próprio nome já expressa, são beans, ou classes java (bean), que ficam por trás da view, ou da página jsf. Eles são diretamente ligados com a visão da aplicação jsf, onde são definidos atributos (exemplo o e-mail e a senha) e também são definidos métodos (como o logar do botão de entrar no sistema). Eles são a base para uma página jsf.
Vamos então desenvolver nosso backingBean para entendermos como funciona essa comunicação entre a visão jsf e a classe java “por trás”.
LoginBean.java
public class LoginBean {
private String login;
private String senha;
// get's e set's
public String logar() {
if (login.equals("paulojr")) {
if (senha.equals("123")) {
return "autorizado";
}
}
FacesContext.getCurrentInstance()
.addMessage("erro", new FacesMessage("Login não autorizado!"));
return null;
}
}
Algumas explicações sobre nosso backingBean.
Nossa visão só consegue ler propriedades que possuam métodos acessores (get’s e set’s). É por esses métodos que o JSF procura na propriedade <h:inputText value=”#{loginBean.login} />.
O método logar() é invocado pelo commandButton, que tem um retorno do tipo String. Esse retorno informa ao JSF para que página ele deve direcionar o usuário. Agora é onde entra nosso mapeamento.
Após criado nosso BackingBean (LoginBean.java), vamos configurar para fazer o JSF conhecer nosso BackingBean.
Abra o arquivo faces-config.xml e adicione as seguintes linhas:
faces-config.xml
<managed-bean> <managed-bean-name>loginBean</managed-bean-name> <managed-bean-class>exemplo.LoginBean</managed-bean-class> <managed-bean-scope>request</managed-bean-scope> </managed-bean> <navigation-rule> <from-view-id>/welcomeJSF.jsp</from-view-id> <navigation-case> <from-outcome>autorizado</from-outcome> <to-view-id>/autenticado.jsp</to-view-id> <redirect/> </navigation-case> </navigation-rule>
A tag <managed-bean> é o mapeamento da nossa classe para a visão, onde usamos algo do tipo <inputText value=”#{loginBean.login}” />. O <managed-bean-name> faz referência ao nome que será usado na visão. O <managed-bean-class> faz referência a classe mapeada com seu respectivo pacote, e o <managed-bean-scope> é o escopo da aplicação, que pode ser “request”, “session” e “application”. (Em outro artigo poderei detalhar mais sobre o escopo).
As regras de navegação, são marcadas pelo <navigation-rule>, que diz: Se eu estiver em /welcomeJSF.jsp e receber a String autorizado, quero ir para /autenticado.jsp.
A ultima tag <redirect />, informa ao jsf que o usuário deve ser redirecionado para a página autenticado.jsp sem manter o estado.
Vamos criar então a tela de mensagem de sucesso para o caso do login esta correto.
autenticado.jsp
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Autenticado</title> </head> <body> <h2>Sucesso!</h2> <p> Você foi autenticado com sucesso! </p> </body> </html>
Perceba que é apenas uma página jsp normal, que serve só para sabermos se os dados foram validados com sucesso, e se nossa app jsf está obedecendo as regras criadas no faces-config.xml.
Agora coloque para rodar o projeto feito, e veja o resultado. Tente logar com o usuário diferente do definido no LoginBean e senha diferente também. Depois tente fazer um login com os usuários definidos e veja se você é direcionado para a página correta.
Conclusão
Tentei exibir um uso simples de jsf, tentando demostrar desde a criação de uma página simples, passando os dados pelo managed bean e validando as configurações do faces-config. Daí em diante dá pra ir abstraindo-se de algumas coisas e melhorar a aplicação de uma forma gigantesca.
Qualquer dúvida podem comentar ou enviar e-mail que ajudarei no que for possível.
