SlideShare a Scribd company logo
1 of 108
JSF Introdução
Introdução Desenvolvimento Web Aplicações web tornam-se mais e mais importantes  Mais e mais complexas: Ajax, validação (server vs. client), efeitos...  Exigência mais elevada do cliente durante os anos  Interfaces ricas (fáceis de usar)  Prazos cada vez mais curtos  Desenvolvimento considerado difícil
Introdução Surgiram diversos frameworks MVC: Apache Struts WebWork (Struts2)  Spring MVC  Tapestry JbossSeam E muito outros.. continuam surgindo mais
Introdução Problemas  Java não nos fornece o bastante para  	desenvolvermos aplicações web com produtividade  Dificuldade para integrar vários frameworks (algumas  	vezes nem é possível)  Falta de padrão para um framework web  Ausência de uma API padrão para construir  	componentes web java   
Introdução Um pouco da história   HTML Servlets JSP  
Introdução HTML Estático, simples Não tem conexão com Base De Dados Ótimo para criar Home Pages OlaMundo.html <html> 	<head>   		 <title>Olá Mundo</title>  	</head>  	<body>    		Olá Mundo.  	</body>  </html>  
Introdução Servlets   É uma extensão de servidores Disponibiliza uma interface para o servidor Recursos Dinâmicos para web Interage com os clientes Necessita de um Servlet Container (Ex: Tomcat)  
Introdução Servlets  import java.io.*; import javax.servlet.*;   import javax.servlet.http.*;   public class HelloWorldServlet extends HttpServlet {     public void doGet(HttpServletRequest request,  HttpServletResponse response) throws ServletException, IOException {       response.setContentType("text/html");       PrintWriter out = response.getWriter();       out.println("<html><body>Olá Mundo</body></html>");       out.close();     }   }
Introdução Java Server Pages – JSP   O JSP foi desenvolvido APENAS para mostrar resultados, o SERVLET deveria fazer a ponte com o banco de dados e fazer as regras de negócio Facilitar a criação de HTML Scriplets:  colocar código Java no JSP ;-(
Introdução OlaMundo.jsp <html> 	<body> 	<% String mensagem = "Olá Mundo!";       	out.println(mensagem); %> 	<br>  	Muito mais simples de editar o html e muito maiscomplicado de editar o codigo Java 	<br> </body> </html>
Introdução Frameworks Frameworks são projetados com a intenção de facilitar o desenvolvimento de software, habilitando designers e programadores a gastarem mais tempo determinando as exigências do software do que com detalhes de baixo nível do sistema Não reinventar a roda
Introdução Struts Framework: Action Based   MVC para construções de aplicações WEB Cada solicitação HTTP tem que ser respondida com uma resposta HTTP O .do  é mapeado no arquivo struts-config.xml O  ActionServlet  define o  Action  correspondente para a solicitação
Introdução Struts Framework: Action Based   O  ActionServlet coloca a entrada em um JavaBean , estes JavaBeans são definidos como FormBeans O Action pode acessar o FormBean efetuar qualquer operação e armazenar o resultado em um ResultBean O Action interage com a camada de negócio onde uma base de dados poderá ser atualizada
Introdução Struts Framework: Action Based  
Introdução Framework: Component Based Rápido aprendizado Baseado em Componentes Deixa o programador despreocupado com a parte visual Programação Web como Desktop Simplicidade Agilidade
Introdução Frameworks Web Component Based Java Server Faces JBossSeam Wicket
JSF - Introdução JavaServer Faces é... Uma especificação ? Um framework baseado em componentes  ? Interface com o usuário ? Um framework dirigido a eventos ? Padrão de mercado ? RAD ? Um framework MVC ?
JSF - Introdução JavaServer Faces é...  Uma especificação  JSR 127 (JSF 1.0 e JSF 1.1) – 2004         JSF 1.0 – não alcançou o sucesso esperado  		JSF 1.1 – corrigiu os erros da versão anterior  	 JSR 252 (JSF 1.2) - 2006 (Java EE 5.0)  		JSF 1.2 – melhor compatibilidade com JSP 2.1 e correção de  		bugs
JSF - Introdução JavaServer Faces é...   •   JSR 314 (JSF 2.0)            • Arquitetura, produtividade, ferramentas RAD, AJAX, melhores              componentes UI..            • Em desenvolvimento, porém estão planejando deixar bem 	integrado e intuitivo.
JSF - Introdução JavaServer Faces é...  ... um framework baseado em componentes de  interface com o usuário  JSF é construído sob o conceito de componentes  Os componentes são a base para a construção da interface  	com o usuário  Existem componentes padrões equivalentes a quase todas       as tags HTML e diversos componentes auxiliares
JSF - Introdução JavaServer Faces é...  Existem diversas bibliotecas de componentes disponíveis       comerciais e open source  Os componentes são expressos através de tags em um  JSP e posteriormente transformados em HTML
JSF - Introdução ... um framework dirigido a eventos  Possui um modelo para manipulação de eventos  Componentes geram determinados eventos  Faz chamada à um método (ação no servidor)  O estado da aplicação web muda devido ao evento disparado pelo usuário  Um evento pode ser um click em um botão, focar sobre um input ou mesmo alterar o valor de uma combo-box
JSF - Introdução ... padrão de mercado  É uma especificação (JCP)  Java EE 5.0  Suporte de Big Players  	Sun, Apache, IBM, Oracle, BEA Systems, Borland, ...  IDEs (NetBeans, Eclipse, MyEclipse, JDeveloper, ...)  Implementações (Sun (R.I), Apache, IBM, ...)  Conjuntos de componentes (ADF Faces, Apache MyFaces, WoodStock, IceFaces, JBoss RichFaces, ...)
JSF - Introdução .. RAD (Rapid Application Development)  4 camadas:  	Arquitetura de componentes básica  	Conjunto de componentes padrão  	Infra-estrutura da aplicação  	Ferramenta RAD
JSF - Introdução .. RAD (Rapid Application Development)  JSF padroniza os primeiros três pontos e permite a criação  de ferramentas RAD  Utiliza-se IDEs drag-and-drop para construir aplicações  Sun Studio Creator, NetBeans, Jdeveloper,Eclipse etc
JSF - Introdução ... um framework MVC para construir interfaces com o  usuário para aplicações web. JSF inclui:  Um conjunto de APIs para:  representar os componentes UI e gerenciar o estado destes componentes  manipular os eventos e validação de entrada do usuário  definir e controlar a navegação entre as páginas  dar suporte a internacionalização e acessibilidade
JSF - Introdução Resumo É mais do que um framework, é uma especificação baseada em MVC Suporte à internacionalização Facilita criação de telas Facilita a transferência dos dados entre telas e camadas de negócio através da EL Facilidade para criação de componentes
JSF - Introdução Resumo Produtividade para conversores recebidos do formulário para os tipos nas classes Flexibilidade para renderização Criar modelos simples de eventos entre interfaces gráficas e as classes no servidor Mecanismos produtivos para validação de campos na tela
JSF - Introdução Por que usar JSF?  É um padrão de mercado  Presente na especificação JEE5.0 e em breve JEE6.0  Suporte de Big Players  Fácil de usar e produtivo  Fornece separação de funções que envolvem a construção de aplicações Web
JSF Por que usar JSF?  Alta abstração para desenvolvimento de aplicação web  Modelo de programação dirigido a eventos (oposto ao modelo HTTP request/response)  Baixa curva de aprendizagem da equipe  Vários pontos de extensão (converters, validators, listeners etc)  Componentes já prontos!
JSF Por que usar JSF?  Reusabilidade e estrutura de componentes extensível  Acessibilidade (browsers, celulares, pda’s, ...)  Segurança OWASP (Open Web Application Security Project) cross-site scripting, session hijacking, execução de métodos, ...  Natureza orientada a componentes, validação e pontos de extensão
JSF Por que usar JSF?  Grande atividade da comunidade em fóruns, listas de  	discussão, blogs, portais, revistas, livros etc  Integração com diversos frameworks: 	Spring, Spring-Annotation, Spring-Webflow, Hibernate, EJB3, JPA,  JBoss Seam, Acegi, JAAS, Struts, Struts2, Shale, Tiles, Facelets, Sitemesh, DWR, EXT, Crank, Beehive-Webflow, GWT, Portlets e muitos outros
JSF Por que usar JSF?  Testes unitários  Shaletesting framework  Templates  Tiles e Sitemesh  Facelets
JSF Por que usar JSF?  IDEs e WYSIWYG (What you see is what you get)  Eclipse (MyEclipse, Europa, Ganymed), IntelliJ IDEA, Jbuilder, NetBeans (Visual WebPack) , IBM Rational App/Web Sun Java Studio Creator , Oracle Jdeveloper,                  Red Hat Developer Studio (antigo Exadel Studio)  e JSFToolbox (Dreamweaver)
JSF Por que usar JSF?  Grande variedade de componentes comerciais e open-  source disponíveis  Myfaces Tomahawk        Backbase  Myfaces Sandbox           Simplica (ECruiser Suite)  Myfaces Tobago             QuipuKit   Myfaces Trinidad       Blueprints
JSF Por que usar JSF?  Myfaces Orchestra       RCFaces  ADF Faces                   Jenia4Faces  IceFaces                      ZK  WoodStock                  G4JSF (GWT API) JBoss RichFaces         Dynamic Faces  JBoss Ajax4jsf             Crank
JSF Conceitos chaves do JSF  Componentes  Renderers  Managed-beans  Converters / Validators  Navegação  Eventos  Ciclo de vida (Request Lifecycle)
JSF Componentes Separa a lógica de negócio da apresentação  Cada view é composta por uma hierarquia de componentes  Componentes podem ser adicionados na view  	programaticamente ou via template (JSP por default, ou  	Facelets para melhor desempenho e fácil desenvolvimento)
JSF Componentes são expressos em tags em uma página JSP  e em sua maioria são de interface com o usuário  Os componentes padrões são divididos em dois grupos:  Faces Core <f:view>, <f:loadBundle>, <f:param>  	HTML wrappers <h:dataTable>, <h:selectOneMenu>  	Componente = class + [renderer] + tag handler (JSP)
JSF Renderers  Responsável por exibir o componente no cliente  São agrupados em render kits  Render kit padrão é o HTML, mas podemos ter WML, SVG etc.  Efetua o encode (gera HTML do componente)  Efetua o decode (seta o componente com os dados da URL query string e do formulário)
JSF Exemplo: <h:inputText id=“login” size=“16” />  <input type=“text” id=“myForm:login”  	name=“myForm:login” size=“16” />
JSF Renderes:
JSF Managed beans  POJO – Plain Old Java Objects
JSF Managed beans  Podem ser definidos nos escopos de: Application, Session, Request e None É uma classe que envia objetos de negócio para camada de apresentação São registrados no faces-config.xml
JSF Managed beans  Objetos que sofrerão alterações em seus atributos durante uma requisição, assim como seus métodos podem ser chamados a partir de um command São como as Actions do Struts, porém os form beans são injetados por setters dentro do seu próprio bean Os ManagedBeans serão usados na EL das páginas
JSF Managed beans
JSF Obtendo o Managed beans nos escopos: Request: User user = (User)FacesContext.getCurrentInstance().getExternalContext().getRequestMap().get("user"); Session User user = (User)FacesContext.getCurrentInstance().getExternalContext().getSessionMap().get("user"); Inserindo o Managed beans nos escopos: Request: FacesContext.getCurrentInstance().getExternalContext().getRequestMap().put("user", (User)users.getRowData()); Session FacesContext.getCurrentInstance().getExternalContext().getSessionMap().put("user", (User)users.getRowData());
JSF JSF Value Binding  “Binda” valor do componente ao managed-bean  O binding ocorre através de JSF Expression Language (EL)  Semelhante a JSTL, porém usa-se ‘#{}’ no lugar de ‘${}’  Pode-se executar métodos no modelo através de expressões  Não é processada imediatamente como na JSTL  A partir da JSF 1.2 utiliza-se a Unified Expression Language (JSP  2.1) que resolve problemas de incompatibilidade entre a JSF-EL e JSP-EL  	<h:outputText value="#{pessoa.nome}"/>
JSF JSF Value Binding
JSF JSF Value Binding
JSF Converters  Tem por finalidade converter e/ou formatar  	objetos do tipo Java para String e vice-versa  Converters são bi-direcionais  Managed-bean faz: getAsObject()  JSP faz: getAsString()
JSF Converters  JSF já fornece converters padrões para date / time, numbers etc  Você pode implementar seu próprio converter: Basta implementar a interface javax.faces.convert.Converter Registrar o converter no faces-config.xml  O converter pode atuar de forma explícita(id) ou implícita(class) de acordo com a sua configuração no faces-config.xml
JSF Converters  javax.faces.convert.Converter Converter é registrado dentro faces-config.xml
JSF Converter para que toda propriedade do tipo org.com.model.CPF de qualquer bean use este converter  <converter>  	<converter-for-class>  		org.com.model.CPF  	</converter-for-class>  	<converter-class>  		org.com.faces.CPFConverter  	</converter-class>  </converter>
JSF Converter declarado explicitamente: <h:inputText id=“cpf“ value="#{UserRegistration.user.cpf}">  	<f:converter converterId=“br.com.CPFConverter“ />  </h:inputText>  Ou implicitamente (converter mapeado para objetos do tipo CPF)  <h:inputText id=“cpf“ value="#{UserRegistration.user.cpf}">  NADA AQUI ;-) </h:inputText>
JSF Converter Padrões do JSF: <h:inputText id="age" value="#{UserRegistration.user.age}">  <f:converter id="javax.faces.Short"/>  </h:inputText>
JSF Validatores  Tem por responsabilidade garantir que o valor  	informado pelo usuário seja válido  Validador trabalha com objetos, não somente com Strings  JSF já fornece validadores padrões como required, length, range etc
JSF Você pode implementar seu próprio validador  Basta implementar a interface javax.faces.validator.Validator Registrar o validador no faces-config.xml  Você pode associar um ou mais validadores aum  	componente
JSF javax.faces.validator.Validator Validadores são registrados no faces-config.xml  <validator>   <validator-id>br.com.validaCPF</validator-id>   <validator-class>faces.validaCPF </validator-class> </validator>
JSF Validação de obrigatoriedade e comprimento do campo: <h:inputText id=“firstName“ value="#{user.firstName}“ required=“true”> <f:validateLength  minimum="2“ maximum="25“ />  </h:inputText>
JSF Navegação Navegação de uma página para outra  Simples e poderoso sistema de navegação  O framework seleciona a próxima view baseado:  Na view anterior  Resultado(outcome) de uma action  EL de ação (ex.: #{mBean.user.save})  Qualquer combinação acima Permite wildcard (‘*’) para páginas de origem (from-view-id)
JSF Navegação
JSF Navegação
JSF Eventos Componentes geram determinados eventos  	que por sua vez disparam ações no servidor (método(s) no managed-bean ou listeners)  Você também pode implementar listeners de ação  	associados a outros componentes do formulário  Os listeners mais comuns do JSF são  ActionListener  ValueChangeListener
JSF Action event para navegação : <h:commandButton action=“listar” value=“Listar” />  Action event que executa método no managed-bean  <h:commandLink action=“#{cadastroBean.cadastrar}” value=“Cadastrar” />  Método no managed-bean  public String cadastrar() {  // processa evento  return “listar”; // retorna para view “listar”  }
JSF Value-change event que executa método após alterar o valor do componente  <h:selectOneMenu id=“UF” value=“#{cadastroBean.uf}” valueChangeListener=“#{cadastroBean.carregaCidades}” onchange=“submit();”>  	<f:selectItems value=“#{cadastroBean.ufList}” />  </h:selectOneMenu>
JSF Método no managed-bean  public void carregaCidades(ValueChangeEvent event) {  	// processa evento  	String uf = event.getNewValue(); // obtém novo valor  	this.cidadesList = Servico.carregaCidades(uf);  	// processa evento  }
JSF JSF Request Lifecycle
JSF (Fases) São Atendidas pelo Reader Response e Restore Component Tree Restore Component Tree: O conjunto de componentes JSF é criado ou restaurado dependento da requisição (Primeira ou demais vezes executadas)  
JSF (Fases) Apply request Values: Os componentes irão extrair seu novo valor dos parâmetros da Request, colocando-os em variáveis de estado no servidor
JSF (Fases) Process Validations: todos os validadores serão executados, em caso de erro de qualquer valor, a mensagem é alocada no FacesContext, caso contrário ele atualiza (Update Model Values) os valores dos inputs na camada de negócio através da EL  
JSF (Fases) Invoke Application: Os métodos do ManagedBeans são executados e as regras de navegação (Gravar, Excluir, Alterar,...) são resolvidas. 	Se tudo ocorrer bem é renderizada pelo container do JSP, caso contrário as mensagens gravadas no FacesContext são apresentadas  
JSF (Fases) Caso queira pular as fazer de validação e conversão, basta utilizar o parametro immediate=true <h:commandButton action=“proximo" value=“Proximo" immediate="true"/>  
JSF JSF Extension Points  Customizar componentes  Phase listeners (antes, depois de qualquer fase)  Customizar converters / validators  Customizar renderers  Customizar ActionListenerImpl para manipular  	eventos  Decorar ou substituir view handler, navigation  	handler, state manager etc
JSF faces-config.xml Arquivo XML para configurar recursos da aplicação  Contém regras de navegação, customização e extensão de converters, validators, componentes etc  Geralmente está localizado dentro de /WEB-INF/faces-config.xml  Pode ser dividido em diretórios e sub-diretórios ou dentro de arquivos jar  Seta javax.faces.application.CONFIG_FILES no web.xml  Ou então coloca-se META-INF/faces-config.xml dentro de um jar
JSF faces-config.xml (Resumo) <faces-config ... >  <converter>  	<converter-id>core.faces.CnpfCnpjConverter</converter-id>  	<converter-class>converter.CnpfCnpjConverter</converter-class>  </converter>
JSF faces-config.xml (Resumo) <managed-bean>  	<managed-bean-name>reportBean</managed-bean-name>  	<managed-bean-class>bean.ReportBean</managed-bean-class>  	<managed-bean-scope>request</managed-bean-scope>  </managed-bean>
JSF faces-config.xml (Resumo) <navigation-rule>  	<from-view-id>/jsp/deposito/tiporeq/searchList.jsp</from-view-id>  	<navigation-case>  		<from-outcome>deposito.tiporeq.update</from-outcome>  		<to-view-id>/jsp/deposito/tiporeq/update.jsp</to-view-id>  	</navigation-case>  </navigation-rule>
Componentes JSF (Form) <h:form id="jsftags">  ... </h:form> <form id="jsftags" method="post"     action="/jsftags/faces/pages/tags.jsp"     enctype="application/x-www-form-urlencoded">     ...    <input type="hidden" name="jsftags"     value="jsftags" />    <input type="hidden" name="jsftags:link" /> </form>
Componentes JSF (commandButton) <h:commandButton   id="submit"    value="#{msg.buttonHeader}"    action="nextPage"> </h:commandButton> <input       id="_id0:submit"       type="submit"       name="_id0:submit"      value="Next Step"/>
Componentes JSF (commandLink) <h:commandLink id="link" action="goto">   <h:outputText value="#{msg.linkName}"/> </h:commandLink> <a id="_id0:link“ href="#" onclick= "document.forms['_id0']['_id0:link'].value= '_id0:link';          document.forms['_id0'].submit(); return false;“ >Next Page</a>
Componentes JSF (graphicImage) <h:graphicImage id="image"    alt="jsf-sun“ url="/images/jsf-sun.gif"> </h:graphicImage>   <img id="jsftags:image"  src="/jsf-example/images/jsf-sun.gif"   alt="jsf-sun" />
Componentes JSF (inputText) <h:inputText id="address"   value="#{jsfexample.address}" />   <input type="text" name="jsftags:_id1"   value="123 JSF Ave" />
Componentes JSF (inputText / inputSecret) <h:inputText id="address” value="#{jsfexample.address}" /> <input type="text" name="jsftags:_id1” value="123 JSF Ave" /> <h:inputSecret redisplay="false“  value="#{jsfexample.password}" />   <input id="jsftags:password“   type="password“  name="jsftags:password“  value="secret" />
Componentes JSF (inputHidden /inputTextarea) <h:inputHidden id="hidden“  value="userPreference" />   <input id="jsftags:hidden”  type="hidden“  name="jsftags:hidden"    value="userPreference" /> <h:inputTextarea id="textArea“  rows="4" cols="7“  value="Text goes here.."/> <textarea id="jsftags:textArea“  name="jsftags:textArea“  cols="5" rows="3">     Text goes here.. </textarea>
Componentes JSF (outputText / outputLabel) <h:outputText  value="#{jsfexample.zipCode}"/> 123 <h:outputLabel for="address“>     <h:outputText id="addressLabel“  value="User Home Address"/> </h:outputLabel> <span id="jsftags:addressLabel">   User Home Address</span>
Componentes JSF (outputLink) <h:outputLink  value="#{msg['jsfstudio.home.url']">         <f:verbatim>JSF Studio</f:verbatim> </h:outputLink>   <a href="http://www.jsf-studio.com">  JSF Studio </a>
Componentes JSF (message) <h:message style="color: red“  for="useraddress" />    <h:inputText id="useraddress“  value="#{jsfexample.address}“  required="true"/> <h:commandButton action="save" value="Save"/> <span style="color: red"> Validation Error: Value is required. </span>  	<input id="jsftags:useraddress" type="text" name="jsftags:useraddress" value="" />  <input type="submit" name="jsftags:_id1" value="Save" />  Escrevendo uma mensagem:  FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Usuário já Cadastrado!"));
Componentes JSF (selectBooleanCheckbox) <h:selectBooleanCheckbox  title="emailUpdates“  value="#{jsfexample.wantsEmailUpdates}" > </h:selectBooleanCheckbox> <h:outputText  value="Would you like email updates?"/> <input type="checkbox“  name="jsftags:_id6" checked title="emailUpdates" /> Would you like email updates?
Componentes JSF (selectManyCheckbox) <h:selectManyCheckbox id="cars” value="#{carsBean.car}">   <f:selectItems  value="#{carBean.carList}"/> </h:selectManyCheckbox> span id="jsftags:cars"> <table><tr>  <td><label for="jsftags:cars"> <input name="jsftags:cars“  value="accord" type="checkbox">     Honda Accord</input></label></td>  <td><label for="jsftags:cars“><input name="jsftags:cars“ value="4runner" type="checkbox">     Toyota 4Runner</input> </label></td>  <td><label for="jsftags:cars“><input name="jsftags:cars“ value="nissan-z" type="checkbox">     Nissan Z350</input<</label></td>  </tr></table> </span>
Componentes JSF (selectManyListbox) <h:selectManyListbox  id="cars_selectManyListbox“   value="#{carBean.car}">    <f:selectItems value="#{carBean.carList}"/> </h:selectManyListbox>   <select id="jsftags:cars_selectManyListbox” name="jsftags:cars_selectManyListbox”  multiple size="3">    <option value="accord">Honda Accord</option>    <option value="4runner">Toyota 4Runner</option>    <option value="nissan-z">Nissan Z350</option> </select>
Componentes JSF (selectOneMenu) <h:selectOneMenu id="selectCar“  value="#{carBean.currentCar}">   <f:selectItems value="#{carBean.carList}" /> </h:selectOneMenu>    Honda Accord Toyota 4Runner Nissan Z350  <select id="jsftags:selectCar“ name="jsftags:selectCar" size="1">   <option value="accord">Honda Accord</option>   <option value="4runner">Toyota 4Runner</option>   <option value="nissan-z">Nissan Z350</option> </select>
Componentes JSF (dataTable) <h:dataTable id="books" value="#{BookStore.items}" var="store">      <h:column>     <f:facet name="header“><h:outputText  value="#{msg.storeNameLabel}"/></f:facet>      <h:outputText value="#{store.name}"/>   </h:column>   <h:column>     <f:facet name="header“>Subject</f:facet>      <h:outputText value="#{store.subject}"/>   </h:column>   <h:column>     <f:facet name="header“><h:outputText  value="#{msg.storePriceLabel}"/></f:facet>      <h:outputText value="#{store.price}"/>   </h:column> </h:dataTable>
Componentes JSF (dataTable) <table id="jsftags:books” class="list-background“> <thead>   <tr><th class="list-header” scope="col">Title</th> <th class="list-header” scope="col">Subject</th>    <th class="list-header” scope="col">Price ($)</th>   </tr>  </thead>  <tbody>   <tr class="list-row">    <td class="list-column-center“> JSF For Dummies</td>    <td class="list-column-right“> JSF</td><td class="list-column-center“> 25.0</td>   </tr>   <tr class="list-row">    <td class="list-column-center“> Struts For Dummies</td>    <td class="list-column-right“>Struts</td>    <td class="list-column-center“> 22.95</td>   </tr>  </tbody> </table>
Componentes JSF Atributos importantes: required, immediate, readonly, rendered .....  <h:inputText value="#{numberBean.userNumber}" required="true" validatorMessage="O número tem que ser entre 0 e 100" readonly=“false"  rendered=“true” >  <h:commandButton value="Desistir" action="desistir" immediate="true"/>
Exercício 1   Criar um cadastro de Pessoa.   Criar um bean que represente o formulário (Nome, Endereço, Telefone ) Usar f:view e h:form para os formulários Especificar o Action Controller com o atributo de ação h:commandButton Criar uma Action para inserir os dados do formulário, chame a lógica de negócio, guarde os resultados em uma lista e imprima os valores no console Usar o  faces-config para declarar o form bean e navegação Após inserir, imprimir no console quem foi inserido e enviar para uma página de sucesso com um botão voltar
Exercício 1 (Continuação)   Validação:   Utilizar o h:messages e h:message <h:messages style="color: red"/> Inserir algumas validações nos campos: <h:inputText value="#{user.name}" required="true" requiredMessage="Campo Obrigatorio" validatorMessage="Tamanho inválido"> <f:validateLength maximum="30" minimum="3"/> </h:inputText><br/> Enviar uma mensagem de sucesso após cadastrar o usuário FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Usuário já Cadastrado!"));
Componentes JSF (dataTable)   DataModel   ,[object Object]
Para inserir os objetos no DataModel: dataModel.setWrappedData(Lista)
Para obter os objetos da tabela : dataModel.getWrappedData() ou getRowData(),[object Object]
Criar um link para apagar o registro da tabela,[object Object]
Inserir os tipos (Rua, Quadra, Lote ....)
Criar um método para capturar essa mudança e imprimir no console o valor antigo e o novo,[object Object]
Pedir para o usuário entrar com o número
Se estiver certo, enviar para página de sucesso com opção de sair ou jogar novamente, se estiver errado avisar que está errado e informar se é maior ou menor, o usuário pode desistir, enviando para uma tela confirmação.,[object Object]
Exercício 5 (Opcional)   Criar validadores: ,[object Object]
Validador de email
Validador que não aceite data no passado.,[object Object]

