Framework web 3 - JSF + Spring boot

1. Frameworks para
Desenvolvimento web em
Java
Aula 03
André Luiz Forchesatto

2. Planejamento
● Aula 03
○ Spring com JSF

3. JSF
● API Java Server Faces;
● Interface padrão de desenvolvimento web Java;
● Modelo de interfaces baseada em eventos e
componentes;
● Framework MVC (Model-View-Controller);

4. Estrutura JSF

5. Conceitos Principais JSF
● Componentes
● Renderers
● Managed-Beans
● Ciclo de vida (Request Lifecycle)
● Converter/Validators
● Navegação
● Eventos

6. Componentes
● Separa lógica de negócio da apresentação;
● Toda view possui uma hierarquia de
componentes;
Server Side
Client Side h:form
h:input h:input h:input

7. Componentes
● Os componentes são expressos em tags e uma pagina
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:dataTabe>, <h:inputText>
● Componente = class + renderer + tag handler (JSP)

8. Primeiros passos
● Criar um projeto web que seja um .
war
● Adicionar a lib para jsf
● Configurar o web.xml
● Criar um arquivo faces-config.xml
● Criar uma página de index

9. Configurar faces-config.xml
Criar arquivo faces-config.xml

10. Configurar faces-config.xml
<?xml version="1.0" encoding="UTF-8"?>
<faces-config xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.
org/xml/ns/javaee/web-facesconfig_2_2.xsd"version="2.2">
</faces-config>

11. Página index

12. HTML wrappers - JSF
● Comando
○ h:commandButton: Botão de submissão
de formulário
○ h:commandLink: Link com ação
● Dados
○ h:dataTable: Tabela associada a dados
● Imagens
○ h:graphicImage: Uma imagem

13. HTML wrappers - JSF
● Mensagens
○ h:message: mensagens para um componente
especifico
○ h:messages: mensagens globais da página
● Entrada de dados
○ h:inputHidden: Campo oculto
○ h:inputText: Campo simples para entrada de dados
○ h:inputSecret: Campo para senha
○ h:inputTextArea: Campo texto para entrada de
dados
● Seleção verdadeiro ou falso
○ h:selectBooleanCheckbox: Campo de marcação
verdadeiro ou falso

14. HTML wrappers - JSF
● Saída de dados
○ h:outputFormat: Texto formatado
○ h:outputLabel: Rotulo de campo
○ h:outputLink: Link sem ação
○ h:outputText: Texto simples
● Painel
○ h:panelGrid: Tabela para campos
○ h:panelGroup: Agrupador de
componentes para aplicar formatação ou
alimentamento

15. HTML wrappers - JSF
● Seleção única
○ h:SelectOneRadio: grupo de botões de radio
○ h:SelectOneListbox: lista de seleção única
○ h:SelectOneMenu: combobox de seleção única
● Seleção múltipla
○ h:SelectManyCheckbox: checkboxes agrupados
○ h:SelectManyListbox: lista de seleção múltipla
○ h:SelectManyMenu: lista de seleção múltipla

16. Faces Core
● f:view: Elemento raiz da árvore de
componentes
● f:ajax: Injeta comportamento ajax em
qualquer componente html
● f:selectItem: Representa um item de uma
lista ou combo
● f:selectItems: Representa a coleção de itens
de uma lista ou combo
● f:converter: Converto objeto java em texto e
vice-versa

17. Propriedades comuns
Propriedade Tipo Valor Default Obrigatório
id String Não tem sim
value Object Não tem sim
rendered Boolean True não
converter Converter Não tem não
sytleClass String Não tem não
binding String Não tem não

18. Todos componentes + exemplos
● Links com documentação para API Padrão JSF
● http://docs.oracle.com/javaee/7/tutorial/doc/jsf-intro.htm#BNAPH
● https://javaserverfaces.java.net/nonav/docs/2.2/javadocs/index.html
● http://www.jsftoolbox.com/documentation/help/12-
TagReference/core/index.jsf

19. Renderers
● Responsável por exibir o componente no
cliente
● Efetua enconde de HTML e decode em
String do form enviado

20. Configurar JSF + Spring-boot
● Criar arquivo faces-config.xml
● Criar web.xml
● Criar bean no Main para configurar
FacesServlet
● Adicionar dependências do JSF

21. Configurar JSF + Spring-boot
● Configurar faces-config.xml
<application>
<el-resolver>
org.springframework.web.jsf.el.SpringBeanFacesELResolver
</el-resolver>
</application>

22. Configurar JSF + Spring-boot
● Criar web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.1" xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd">
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.jsf</url-pattern>
</servlet-mapping>
</web-app>

23. Configurar JSF + Spring-boot
● Configurar bean do Spring na classe Main

24. Configurar JSF + Spring-boot
● Adicionar dependências
https://github.com/forchesatto/estudo-spring/
blob/master/spring-boot-jsf/pom.xml

25. Prática
● Fazer o uso de alguns componentes
estudados

26. Managed Beans
● POJO (Plain Old Java Objects)

27. Managed Beans
● Classe POJO com uma anotação
@ManagedBean
● Não esquecer dos get e set para os
atributos;

28. JSF Value Binding
● Vincular valores do componente ao
Managed-bean;
● A vinculação é feita através de EL
(Expression Language)
● Sintaxe: #{ }
● Pode executar métodos ou acessar
atributos;
● Pode ser criado comandos condicionais;

29. JSF Value Binding

30. Prática
● Integração página xhtml com ManagedBean

31. Managed Beans - Escopo
● Request: @RequestScoped;
○ Novos dados a cada requisição;
● Session: @SessionScoped;
○ Criada uma sessão para o usuário dados finalizados
só quando a sessão for encerrada;
● Application: @ApplicationScoped;
○ Dados compartilhados por todos os usuários;
● View: @ViewScoped;
○ Dados presentes enquanto estiver na mesma
página
● Flow: @FlowScoped
○ Dados podem ser passado de página por página
como um wizard

32. Managed Beans - Init, Destroy
● Interagindo na construção e destruição dos
ManagedBeans
● @PostConstruct
○ É executado logo após a construção do MB
○ Sempre deve ser adicionado logo acima de
um método
● @PreDestroy
○ É executado pouco antes do MB sair do
contêiner
○ Sempre deve ser adicionado logo acima de
um método

33. Face Messages
● Classe do JSF responsável por enviar
mensagens ao componente <h:message> da
página JSF.
1 - Contexto web;
2 - Objeto de mensagem onde podemos indicar a Severidade da
mensagem, o resumo e os detalhes;
3 - Adiciona a mensagem no contexto, para um id especifico ou para null.

34. JSF + Spring
● Trocar a anotação @ManagedBean por
@Controller
● Trocar a anotação de escopo por da spring
@Scope

35. Prática
● Entendendo o comportamento dos escopos
e mensagens