Iniciando com JSF  (Tutorial com exemplo prático)
Autor: Thiago | Publicado: 2009-06-11T14:54:00-07:00

Nesta postagem será mostrado um exemplo prático (CRUD de pessoas) para aqueles que desejam iniciar o uso da tecnologia JSF. Para isso, será utilizado o servidor de aplicação Apache Tomcat 6.0 e a IDE Eclipse Ganymede.Para começar, é preciso criar um novo projeto. No Eclipse, basta abrir o menu file conforme mostrado na figura 1. Em seguida, será aberta uma tela para escolher o tipo de aplicação que será desenvolvida. No caso do exemplo, selecione Dynamic Web Project (figura 2) e clique no botão Next.Na seqüência, dê um nome para o projeto (no exemplo será jsfdemo) e selecione a combo Target RunTime para Apache Tomcat v6.0 (figura 3). Depois, clique no botão Finish que o projeto estará criado.Um vez criado o projeto, é necessário configurar o ambiente para que a aplicação funcione. Para isso, faça o download da ultima versão do JSF e extraia os jars para a pasta WEB-INF/lib do projeto.  Por fim, é necessário configurar o web.xml do projeto, cuja configuração é mostrada na listagem 1.Figura 1:Novo projetoFigura 2: Dynamic Web ProjectFigura 3: Configuração inicial do projeto&lt;?xml version="1.0" encoding="UTF-8"?&gt;&lt;web-app&gt;&lt;context-param&gt;&lt;param-name&gt;javax.faces.STATE_SAVING_METHOD&lt;/param-name&gt;&lt;param-value&gt;server&lt;/param-value&gt;&lt;/context-param&gt;&lt;servlet&gt;&lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;&lt;servlet-class&gt;javax.faces.webapp.FacesServlet&lt;/servlet-class&gt;&lt;load-on-startup&gt;1&lt;/load-on-startup&gt;&lt;/servlet&gt;&lt;servlet-mapping&gt;&lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;&lt;url-pattern&gt;*.faces&lt;/url-pattern&gt;&lt;/servlet-mapping&gt;&lt;/web-app&gt;Listagem 1: web.xmlA partir deste ponto já podemos começar a efetivamente desenvolver a aplicação de exemplo.Construindo a aplicaçãoPara iniciar, vamos criar os seguintes pacotes na projeto:com.sample.controller;com.sample.dao;com.sample.model.A figura 4 ilustra a organização dos pacotes no eclipse.Figura 4: PacotesDentro do pacote model vamos criar a classe pessoa cujo código é listado na listagem 2.package com.sample.model;public class Pessoa {private Integer id;private String nome;private String nacionalidade;public Integer getId() {return id;}public void setId(Integer id) {this.id = id;}public String getNome() {return nome;}public void setNome(String nome) {this.nome = nome;}public String getNacionalidade() {return nacionalidade;}public void setNacionalidade(String nacionalidade) {this.nacionalidade = nacionalidade;}@Overridepublic int hashCode() {final int prime = 31;int result = 1;result = prime * result + ((id == null) ? 0 : id.hashCode());return result;}@Overridepublic boolean equals(Object obj) {if (this == obj)return true;if (obj == null)return false;if (getClass() != obj.getClass())return false;Pessoa other = (Pessoa) obj;if (id == null) {if (other.id != null)return false;} else if (!id.equals(other.id))return false;return true;}}Listagem 2: Pessoa.javaDentro do pacote dao vamos definir a interface PessoaDao cujo código é mostrado na listagem 3.package com.sample.dao;import java.util.List;import com.sample.model.Pessoa;public interface PessoaDao {void save(Pessoa pessoa);void delete(Integer id);Pessoa getById(Integer id);List&lt;Pessoa&gt; findAll();}Listagem 3: PessoaDao.javaDentro do pacote dao é necessário criar também a implementação da interface PessoaDao. No caso do exemplo será definido a classe PessoaDaoImpl (listagem 4).package com.sample.dao;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;import com.sample.model.Pessoa;public class PessoaDaoImpl implements PessoaDao {private static PessoaDaoImpl INSTANCE = new PessoaDaoImpl();private static Map&lt;Integer, Pessoa&gt; database= new HashMap&lt;Integer, Pessoa&gt;();private static Integer nextId = 0;private PessoaDaoImpl() {}public static PessoaDaoImpl getInstance() {return INSTANCE;}@Overridepublic void save(Pessoa pessoa) {if (pessoa != null) {if (pessoa.getId() == null) {nextId++;pessoa.setId(nextId);}database.put(pessoa.getId(), pessoa);}}@Overridepublic void delete(Integer id) {if (id != null)database.remove(id);}@Overridepublic Pessoa getById(Integer id) {return database.get(id);}@Overridepublic List&lt;Pessoa&gt; findAll() {return new ArrayList&lt;Pessoa&gt;(database.values());}}Listagem 4: PessoaDaoImpl.javaDentro do pacote controller vamos definir a classe PessoaController que será o nosso managed bean (listagem 5).package com.sample.controller;import java.util.List;import javax.faces.context.FacesContext;import com.sample.dao.PessoaDao;import com.sample.dao.PessoaDaoImpl;import com.sample.model.Pessoa;public class PessoaController {private PessoaDao pessoaDao = PessoaDaoImpl.getInstance();private Pessoa pessoa;public PessoaController() {pessoa = new Pessoa();}public void save() {pessoaDao.save(pessoa);pessoa = new Pessoa();}public void edit() {// pega o parametro passado no linkInteger id = Integer.parseInt((String)FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap().get("id"));pessoa = pessoaDao.getById(id);}public void delete(){// pega o parametro passado no linkInteger id = Integer.parseInt((String)FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap().get("id"));pessoaDao.delete(id);}// getters e setterspublic Pessoa getPessoa() {return pessoa;}public void setPessoa(Pessoa pessoa) {this.pessoa = pessoa;}public List&lt;Pessoa&gt; getPessoas() {return pessoaDao.findAll();}}Listagem 5: PessoaController.javaVamos agora configurar o faces-config.xml (localizado dentro da pasta WEB-INF) cuja configuração é mostrada na  listagem 6.&lt;?xml version="1.0" encoding="UTF-8"?&gt;&lt;faces-config&gt;&lt;navigation-rule&gt;&lt;from-view-id&gt;pessoa.jsp&lt;/from-view-id&gt;&lt;navigation-case&gt;&lt;from-outcome&gt;*&lt;/from-outcome&gt;&lt;to-view-id&gt;pessoa.jsp&lt;/to-view-id&gt;&lt;/navigation-case&gt;&lt;/navigation-rule&gt;&lt;managed-bean&gt;&lt;managed-bean-name&gt;pessoaController&lt;/managed-bean-name&gt;&lt;managed-bean-class&gt;com.sample.controller.PessoaController&lt;/managed-bean-class&gt;&lt;managed-bean-scope&gt;session&lt;/managed-bean-scope&gt;&lt;/managed-bean&gt;&lt;/faces-config&gt;Listagem 6: faces-config.xmlPor fim, vamos criar nossa página pessoa.jsp (listagem 7).&lt;%@ page contentType="text/html; charset=UTF-8"%&gt;&lt;%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%&gt;&lt;%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%&gt;&lt;html&gt;&lt;f:view&gt;&lt;head&gt;&lt;title&gt;&lt;h:outputText value="Desvendando JSF" /&gt;&lt;/title&gt;&lt;/head&gt;&lt;body&gt;&lt;h:form&gt;&lt;table&gt;&lt;tr&gt;&lt;td&gt;&lt;h:outputText value="Nome" /&gt;:&lt;/td&gt;&lt;td&gt;&lt;h:inputText value="#{pessoaController.pessoa.nome}" /&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;h:outputText value="Nacionalidade" /&gt;:&lt;/td&gt;&lt;td&gt;&lt;h:inputText value="#{pessoaController.pessoa.nacionalidade}" /&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;h:commandButton value="salvar" action="#{pessoaController.save}" /&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;h:dataTable value="#{pessoaController.pessoas}"var="p" rendered="#{not empty pessoaController.pessoas}" border="1"&gt;&lt;h:column&gt;&lt;f:facet name="header"&gt;&lt;h:outputText value="Nome" /&gt;&lt;/f:facet&gt;&lt;h:commandLink value="#{p.nome}" action="#{pessoaController.edit}"&gt;&lt;f:param name="id" value="#{p.id}" /&gt;&lt;/h:commandLink&gt;&lt;/h:column&gt;&lt;h:column&gt;&lt;f:facet name="header"&gt;&lt;h:outputText value="Nacionalidade" /&gt;&lt;/f:facet&gt;&lt;h:commandLink value="#{p.nacionalidade}" action="#{pessoaController.edit}"&gt;&lt;f:param name="id" value="#{p.id}" /&gt;&lt;/h:commandLink&gt;&lt;/h:column&gt;&lt;h:column&gt;&lt;f:facet name="header"&gt;&lt;h:outputText value="Excluir" /&gt;&lt;/f:facet&gt;&lt;h:commandLink value="excluir" action="#{pessoaController.delete}"&gt;&lt;f:param name="id" value="#{p.id}" /&gt;&lt;/h:commandLink&gt;&lt;/h:column&gt;&lt;/h:dataTable&gt;&lt;/h:form&gt;&lt;/body&gt;&lt;/f:view&gt;&lt;/html&gt;Listagem 7: pessoa.jspA partir deste ponto, com as definições acima, podemos vizualizar a aplicação através da URL http://localhost:8080/jsfdemo/pessoa.faces .Veja uma prévia do funcionamento dela (figura 5). Trata-se de um CRUD básico de pessoa.Figura 5: Aplicação JSFUm excelente referencia para quem deseja aprender conceitos relacionados ao JSF é o livro Core JavaServer Faces. Os fontes do exemplo (incluindo Jars) estão disponíveis aqui.Até!Veja também:Internacionalizando mensagens com JSF.