More Related Content

What's hot

MC31 - Desenvolvimento um Aplicativo completo usando JSF, EJB e padrões
MC31 - Desenvolvimento um Aplicativo completo usando JSF, EJB e padrõesMC31 - Desenvolvimento um Aplicativo completo usando JSF, EJB e padrões
MC31 - Desenvolvimento um Aplicativo completo usando JSF, EJB e padrõesRodrigo Cândido da Silva
 
Arquitetura MVC, JavaBeans e DAO
Arquitetura MVC, JavaBeans e DAOArquitetura MVC, JavaBeans e DAO
Arquitetura MVC, JavaBeans e DAOLeonardo Sousa
 
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E JpaDominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E JpaAna Albert
 
Apostila Java Web com JSF, JPA e Primefaces
Apostila Java Web com JSF, JPA e PrimefacesApostila Java Web com JSF, JPA e Primefaces
Apostila Java Web com JSF, JPA e PrimefacesRosicleia Frasson
 
Como escolher o Framework Java para web?
Como escolher o Framework Java para web?Como escolher o Framework Java para web?
Como escolher o Framework Java para web?Anderson Araújo
 
Play Framework - Desenvolvendo Aplicações Web com Java sem Dor
Play Framework - Desenvolvendo Aplicações Web com Java sem DorPlay Framework - Desenvolvendo Aplicações Web com Java sem Dor
Play Framework - Desenvolvendo Aplicações Web com Java sem DorAllyson Barros
 
Apresentação jsf 2.0
Apresentação jsf 2.0Apresentação jsf 2.0
Apresentação jsf 2.0Paulo Neto
 
JSF e outras tecnologias Java Web - IMES.java
JSF e outras tecnologias Java Web - IMES.javaJSF e outras tecnologias Java Web - IMES.java
JSF e outras tecnologias Java Web - IMES.javaEduardo Bregaida
 
Apresentação Java Web - Jsf+Hibernate
Apresentação Java Web - Jsf+HibernateApresentação Java Web - Jsf+Hibernate
Apresentação Java Web - Jsf+HibernateZarathon Maia
 
Dicas e truques sobre performance em JavaEE, JPA e JSF
Dicas e truques sobre performance em JavaEE, JPA e JSFDicas e truques sobre performance em JavaEE, JPA e JSF
Dicas e truques sobre performance em JavaEE, JPA e JSFDr. Spock
 
Construindo aplicações web java com netbeans
Construindo aplicações web java com netbeansConstruindo aplicações web java com netbeans
Construindo aplicações web java com netbeansSliedesharessbarbosa
 
Minicurso Java Server Faces
Minicurso Java Server FacesMinicurso Java Server Faces
Minicurso Java Server FacesJoão Longo
 

What's hot (20)

MC31 - Desenvolvimento um Aplicativo completo usando JSF, EJB e padrões
MC31 - Desenvolvimento um Aplicativo completo usando JSF, EJB e padrõesMC31 - Desenvolvimento um Aplicativo completo usando JSF, EJB e padrões
MC31 - Desenvolvimento um Aplicativo completo usando JSF, EJB e padrões
 
Arquitetura MVC, JavaBeans e DAO
Arquitetura MVC, JavaBeans e DAOArquitetura MVC, JavaBeans e DAO
Arquitetura MVC, JavaBeans e DAO
 
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E JpaDominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
 
JSF - JavaServer Faces
JSF - JavaServer FacesJSF - JavaServer Faces
JSF - JavaServer Faces
 
Aula parte 2 de JSF 2.2
Aula parte 2 de JSF 2.2Aula parte 2 de JSF 2.2
Aula parte 2 de JSF 2.2
 
Apostila Java Web com JSF, JPA e Primefaces
Apostila Java Web com JSF, JPA e PrimefacesApostila Java Web com JSF, JPA e Primefaces
Apostila Java Web com JSF, JPA e Primefaces
 
Como escolher o Framework Java para web?
Como escolher o Framework Java para web?Como escolher o Framework Java para web?
Como escolher o Framework Java para web?
 
Play Framework - Desenvolvendo Aplicações Web com Java sem Dor
Play Framework - Desenvolvendo Aplicações Web com Java sem DorPlay Framework - Desenvolvendo Aplicações Web com Java sem Dor
Play Framework - Desenvolvendo Aplicações Web com Java sem Dor
 
Apresentação jsf 2.0
Apresentação jsf 2.0Apresentação jsf 2.0
Apresentação jsf 2.0
 
JSF e outras tecnologias Java Web - IMES.java
JSF e outras tecnologias Java Web - IMES.javaJSF e outras tecnologias Java Web - IMES.java
JSF e outras tecnologias Java Web - IMES.java
 
Aula parte 1 de JSF 2.2
Aula parte 1 de JSF 2.2Aula parte 1 de JSF 2.2
Aula parte 1 de JSF 2.2
 
Apresentação jsf 1_2
Apresentação jsf 1_2Apresentação jsf 1_2
Apresentação jsf 1_2
 
Framework web 01 - Aula UTFPR 2018
Framework web 01 - Aula UTFPR 2018Framework web 01 - Aula UTFPR 2018
Framework web 01 - Aula UTFPR 2018
 
Apresentação Java Web - Jsf+Hibernate
Apresentação Java Web - Jsf+HibernateApresentação Java Web - Jsf+Hibernate
Apresentação Java Web - Jsf+Hibernate
 
Dicas e truques sobre performance em JavaEE, JPA e JSF
Dicas e truques sobre performance em JavaEE, JPA e JSFDicas e truques sobre performance em JavaEE, JPA e JSF
Dicas e truques sobre performance em JavaEE, JPA e JSF
 
Construindo aplicações web java com netbeans
Construindo aplicações web java com netbeansConstruindo aplicações web java com netbeans
Construindo aplicações web java com netbeans
 
Curso jsf
Curso jsfCurso jsf
Curso jsf
 
Framework web 02 - 2016
Framework web 02 - 2016Framework web 02 - 2016
Framework web 02 - 2016
 
Jsf
JsfJsf
Jsf
 
Minicurso Java Server Faces
Minicurso Java Server FacesMinicurso Java Server Faces
Minicurso Java Server Faces
 

Viewers also liked

Produtividade com JavaServer Faces
Produtividade com JavaServer FacesProdutividade com JavaServer Faces
Produtividade com JavaServer FacesEduardo Bregaida
 
11601快訊新聞五則
11601快訊新聞五則11601快訊新聞五則
11601快訊新聞五則beelinelmn
 
UtilizandoJSF_no_Desenvolvimento_de_aplicacoes_web_by_Thales_Batista_de_Melo
UtilizandoJSF_no_Desenvolvimento_de_aplicacoes_web_by_Thales_Batista_de_MeloUtilizandoJSF_no_Desenvolvimento_de_aplicacoes_web_by_Thales_Batista_de_Melo
UtilizandoJSF_no_Desenvolvimento_de_aplicacoes_web_by_Thales_Batista_de_Melothalesboss
 
Desenvolvimento Web com JSF
Desenvolvimento Web com JSFDesenvolvimento Web com JSF
Desenvolvimento Web com JSFDalton Valadares
 
Caelum java-testes-jsf-web-services-design-patterns-fj22
Caelum java-testes-jsf-web-services-design-patterns-fj22Caelum java-testes-jsf-web-services-design-patterns-fj22
Caelum java-testes-jsf-web-services-design-patterns-fj22Moisés Moura
 
Boas Práticas com JavaServer Faces (Jsf)
Boas Práticas com JavaServer Faces (Jsf)Boas Práticas com JavaServer Faces (Jsf)
Boas Práticas com JavaServer Faces (Jsf)Rafael Ponte
 
Os 10 maus hábitos dos desenvolvedores JSF
Os 10 maus hábitos dos desenvolvedores JSFOs 10 maus hábitos dos desenvolvedores JSF
Os 10 maus hábitos dos desenvolvedores JSFRafael Ponte
 

Viewers also liked (11)

Produtividade com JavaServer Faces
Produtividade com JavaServer FacesProdutividade com JavaServer Faces
Produtividade com JavaServer Faces
 
11601快訊新聞五則
11601快訊新聞五則11601快訊新聞五則
11601快訊新聞五則
 
UtilizandoJSF_no_Desenvolvimento_de_aplicacoes_web_by_Thales_Batista_de_Melo
UtilizandoJSF_no_Desenvolvimento_de_aplicacoes_web_by_Thales_Batista_de_MeloUtilizandoJSF_no_Desenvolvimento_de_aplicacoes_web_by_Thales_Batista_de_Melo
UtilizandoJSF_no_Desenvolvimento_de_aplicacoes_web_by_Thales_Batista_de_Melo
 
Desenvolvimento Web com JSF
Desenvolvimento Web com JSFDesenvolvimento Web com JSF
Desenvolvimento Web com JSF
 
Framework web 3 - JSF + Spring boot
Framework web 3 - JSF + Spring bootFramework web 3 - JSF + Spring boot
Framework web 3 - JSF + Spring boot
 
Apostila jsf
Apostila jsfApostila jsf
Apostila jsf
 
Apostila JSF 2.0 - K19
Apostila JSF 2.0 - K19Apostila JSF 2.0 - K19
Apostila JSF 2.0 - K19
 
Caelum java-testes-jsf-web-services-design-patterns-fj22
Caelum java-testes-jsf-web-services-design-patterns-fj22Caelum java-testes-jsf-web-services-design-patterns-fj22
Caelum java-testes-jsf-web-services-design-patterns-fj22
 
Boas Práticas com JavaServer Faces (Jsf)
Boas Práticas com JavaServer Faces (Jsf)Boas Práticas com JavaServer Faces (Jsf)
Boas Práticas com JavaServer Faces (Jsf)
 
Os 10 maus hábitos dos desenvolvedores JSF
Os 10 maus hábitos dos desenvolvedores JSFOs 10 maus hábitos dos desenvolvedores JSF
Os 10 maus hábitos dos desenvolvedores JSF
 
Teorias de Ensino
Teorias de EnsinoTeorias de Ensino
Teorias de Ensino
 

Similar to Curso jsf

Jsf – Java Sever Faces
Jsf – Java Sever FacesJsf – Java Sever Faces
Jsf – Java Sever Facesbielgott
 
JSF2 ScrumToys SestInfo 2010
JSF2 ScrumToys SestInfo 2010JSF2 ScrumToys SestInfo 2010
JSF2 ScrumToys SestInfo 2010Eder Magalhães
 
Anatomia do JSF – JavaServer Faces
Anatomia do JSF – JavaServer FacesAnatomia do JSF – JavaServer Faces
Anatomia do JSF – JavaServer Facescejug
 
Resenha Crítica Comparativa - Inovando o Desenvolvimento Web com JSF e Design...
Resenha Crítica Comparativa - Inovando o Desenvolvimento Web com JSF e Design...Resenha Crítica Comparativa - Inovando o Desenvolvimento Web com JSF e Design...
Resenha Crítica Comparativa - Inovando o Desenvolvimento Web com JSF e Design...Esdras Da Silva
 
Apresentação Facelets_UNIFEI
Apresentação Facelets_UNIFEIApresentação Facelets_UNIFEI
Apresentação Facelets_UNIFEIFelipe Knappe
 
Padrão Arquitetural MVC e suas aplicações para WEB
Padrão Arquitetural MVC e suas aplicações para WEBPadrão Arquitetural MVC e suas aplicações para WEB
Padrão Arquitetural MVC e suas aplicações para WEBRafael França
 
JSF 2.0 e ScrumToys
JSF 2.0 e ScrumToysJSF 2.0 e ScrumToys
JSF 2.0 e ScrumToysDr. Spock
 
JSP - Java Serves Pages
JSP - Java Serves PagesJSP - Java Serves Pages
JSP - Java Serves PagesAmanda Luz
 
Treinamento ASP.NET 2014
Treinamento ASP.NET 2014Treinamento ASP.NET 2014
Treinamento ASP.NET 2014Eric Gallardo
 
Navegando em um mar de siglas do mundo java
Navegando em um mar de siglas do mundo javaNavegando em um mar de siglas do mundo java
Navegando em um mar de siglas do mundo javaAndrei Tognolo
 
JSF 2.0 e ScrumToys
JSF 2.0 e ScrumToysJSF 2.0 e ScrumToys
JSF 2.0 e ScrumToysDr. Spock
 
Sistema S2DG e Tecnologias Web
Sistema S2DG e Tecnologias WebSistema S2DG e Tecnologias Web
Sistema S2DG e Tecnologias WebElenilson Vieira
 
Java Web Dev Introdução
Java Web Dev IntroduçãoJava Web Dev Introdução
Java Web Dev IntroduçãoMarcio Marinho
 

Similar to Curso jsf (20)

Jsf – Java Sever Faces
Jsf – Java Sever FacesJsf – Java Sever Faces
Jsf – Java Sever Faces
 
JSF2 ScrumToys SestInfo 2010
JSF2 ScrumToys SestInfo 2010JSF2 ScrumToys SestInfo 2010
JSF2 ScrumToys SestInfo 2010
 
JavaServer Faces
JavaServer FacesJavaServer Faces
JavaServer Faces
 
Jheat
JheatJheat
Jheat
 
Anatomia do JSF – JavaServer Faces
Anatomia do JSF – JavaServer FacesAnatomia do JSF – JavaServer Faces
Anatomia do JSF – JavaServer Faces
 
Resenha Crítica Comparativa - Inovando o Desenvolvimento Web com JSF e Design...
Resenha Crítica Comparativa - Inovando o Desenvolvimento Web com JSF e Design...Resenha Crítica Comparativa - Inovando o Desenvolvimento Web com JSF e Design...
Resenha Crítica Comparativa - Inovando o Desenvolvimento Web com JSF e Design...
 
Apresentação Facelets_UNIFEI
Apresentação Facelets_UNIFEIApresentação Facelets_UNIFEI
Apresentação Facelets_UNIFEI
 
Asp net mvc
Asp net mvcAsp net mvc
Asp net mvc
 
Java web
Java webJava web
Java web
 
Padrão Arquitetural MVC e suas aplicações para WEB
Padrão Arquitetural MVC e suas aplicações para WEBPadrão Arquitetural MVC e suas aplicações para WEB
Padrão Arquitetural MVC e suas aplicações para WEB
 
JSF 2.0 e ScrumToys
JSF 2.0 e ScrumToysJSF 2.0 e ScrumToys
JSF 2.0 e ScrumToys
 
JSP - Java Serves Pages
JSP - Java Serves PagesJSP - Java Serves Pages
JSP - Java Serves Pages
 
Treinamento ASP.NET 2014
Treinamento ASP.NET 2014Treinamento ASP.NET 2014
Treinamento ASP.NET 2014
 
Navegando em um mar de siglas do mundo java
Navegando em um mar de siglas do mundo javaNavegando em um mar de siglas do mundo java
Navegando em um mar de siglas do mundo java
 
Tutorial JSF 2.0 (2012)
Tutorial JSF 2.0 (2012)Tutorial JSF 2.0 (2012)
Tutorial JSF 2.0 (2012)
 
JSF 2.0 e ScrumToys
JSF 2.0 e ScrumToysJSF 2.0 e ScrumToys
JSF 2.0 e ScrumToys
 
Sistema S2DG e Tecnologias Web
Sistema S2DG e Tecnologias WebSistema S2DG e Tecnologias Web
Sistema S2DG e Tecnologias Web
 
GUJavaSC - Mini-curso Java EE
GUJavaSC - Mini-curso Java EEGUJavaSC - Mini-curso Java EE
GUJavaSC - Mini-curso Java EE
 
Java Web Dev Introdução
Java Web Dev IntroduçãoJava Web Dev Introdução
Java Web Dev Introdução
 
Minicurso jsf2.0
Minicurso jsf2.0Minicurso jsf2.0
Minicurso jsf2.0
 

More from jornaljava

Por dentro da nuvem
Por dentro da nuvemPor dentro da nuvem
Por dentro da nuvemjornaljava
 
Jornal java por dentro da nuvem
Jornal java por dentro da nuvemJornal java por dentro da nuvem
Jornal java por dentro da nuvemjornaljava
 
Banco de Dados NoSql - JornalJava
Banco de Dados NoSql - JornalJavaBanco de Dados NoSql - JornalJava
Banco de Dados NoSql - JornalJavajornaljava
 
Criando um simples portlet com jboss portal
Criando um simples portlet com jboss portalCriando um simples portlet com jboss portal
Criando um simples portlet com jboss portaljornaljava
 

More from jornaljava (8)

Por dentro da nuvem
Por dentro da nuvemPor dentro da nuvem
Por dentro da nuvem
 
Jornal java por dentro da nuvem
Jornal java por dentro da nuvemJornal java por dentro da nuvem
Jornal java por dentro da nuvem
 
Banco de Dados NoSql - JornalJava
Banco de Dados NoSql - JornalJavaBanco de Dados NoSql - JornalJava
Banco de Dados NoSql - JornalJava
 
Criando um simples portlet com jboss portal
Criando um simples portlet com jboss portalCriando um simples portlet com jboss portal
Criando um simples portlet com jboss portal
 
Jpa
JpaJpa
Jpa
 
J boss seam
J boss seamJ boss seam
J boss seam
 
Facelets
FaceletsFacelets
Facelets
 
Rich faces
Rich facesRich faces
Rich faces
 

Curso jsf

  • 2. Introdução Desenvolvimento Web Aplicações web tornam-se mais e mais importantes Mais e mais complexas: Ajax, validação (server vs. client), efeitos... Exigência mais elevada do cliente durante os anos Interfaces ricas (fáceis de usar) Prazos cada vez mais curtos Desenvolvimento considerado difícil
  • 3. Introdução Surgiram diversos frameworks MVC: Apache Struts WebWork (Struts2) Spring MVC Tapestry JbossSeam E muito outros.. continuam surgindo mais
  • 4. Introdução Problemas Java não nos fornece o bastante para desenvolvermos aplicações web com produtividade Dificuldade para integrar vários frameworks (algumas vezes nem é possível) Falta de padrão para um framework web Ausência de uma API padrão para construir componentes web java  
  • 5. Introdução Um pouco da história   HTML Servlets JSP  
  • 6. Introdução HTML Estático, simples Não tem conexão com Base De Dados Ótimo para criar Home Pages OlaMundo.html <html> <head> <title>Olá Mundo</title> </head> <body> Olá Mundo. </body> </html>  
  • 7. Introdução Servlets   É uma extensão de servidores Disponibiliza uma interface para o servidor Recursos Dinâmicos para web Interage com os clientes Necessita de um Servlet Container (Ex: Tomcat)  
  • 8. Introdução Servlets  import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class HelloWorldServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html"); PrintWriter out = response.getWriter(); out.println("<html><body>Olá Mundo</body></html>"); out.close(); } }
  • 9. Introdução Java Server Pages – JSP   O JSP foi desenvolvido APENAS para mostrar resultados, o SERVLET deveria fazer a ponte com o banco de dados e fazer as regras de negócio Facilitar a criação de HTML Scriplets: colocar código Java no JSP ;-(
  • 10. Introdução OlaMundo.jsp <html> <body> <% String mensagem = "Olá Mundo!"; out.println(mensagem); %> <br> Muito mais simples de editar o html e muito maiscomplicado de editar o codigo Java <br> </body> </html>
  • 11. Introdução Frameworks Frameworks são projetados com a intenção de facilitar o desenvolvimento de software, habilitando designers e programadores a gastarem mais tempo determinando as exigências do software do que com detalhes de baixo nível do sistema Não reinventar a roda
  • 12. Introdução Struts Framework: Action Based   MVC para construções de aplicações WEB Cada solicitação HTTP tem que ser respondida com uma resposta HTTP O .do é mapeado no arquivo struts-config.xml O ActionServlet define o Action correspondente para a solicitação
  • 13. Introdução Struts Framework: Action Based   O ActionServlet coloca a entrada em um JavaBean , estes JavaBeans são definidos como FormBeans O Action pode acessar o FormBean efetuar qualquer operação e armazenar o resultado em um ResultBean O Action interage com a camada de negócio onde uma base de dados poderá ser atualizada
  • 15. Introdução Framework: Component Based Rápido aprendizado Baseado em Componentes Deixa o programador despreocupado com a parte visual Programação Web como Desktop Simplicidade Agilidade
  • 16. Introdução Frameworks Web Component Based Java Server Faces JBossSeam Wicket
  • 17. JSF - Introdução JavaServer Faces é... Uma especificação ? Um framework baseado em componentes ? Interface com o usuário ? Um framework dirigido a eventos ? Padrão de mercado ? RAD ? Um framework MVC ?
  • 18. JSF - Introdução JavaServer Faces é... Uma especificação JSR 127 (JSF 1.0 e JSF 1.1) – 2004 JSF 1.0 – não alcançou o sucesso esperado JSF 1.1 – corrigiu os erros da versão anterior JSR 252 (JSF 1.2) - 2006 (Java EE 5.0) JSF 1.2 – melhor compatibilidade com JSP 2.1 e correção de bugs
  • 19. JSF - Introdução JavaServer Faces é... • JSR 314 (JSF 2.0) • Arquitetura, produtividade, ferramentas RAD, AJAX, melhores componentes UI.. • Em desenvolvimento, porém estão planejando deixar bem integrado e intuitivo.
  • 20. JSF - Introdução JavaServer Faces é... ... um framework baseado em componentes de interface com o usuário JSF é construído sob o conceito de componentes Os componentes são a base para a construção da interface com o usuário Existem componentes padrões equivalentes a quase todas as tags HTML e diversos componentes auxiliares
  • 21. JSF - Introdução JavaServer Faces é... Existem diversas bibliotecas de componentes disponíveis comerciais e open source Os componentes são expressos através de tags em um JSP e posteriormente transformados em HTML
  • 22. JSF - Introdução ... um framework dirigido a eventos Possui um modelo para manipulação de eventos Componentes geram determinados eventos Faz chamada à um método (ação no servidor) O estado da aplicação web muda devido ao evento disparado pelo usuário Um evento pode ser um click em um botão, focar sobre um input ou mesmo alterar o valor de uma combo-box
  • 23. JSF - Introdução ... padrão de mercado É uma especificação (JCP) Java EE 5.0 Suporte de Big Players Sun, Apache, IBM, Oracle, BEA Systems, Borland, ... IDEs (NetBeans, Eclipse, MyEclipse, JDeveloper, ...) Implementações (Sun (R.I), Apache, IBM, ...) Conjuntos de componentes (ADF Faces, Apache MyFaces, WoodStock, IceFaces, JBoss RichFaces, ...)
  • 24. JSF - Introdução .. RAD (Rapid Application Development) 4 camadas: Arquitetura de componentes básica Conjunto de componentes padrão Infra-estrutura da aplicação Ferramenta RAD
  • 25. JSF - Introdução .. RAD (Rapid Application Development) JSF padroniza os primeiros três pontos e permite a criação de ferramentas RAD Utiliza-se IDEs drag-and-drop para construir aplicações Sun Studio Creator, NetBeans, Jdeveloper,Eclipse etc
  • 26. JSF - Introdução ... um framework MVC para construir interfaces com o usuário para aplicações web. JSF inclui: Um conjunto de APIs para: representar os componentes UI e gerenciar o estado destes componentes manipular os eventos e validação de entrada do usuário definir e controlar a navegação entre as páginas dar suporte a internacionalização e acessibilidade
  • 27. JSF - Introdução Resumo É mais do que um framework, é uma especificação baseada em MVC Suporte à internacionalização Facilita criação de telas Facilita a transferência dos dados entre telas e camadas de negócio através da EL Facilidade para criação de componentes
  • 28. JSF - Introdução Resumo Produtividade para conversores recebidos do formulário para os tipos nas classes Flexibilidade para renderização Criar modelos simples de eventos entre interfaces gráficas e as classes no servidor Mecanismos produtivos para validação de campos na tela
  • 29. JSF - Introdução Por que usar JSF? É um padrão de mercado Presente na especificação JEE5.0 e em breve JEE6.0 Suporte de Big Players Fácil de usar e produtivo Fornece separação de funções que envolvem a construção de aplicações Web
  • 30. JSF Por que usar JSF? Alta abstração para desenvolvimento de aplicação web Modelo de programação dirigido a eventos (oposto ao modelo HTTP request/response) Baixa curva de aprendizagem da equipe Vários pontos de extensão (converters, validators, listeners etc) Componentes já prontos!
  • 31. JSF Por que usar JSF? Reusabilidade e estrutura de componentes extensível Acessibilidade (browsers, celulares, pda’s, ...) Segurança OWASP (Open Web Application Security Project) cross-site scripting, session hijacking, execução de métodos, ... Natureza orientada a componentes, validação e pontos de extensão
  • 32. JSF Por que usar JSF? Grande atividade da comunidade em fóruns, listas de discussão, blogs, portais, revistas, livros etc Integração com diversos frameworks: Spring, Spring-Annotation, Spring-Webflow, Hibernate, EJB3, JPA, JBoss Seam, Acegi, JAAS, Struts, Struts2, Shale, Tiles, Facelets, Sitemesh, DWR, EXT, Crank, Beehive-Webflow, GWT, Portlets e muitos outros
  • 33. JSF Por que usar JSF? Testes unitários Shaletesting framework Templates Tiles e Sitemesh Facelets
  • 34. JSF Por que usar JSF? IDEs e WYSIWYG (What you see is what you get) Eclipse (MyEclipse, Europa, Ganymed), IntelliJ IDEA, Jbuilder, NetBeans (Visual WebPack) , IBM Rational App/Web Sun Java Studio Creator , Oracle Jdeveloper, Red Hat Developer Studio (antigo Exadel Studio) e JSFToolbox (Dreamweaver)
  • 35. JSF Por que usar JSF? Grande variedade de componentes comerciais e open- source disponíveis Myfaces Tomahawk Backbase Myfaces Sandbox Simplica (ECruiser Suite) Myfaces Tobago QuipuKit Myfaces Trinidad Blueprints
  • 36. JSF Por que usar JSF? Myfaces Orchestra RCFaces ADF Faces Jenia4Faces IceFaces ZK WoodStock G4JSF (GWT API) JBoss RichFaces Dynamic Faces JBoss Ajax4jsf Crank
  • 37. JSF Conceitos chaves do JSF Componentes Renderers Managed-beans Converters / Validators Navegação Eventos Ciclo de vida (Request Lifecycle)
  • 38. JSF Componentes Separa a lógica de negócio da apresentação Cada view é composta por uma hierarquia de componentes Componentes podem ser adicionados na view programaticamente ou via template (JSP por default, ou Facelets para melhor desempenho e fácil desenvolvimento)
  • 39. JSF Componentes são expressos em tags em uma página JSP e em sua maioria são de interface com o usuário Os componentes padrões são divididos em dois grupos: Faces Core <f:view>, <f:loadBundle>, <f:param> HTML wrappers <h:dataTable>, <h:selectOneMenu> Componente = class + [renderer] + tag handler (JSP)
  • 40. JSF Renderers Responsável por exibir o componente no cliente São agrupados em render kits Render kit padrão é o HTML, mas podemos ter WML, SVG etc. Efetua o encode (gera HTML do componente) Efetua o decode (seta o componente com os dados da URL query string e do formulário)
  • 41. JSF Exemplo: <h:inputText id=“login” size=“16” /> <input type=“text” id=“myForm:login” name=“myForm:login” size=“16” />
  • 43. JSF Managed beans POJO – Plain Old Java Objects
  • 44. JSF Managed beans Podem ser definidos nos escopos de: Application, Session, Request e None É uma classe que envia objetos de negócio para camada de apresentação São registrados no faces-config.xml
  • 45. JSF Managed beans Objetos que sofrerão alterações em seus atributos durante uma requisição, assim como seus métodos podem ser chamados a partir de um command São como as Actions do Struts, porém os form beans são injetados por setters dentro do seu próprio bean Os ManagedBeans serão usados na EL das páginas
  • 47. JSF Obtendo o Managed beans nos escopos: Request: User user = (User)FacesContext.getCurrentInstance().getExternalContext().getRequestMap().get("user"); Session User user = (User)FacesContext.getCurrentInstance().getExternalContext().getSessionMap().get("user"); Inserindo o Managed beans nos escopos: Request: FacesContext.getCurrentInstance().getExternalContext().getRequestMap().put("user", (User)users.getRowData()); Session FacesContext.getCurrentInstance().getExternalContext().getSessionMap().put("user", (User)users.getRowData());
  • 48. JSF JSF Value Binding “Binda” valor do componente ao managed-bean O binding ocorre através de JSF Expression Language (EL) Semelhante a JSTL, porém usa-se ‘#{}’ no lugar de ‘${}’ Pode-se executar métodos no modelo através de expressões Não é processada imediatamente como na JSTL A partir da JSF 1.2 utiliza-se a Unified Expression Language (JSP 2.1) que resolve problemas de incompatibilidade entre a JSF-EL e JSP-EL <h:outputText value="#{pessoa.nome}"/>
  • 49. JSF JSF Value Binding
  • 50. JSF JSF Value Binding
  • 51. JSF Converters Tem por finalidade converter e/ou formatar objetos do tipo Java para String e vice-versa Converters são bi-direcionais Managed-bean faz: getAsObject() JSP faz: getAsString()
  • 52. JSF Converters JSF já fornece converters padrões para date / time, numbers etc Você pode implementar seu próprio converter: Basta implementar a interface javax.faces.convert.Converter Registrar o converter no faces-config.xml O converter pode atuar de forma explícita(id) ou implícita(class) de acordo com a sua configuração no faces-config.xml
  • 53. JSF Converters javax.faces.convert.Converter Converter é registrado dentro faces-config.xml
  • 54. JSF Converter para que toda propriedade do tipo org.com.model.CPF de qualquer bean use este converter <converter> <converter-for-class> org.com.model.CPF </converter-for-class> <converter-class> org.com.faces.CPFConverter </converter-class> </converter>
  • 55. JSF Converter declarado explicitamente: <h:inputText id=“cpf“ value="#{UserRegistration.user.cpf}"> <f:converter converterId=“br.com.CPFConverter“ /> </h:inputText> Ou implicitamente (converter mapeado para objetos do tipo CPF) <h:inputText id=“cpf“ value="#{UserRegistration.user.cpf}"> NADA AQUI ;-) </h:inputText>
  • 56. JSF Converter Padrões do JSF: <h:inputText id="age" value="#{UserRegistration.user.age}"> <f:converter id="javax.faces.Short"/> </h:inputText>
  • 57. JSF Validatores Tem por responsabilidade garantir que o valor informado pelo usuário seja válido Validador trabalha com objetos, não somente com Strings JSF já fornece validadores padrões como required, length, range etc
  • 58. JSF Você pode implementar seu próprio validador Basta implementar a interface javax.faces.validator.Validator Registrar o validador no faces-config.xml Você pode associar um ou mais validadores aum componente
  • 59. JSF javax.faces.validator.Validator Validadores são registrados no faces-config.xml <validator> <validator-id>br.com.validaCPF</validator-id> <validator-class>faces.validaCPF </validator-class> </validator>
  • 60. JSF Validação de obrigatoriedade e comprimento do campo: <h:inputText id=“firstName“ value="#{user.firstName}“ required=“true”> <f:validateLength minimum="2“ maximum="25“ /> </h:inputText>
  • 61. JSF Navegação Navegação de uma página para outra Simples e poderoso sistema de navegação O framework seleciona a próxima view baseado: Na view anterior Resultado(outcome) de uma action EL de ação (ex.: #{mBean.user.save}) Qualquer combinação acima Permite wildcard (‘*’) para páginas de origem (from-view-id)
  • 64. JSF Eventos Componentes geram determinados eventos que por sua vez disparam ações no servidor (método(s) no managed-bean ou listeners) Você também pode implementar listeners de ação associados a outros componentes do formulário Os listeners mais comuns do JSF são ActionListener ValueChangeListener
  • 65. JSF Action event para navegação : <h:commandButton action=“listar” value=“Listar” /> Action event que executa método no managed-bean <h:commandLink action=“#{cadastroBean.cadastrar}” value=“Cadastrar” /> Método no managed-bean public String cadastrar() { // processa evento return “listar”; // retorna para view “listar” }
  • 66. JSF Value-change event que executa método após alterar o valor do componente <h:selectOneMenu id=“UF” value=“#{cadastroBean.uf}” valueChangeListener=“#{cadastroBean.carregaCidades}” onchange=“submit();”> <f:selectItems value=“#{cadastroBean.ufList}” /> </h:selectOneMenu>
  • 67. JSF Método no managed-bean public void carregaCidades(ValueChangeEvent event) { // processa evento String uf = event.getNewValue(); // obtém novo valor this.cidadesList = Servico.carregaCidades(uf); // processa evento }
  • 68. JSF JSF Request Lifecycle
  • 69. JSF (Fases) São Atendidas pelo Reader Response e Restore Component Tree Restore Component Tree: O conjunto de componentes JSF é criado ou restaurado dependento da requisição (Primeira ou demais vezes executadas)  
  • 70. JSF (Fases) Apply request Values: Os componentes irão extrair seu novo valor dos parâmetros da Request, colocando-os em variáveis de estado no servidor
  • 71. JSF (Fases) Process Validations: todos os validadores serão executados, em caso de erro de qualquer valor, a mensagem é alocada no FacesContext, caso contrário ele atualiza (Update Model Values) os valores dos inputs na camada de negócio através da EL  
  • 72. JSF (Fases) Invoke Application: Os métodos do ManagedBeans são executados e as regras de navegação (Gravar, Excluir, Alterar,...) são resolvidas. Se tudo ocorrer bem é renderizada pelo container do JSP, caso contrário as mensagens gravadas no FacesContext são apresentadas  
  • 73. JSF (Fases) Caso queira pular as fazer de validação e conversão, basta utilizar o parametro immediate=true <h:commandButton action=“proximo" value=“Proximo" immediate="true"/>  
  • 74. JSF JSF Extension Points Customizar componentes Phase listeners (antes, depois de qualquer fase) Customizar converters / validators Customizar renderers Customizar ActionListenerImpl para manipular eventos Decorar ou substituir view handler, navigation handler, state manager etc
  • 75. JSF faces-config.xml Arquivo XML para configurar recursos da aplicação Contém regras de navegação, customização e extensão de converters, validators, componentes etc Geralmente está localizado dentro de /WEB-INF/faces-config.xml Pode ser dividido em diretórios e sub-diretórios ou dentro de arquivos jar Seta javax.faces.application.CONFIG_FILES no web.xml Ou então coloca-se META-INF/faces-config.xml dentro de um jar
  • 76. JSF faces-config.xml (Resumo) <faces-config ... > <converter> <converter-id>core.faces.CnpfCnpjConverter</converter-id> <converter-class>converter.CnpfCnpjConverter</converter-class> </converter>
  • 77. JSF faces-config.xml (Resumo) <managed-bean> <managed-bean-name>reportBean</managed-bean-name> <managed-bean-class>bean.ReportBean</managed-bean-class> <managed-bean-scope>request</managed-bean-scope> </managed-bean>
  • 78. JSF faces-config.xml (Resumo) <navigation-rule> <from-view-id>/jsp/deposito/tiporeq/searchList.jsp</from-view-id> <navigation-case> <from-outcome>deposito.tiporeq.update</from-outcome> <to-view-id>/jsp/deposito/tiporeq/update.jsp</to-view-id> </navigation-case> </navigation-rule>
  • 79. Componentes JSF (Form) <h:form id="jsftags"> ... </h:form> <form id="jsftags" method="post" action="/jsftags/faces/pages/tags.jsp" enctype="application/x-www-form-urlencoded"> ... <input type="hidden" name="jsftags" value="jsftags" /> <input type="hidden" name="jsftags:link" /> </form>
  • 80. Componentes JSF (commandButton) <h:commandButton id="submit" value="#{msg.buttonHeader}" action="nextPage"> </h:commandButton> <input id="_id0:submit" type="submit" name="_id0:submit" value="Next Step"/>
  • 81. Componentes JSF (commandLink) <h:commandLink id="link" action="goto"> <h:outputText value="#{msg.linkName}"/> </h:commandLink> <a id="_id0:link“ href="#" onclick= "document.forms['_id0']['_id0:link'].value= '_id0:link'; document.forms['_id0'].submit(); return false;“ >Next Page</a>
  • 82. Componentes JSF (graphicImage) <h:graphicImage id="image" alt="jsf-sun“ url="/images/jsf-sun.gif"> </h:graphicImage>   <img id="jsftags:image" src="/jsf-example/images/jsf-sun.gif" alt="jsf-sun" />
  • 83. Componentes JSF (inputText) <h:inputText id="address" value="#{jsfexample.address}" />   <input type="text" name="jsftags:_id1" value="123 JSF Ave" />
  • 84. Componentes JSF (inputText / inputSecret) <h:inputText id="address” value="#{jsfexample.address}" /> <input type="text" name="jsftags:_id1” value="123 JSF Ave" /> <h:inputSecret redisplay="false“ value="#{jsfexample.password}" />   <input id="jsftags:password“ type="password“ name="jsftags:password“ value="secret" />
  • 85. Componentes JSF (inputHidden /inputTextarea) <h:inputHidden id="hidden“ value="userPreference" />   <input id="jsftags:hidden” type="hidden“ name="jsftags:hidden" value="userPreference" /> <h:inputTextarea id="textArea“ rows="4" cols="7“ value="Text goes here.."/> <textarea id="jsftags:textArea“ name="jsftags:textArea“ cols="5" rows="3"> Text goes here.. </textarea>
  • 86. Componentes JSF (outputText / outputLabel) <h:outputText value="#{jsfexample.zipCode}"/> 123 <h:outputLabel for="address“> <h:outputText id="addressLabel“ value="User Home Address"/> </h:outputLabel> <span id="jsftags:addressLabel"> User Home Address</span>
  • 87. Componentes JSF (outputLink) <h:outputLink value="#{msg['jsfstudio.home.url']"> <f:verbatim>JSF Studio</f:verbatim> </h:outputLink>   <a href="http://www.jsf-studio.com"> JSF Studio </a>
  • 88. Componentes JSF (message) <h:message style="color: red“ for="useraddress" /> <h:inputText id="useraddress“ value="#{jsfexample.address}“ required="true"/> <h:commandButton action="save" value="Save"/> <span style="color: red"> Validation Error: Value is required. </span> <input id="jsftags:useraddress" type="text" name="jsftags:useraddress" value="" /> <input type="submit" name="jsftags:_id1" value="Save" /> Escrevendo uma mensagem: FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Usuário já Cadastrado!"));
  • 89. Componentes JSF (selectBooleanCheckbox) <h:selectBooleanCheckbox title="emailUpdates“ value="#{jsfexample.wantsEmailUpdates}" > </h:selectBooleanCheckbox> <h:outputText value="Would you like email updates?"/> <input type="checkbox“ name="jsftags:_id6" checked title="emailUpdates" /> Would you like email updates?
  • 90. Componentes JSF (selectManyCheckbox) <h:selectManyCheckbox id="cars” value="#{carsBean.car}"> <f:selectItems value="#{carBean.carList}"/> </h:selectManyCheckbox> span id="jsftags:cars"> <table><tr> <td><label for="jsftags:cars"> <input name="jsftags:cars“ value="accord" type="checkbox"> Honda Accord</input></label></td> <td><label for="jsftags:cars“><input name="jsftags:cars“ value="4runner" type="checkbox"> Toyota 4Runner</input> </label></td> <td><label for="jsftags:cars“><input name="jsftags:cars“ value="nissan-z" type="checkbox"> Nissan Z350</input<</label></td> </tr></table> </span>
  • 91. Componentes JSF (selectManyListbox) <h:selectManyListbox id="cars_selectManyListbox“ value="#{carBean.car}"> <f:selectItems value="#{carBean.carList}"/> </h:selectManyListbox>   <select id="jsftags:cars_selectManyListbox” name="jsftags:cars_selectManyListbox” multiple size="3"> <option value="accord">Honda Accord</option> <option value="4runner">Toyota 4Runner</option> <option value="nissan-z">Nissan Z350</option> </select>
  • 92. Componentes JSF (selectOneMenu) <h:selectOneMenu id="selectCar“ value="#{carBean.currentCar}"> <f:selectItems value="#{carBean.carList}" /> </h:selectOneMenu>   Honda Accord Toyota 4Runner Nissan Z350 <select id="jsftags:selectCar“ name="jsftags:selectCar" size="1"> <option value="accord">Honda Accord</option> <option value="4runner">Toyota 4Runner</option> <option value="nissan-z">Nissan Z350</option> </select>
  • 93. Componentes JSF (dataTable) <h:dataTable id="books" value="#{BookStore.items}" var="store"> <h:column> <f:facet name="header“><h:outputText value="#{msg.storeNameLabel}"/></f:facet> <h:outputText value="#{store.name}"/> </h:column> <h:column> <f:facet name="header“>Subject</f:facet> <h:outputText value="#{store.subject}"/> </h:column> <h:column> <f:facet name="header“><h:outputText value="#{msg.storePriceLabel}"/></f:facet> <h:outputText value="#{store.price}"/> </h:column> </h:dataTable>
  • 94. Componentes JSF (dataTable) <table id="jsftags:books” class="list-background“> <thead> <tr><th class="list-header” scope="col">Title</th> <th class="list-header” scope="col">Subject</th> <th class="list-header” scope="col">Price ($)</th> </tr> </thead> <tbody> <tr class="list-row"> <td class="list-column-center“> JSF For Dummies</td> <td class="list-column-right“> JSF</td><td class="list-column-center“> 25.0</td> </tr> <tr class="list-row"> <td class="list-column-center“> Struts For Dummies</td> <td class="list-column-right“>Struts</td> <td class="list-column-center“> 22.95</td> </tr> </tbody> </table>
  • 95. Componentes JSF Atributos importantes: required, immediate, readonly, rendered ..... <h:inputText value="#{numberBean.userNumber}" required="true" validatorMessage="O número tem que ser entre 0 e 100" readonly=“false" rendered=“true” > <h:commandButton value="Desistir" action="desistir" immediate="true"/>
  • 96. Exercício 1   Criar um cadastro de Pessoa.   Criar um bean que represente o formulário (Nome, Endereço, Telefone ) Usar f:view e h:form para os formulários Especificar o Action Controller com o atributo de ação h:commandButton Criar uma Action para inserir os dados do formulário, chame a lógica de negócio, guarde os resultados em uma lista e imprima os valores no console Usar o faces-config para declarar o form bean e navegação Após inserir, imprimir no console quem foi inserido e enviar para uma página de sucesso com um botão voltar
  • 97. Exercício 1 (Continuação)   Validação:   Utilizar o h:messages e h:message <h:messages style="color: red"/> Inserir algumas validações nos campos: <h:inputText value="#{user.name}" required="true" requiredMessage="Campo Obrigatorio" validatorMessage="Tamanho inválido"> <f:validateLength maximum="30" minimum="3"/> </h:inputText><br/> Enviar uma mensagem de sucesso após cadastrar o usuário FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Usuário já Cadastrado!"));
  • 98.
  • 99. Para inserir os objetos no DataModel: dataModel.setWrappedData(Lista)
  • 100.
  • 101.
  • 102. Inserir os tipos (Rua, Quadra, Lote ....)
  • 103.
  • 104. Pedir para o usuário entrar com o número
  • 105.
  • 106.
  • 108.
  • 109.
  • 111.
  • 112.
  • 113. Simplificar a criação de aplicações do tipo CRUD
  • 114. Melhor tratamento de mensagens de erro
  • 115. Mecanismo de tratamento de exceções padrão
  • 116. Criação de aplicações Web sem XML, utilizando anotações
  • 117. Simplificação no desenvolvimento de componentes
  • 118. Especificar onde os artefatos (Conversores, Renderizadores, etc.) devem ser colocados no WAR, permitindo ao container encontrá-los sem a necessidade de sua definição em arquivos de configuração
  • 119.