Anlise e Desenvolvimento de Sistemas

Disciplina:
Prof.(a):
Aula:
Semestre:

Programao Web II
Veronice de Freitas
01 JSF-JavaServer Faces
6

Aula Atividade
Objetivo: introduo ao desenvolvimento web Java usando framework.
Orientaes:
Caro aluno,
Inicialmente faa download e instale os softwares preparando o ambiente para criar os
projetos JSF no incio do texto da atividade coloquei uma tabela contendo os links para
download (no material de apoio (logo aps a tabela) contm vrios tutoriais que auxiliam
na instalao e configurao do ambiente).
Na unidade 01 do livro da disciplina Programao Web II tambm contm orientaes
para instalar os programas (se voc ainda no teve contato com as ferramentas
oriento que siga o padro utilizado na disciplina eclipse e tomCat).
Em relao ao gabarito dos projetos:
Obs: os gabaritos esto passo a passo nos artigos referenciados nas atividades (tambm
esto nas sees aprofundando conhecimento dos captulos 02 e 03 do livro da disciplina
programao Web II. (os arquivos do projeto tambm estaro disponveis no endereo:
https://www.dropbox.com/sh/ozxlcn9925dn0qf/AACrdllTeNnQPo6hdYywsMfda ) se
ainda no teve contato com desenvolvimento Web em Java siga as orientaes para
preparar o ambiente de desenvolvimento usando o Eclipse e TomCat.
Sobre a impresso da atividade:
Imprima somente a parte de introduo relacionada aos conceitos.

Organizao do texto
1 - PREPARANDO O AMBIENTE .........................................................................................2
2 - PROGRAMAO WEB EM JAVA ...................................................................................3
Frameworks Web ...............................................................................................................3
2.1 Java Server Faces .......................................................................................................3
2.2 Implementaes do JSF ..............................................................................................5
2.3 Usando o Java Server Faces .......................................................................................5
2.4 Beans Gerenciados......................................................................................................7
2.5 Converso e Validao ................................................................................................8
2.5. 1 Converso ............................................................................................................8
2.5.2 Validao ...............................................................................................................9
3 - ATIVIDADE ....................................................................................................................10

UNOPAR VIRTUAL (pgina: 1)

Anlise e Desenvolvimento de Sistemas

1 - PREPARANDO O AMBIENTE
Para desenvolver uma aplicao web em Java, ser necessrio as
ferramentas abaixo.
Tabela Sotwares
Software

Disponvel em

SDK Java 1.7 *

http://www.oracle.com/technetwork/java/javase/downloads/index.ht
ml
Eclipse Juno *
http://www.eclipse.org/downloads/packages/release/juno/sr1
Tomcat *
http://tomcat.apache.org/download-70.cgi
Obs: esto
MySQL 5.5
http://dev.mysql.com/downloads/
destacados
Obs: orientaes para instalao (unidade 04)
com * os
JSF 2.1 *
http://javaserverfaces.java.net/
softwares
Obs: orientaes para instalao (unidade 02)
necessrios
Hibernate 3.5
http://www.hibernate.org/)
para a
Obs: orientaes para instalao (unidade 04)
teleaula 01.
Primefaces 3.3.1
http://www.primefaces.org/downloads.html
Obs: orientaes para instalao (unidade 03)
OUTRAS OPES
Netbeans 7.2
(http://netbeans.org/community/releases/72/
Glassfish 3.2
J vem embutido no Netbeans verso JEE
INSTALAO (Vdeo YOUTUBE
Vdeo
https://www.youtube.com/watch?v=RWDyIJm1vu0
Observao: poder usar como forma alternativa para o Eclipse o NetBeans e para o
Tomcat o Glassfish, que j contm embutido a verso JEE).
Material de apoio:

Programao Java para a Web

https://www.novatec.com.br/livros/javaparaweb/capitulo9788575222386.pdf

Tutorial de instalao do Java 7 no Windows 7.

http://www.activeinfo.com.br/tutos/tutorial_instalacao_java_windows.pdf

Tutorial Tomcat - Instalao e Configurao Bsica.

http://www.mhavila.com.br/topicos/java/tomcat.html

Tutorial Configurando o Eclipse ...

http://ges.dc.ufscar.br/graduacao/tutorial_criacao_projeto_web_eclipse.pdf

Curso de Java bsico para iniciantes usando Eclipse:

http://www.java.marcric.com/pages/004-instalandoeclipse.html

UNOPAR VIRTUAL (pgina: 2)

Anlise e Desenvolvimento de Sistemas

No captulo 01 do livro Programao Web II contm orientaes

para preparar o ambiente.

2 - PROGRAMAO WEB EM JAVA

Frameworks Web
Com os avanos tecnolgicos na rea de desenvolvimento de sistemas,
surgiram novas ferramentas e funcionalidades, no caso os frameworks, com a funo de
agilizar o trabalho dos desenvolvedores de softwares. A figura 01 representa um
cronograma com as datas de lanamento de alguns frameworks web. A maioria deles so
frameworks Java, mas alguns outros esto includos.
Figura 01 Lanamento Frameworks Web

Fonte: (RAIBLE 2010)

2.1 Java Server Faces

O JavaServer Faces (JSF) um framework web baseado no padro MVC
(Model-View-Controller) representado na figura 02. Ele mantido pela Java Community
Process JSR-314, que define o padro para desenvolvimento de interfaces dentro do
modelo orientado a componentes.
Figura 02 - O MVC do framework JSF

UNOPAR VIRTUAL (pgina: 3)

Anlise e Desenvolvimento de Sistemas

Fonte: http://www.edsongoncalves.com.br/tag/jsf-2-0/
O padro MVC separa o sistema em trs responsabilidades, onde o
modelo responsvel por representar os objetos de negcio, manter o estado da aplicao
e fornecer ao controlador o acesso aos dados. A visualizao responsvel pela interface
do usurio. ela que define a forma como os dados so apresentados e encaminha as
aes do usurio para o controlador. O controlador responsvel por ligar o modelo e a
visualizao, interpretando as solicitaes do usurio, traduzindo para uma operao no
modelo (onde so realizadas efetivamente as mudanas no sistema) e retornando a
visualizao adequada solicitao.
Em JSF, o controle feito atravs de um servlet chamado Faces Servlet
por arquivos XML de configurao e por vrios manipuladores de aes e observadores de
eventos. O Faces Servlet recebe as requisies dos usurios na web, redireciona para o
modelo e envia uma resposta. Os arquivos de configurao possuem informaes sobre
mapeamentos de aes e regras de navegao. Os manipuladores de eventos so
responsveis por receber os dados da camada de visualizao, acessar o modelo e
devolver o resultado para o usurio atravs do Faces Servlet. A figura 03 representa esse
processo.
Figura 03 - Arquitetura do JavaServer Faces baseada no MVC

Fonte: ALGAWORKS (2013)

UNOPAR VIRTUAL (pgina: 4)

Anlise e Desenvolvimento de Sistemas

O Tomcat um Servlet Container, ou seja, um servidor onde so

instaladas Servlets para tratar as requisies que o servidor receber.

2.2 Implementaes do JSF

JSF

uma

especificao,

portanto

necessrio

escolher

uma

implementao (figura 04). A implementao de referncia da Oracle a Mojarra, mas

existem vrias outras, como: MyFaces, ADF (Application Development Framework). Alm
disso, existem extenses de implementaes, como o Primefaces (entre outros), que altera
o comportamento padro do JSF e possui vrios componentes visuais.
Figura 04 Implementao - JSF

Fonte: CAELUM (2013)

2.3 Usando o Java Server Faces

A especificao do JSF fornece um conjunto de componentes visuais
bsicos em sua implementao de referncia.
Inclui duas bibliotecas de componentes bsicos:
Biblioteca HTML (sigla h): possui componentes que representam
diversos elementos HTML e a biblioteca
Namespace: xmlns:h="http://java.sun.com/jsf/html
Biblioteca Core (sigla f): responsvel por tarefas comuns no
desenvolvimento de sistemas, como internacionalizao, validao e
converso de dados de entrada.
Namespace: xmlns:f="http://java.sun.com/jsf/core

UNOPAR VIRTUAL (pgina: 5)

Anlise e Desenvolvimento de Sistemas

Exemplo:
<?xml version='1.0' encoding='UTF-8' ?>
<!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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html">

namespace

<h:head>
<title>JSF 2.0 Hello World</title>
</h:head>
<h:body>
<h3>JSF 2.0 Hello World Example - hello.xhtml</h3>
<h:form>
<h:inputText value="#{helloBean.name}">
</h:inputText>
<h:commandButton value="Bem Vindo" action="benvindo"></h:commandButton>
</h:form>
</h:body>
</html>

Resultado

Figura 05 Exemplo JSF

O continer Servlet Tomcat 7, por padro, no possui suporte direto
ao JavaServer Faces, ou seja, no contm as bibliotecas necessrias
para o desenvolvimento com o mesmo. Faa download da ltima
verso do jar do JSF. Acesse http://javaserverfaces.java.net/ e
baixe o arquivo javax.faces.-2.1.20.jar. Copie o arquivo para a pasta
WEB-INF/lib do projeto.

UNOPAR VIRTUAL (pgina: 6)

Anlise e Desenvolvimento de Sistemas

Para saber mais

Conhecendo melhor o JavaServer Faces

http://www.edsongoncalves.com.br/tag/jsf-2-0/
JSF Biblioteca HTML e JSF Biblioteca Core
http://blog.fimes.edu.br/fernando/files/2012/05/JavaServer-Faces-%E2%80%93-JSF.pdf
EXADEL. JavaServer Faces HTML Tags Reference. 2013. http://exadel.com/web/portal/jsftagsguide

2.4 Beans Gerenciados

A principal responsabilidade de um managed bean intermediar a comunicao entre as
pginas (componentes do JSF) e o modelo (ser abordado na teleaula 02). Para saber
mais acesse o artigo do Rafael Ponte (http://www.rponte.com.br/2009/08/27/managedbeans-nao-complique-simplifique/)
Os exemplos 01 e 02 utilizam os beans gerenciados do JSF para processar dados do
usurio e ret-los entre as solicitaes.
Exemplo 01:
A a classe Objeto possui duas anotaes:
@ManageBean: Essa anotao indica que essa classe um bean gerenciado;
@ApplicationScopped: Essa anotao indica o escopo do seu objeto em JSF.
TesteBean.java
@ManagedBean(name = "beanObjeto")
@ApplicationScopped:
public class Objeto implements Serializable{
private String atributo;
private String resposta;
public void metodo(){
resposta=Seja Bem vindo.concat(atributo);
}
}
// Getter and Setter

index.xhtml
<h: body>
<h:form>
<h:outputText value=Atributo: />
<h:inputText value=#beanObjeto.atributo} />
<h:comandButton value=Submit action=#beanObjeto.objeto.metodo()} />
<h:outputText value=#beanObjeto.resposta} />
</form>
<h:body>
Fonte: Santana (2012)

Exemplo 02
Pgina JSF (view)

Classe Bean Mapeada

UNOPAR VIRTUAL (pgina: 7)

Anlise e Desenvolvimento de Sistemas

<!DOCTYPE html PUBLIC -//W3C//DTD XHTML @ManagedBean
1.0 Transitional//EN
public class TesteBean {
http://www.w3.org/TR/xhtml1/DTD/xhtml1private int numero;
transitional.dtd>
public void setNumero(int numero) {
<html xmlns=http://www.w3.org/1999/xhtml
this.numero = numero;
xmlns:h=http://java.sun.com/jsf/html>
}
<h:head>
public int getNumero() {
<title>Exemplo JSF</title>
return numero;
Acessa a propriedade
</h:head>
}
<h:body>
public void incrementaNumero() {
numero
this.numero = numero + 1;
Valor: #{testeBean.numero}
}
<h:form>
<h:inputText value="#{testeBean.numero}" />
Altera a propriedade numero
<h:commandButton value="Altera"/>
<h:commandButton value="Incrementa"
testeBean (view) o
action="#{testeBean.incrementaNumero}" />
nome da classe com a
</h:form>
inicial em minsculo
</h:body>
Chama
o
mtodo
incrementaNumero
</html>

Fonte: http://blog.fimes.edu.br/fernando/files/2012/05/JavaServer-Faces-%E2%80%93JSF.pdf
possvel definir o tempo de vida dessa classe Bean atravs das anotaes.
O escopo nada mais do que o tempo de vida e morte do seu objeto, ou seja, quando ele
ser criado e destrudo. Dentre esses escopos esto os apresentados na tabela 02:
Tabela 02: Tempo de vida da classe
Escopo
@ApplicationScoped

Descrio
Apenas uma instncia da classe em toda a aplicao. Todos os
usurios acessam a mesma instncia.
@SessionScoped
Existe uma instncia para cada usurio.
@RequestScoped
Existe uma instncia pelo tempo de durao da requisio feita
pelo usurio.
@NoneScoped
Cada vez que houver uma chamada a uma propriedade ou
mtodo da classe Bean ser criada uma nova instncia
@ViewScoped
Armazena a instncia da classe Bean na pgina exibida.
Enquanto esta estiver sendo manipulada, a mesma instncia da
classe Bean estar disponvel.
@CustomScoped(value=
Armazena a instncia da classe Bean em um java.util.Map
#{meuMap})
declarado.
Fonte: http://blog.fimes.edu.br/fernando/files/2012/05/JavaServer-Faces-%E2%80%93-JSF.pdf

2.5 Converso e Validao

O usurio ao preencher um formulrio em um aplicativo web, est enviando dados ao
servidor. Estes dados no possuem uma tipagem, pois so tratados apenas como texto
puro, conforme especificao do protocolo HTTP. Devido a ausncia de tipagem, os dados
precisam ser convertidos pelo aplicativo para que possam ser tratados de forma especfica.

2.5. 1 Converso
Converso Padro Implcita

UNOPAR VIRTUAL (pgina: 8)

Anlise e Desenvolvimento de Sistemas

Para os tipos fundamentais da linguagem Java o JSF se encarrega de realizar a converso
de maneira implcita, ou seja, no necessrio que o desenvolver faa algo, pois a
converso vai acontecer automaticamente. Os tipos fundamentais do Java so
representados na Tabela 03:
Tabela 03 exemplos converso Implcita
Tipos fundamentais
Exemplos
BigDecimal
BigInteger
Boolean
Byte
Character
Double
Float
Integer
Long
Short

@ManagedBean
public class ManagedBean {
private int idade;
//getters and setters
}
<!-- o valor digitado neste campo ser convertido para inteiro -->
<h:inputText value="#{managedBean.idade}" />

Fonte: Zanotti (2012)

Converso Padro Explcita
Em alguns casos, os conversores padres aplicados implicitamente nos tipos
fundamentais do Java no so suficientes.
Tabela 04 exemplos converso Padro Explcita
Exemplos
f:convertNumber

f:convertDateTime

<h:outputText value="#{managedBean.valor}" >

<f:convertNumber minFractionDigits="2" />
</h:outputText>
<h:outputText value="#{managedBean.date}">
<f:convertDateTime pattern="dd/MM/yyyy" />
</h:outputText>

Fonte: Zanotti (2012)

2.5.2 Validao
Na maioria dos casos apenas uma converso no o suficiente para verificar se uma
informao digitada pelo usurio valida. Por exemplo, dizer que um campo requerido
ou que no esto no intervalo definido para o campo. Segue alguns exemplos:
A validao mais comum de todas a de verificar se um determinado campo no deixou
de ser preenchido. Podemos aplicar essa validao utilizando o atributo required (campo
obrigatrio) dos inputs.
<h:inputText value="#{managedbean.idade}" id="inputIdade" required="true"/>

O validador f:validateLongRange utilizado para verificar se um valor numrico inteiro

pertence a um determinado intervalo de nmeros.
<h:inputText value="#{managedbean.idade}" id="inputIdade">
<f:validateLongRange minimum="1" maximum="130" />
</h:inputText>

Bean Validation
Uma nova abordagem para definir validaes adicionadas no JSF2 foi o Bean Validation.
A ideia declarar as regras de validao nas classes de modelo ao invs de inseri-las nas
UNOPAR VIRTUAL (pgina: 9)

Anlise e Desenvolvimento de Sistemas

telas. A grande vantagem das validaes definidas nas classes de modelo que elas
podem ser utilizadas em diversas partes da aplicao.
public class Funcionario {
@NotNull
private String nome;
...
}

Onde:

@NotNull: o valor no pode ser nulo.

@Min: define um valor mnimo.
@Max: define um valor mximo.
@Size: define um valor mnimo e mximo.
@Pattern: aplica uma expresso regular na validao.

Tambm podemos adicionar uma mensagem de erro atravs da validao:

@NotNull(message="O nome no pode ser nulo")

Para saber mais

Aula 7: Converso e Validao
http://www.codigosfontes.com.br/jsf-conversao-e-validacao/
Introduo para JSF 2.0
http://otaviosantana.blogspot.com.br/2012/07/introducao-para-jsf-20.html

3 - ATIVIDADE
O cdigo do projeto ser disponibilizado no frum.
Para tese (eclipse) poder copiar o projeto para a pasta workspace
(exemplo: usurios veronice workspace (e no eclipse use a opo
arquivo / import)).
No link do autor tem uma opo para download do projeto no netbeans.
Observao: os artigos tambm esto nas sees aprofundando
conhecimento do livro Programao Web II Unidade 02 e Unidade
03.
ATIVIDADE 01:
Crie o projeto abaixo (como sugesto use o eclipse / tomcat) no artigo foi utilizado o
NetBeans.
Autor: Thiago Marques
Fonte: http://thiagom.wordpress.com/2011/01/26/199/
Primeira aplicao em JSF 2.0

UNOPAR VIRTUAL (pgina: 10)

Anlise e Desenvolvimento de Sistemas

Faa teste
somente com os
campos do
formulrio

ATIVIDADE 02:
Aps criar cadastro, agora nessa atividade ser apresentado os dados inseridos na lista de
pessoas, para isso ser utilizado um dataTable.

Veja os cdigos
no artigo

Referncias
ALGAWORKS. DWJSF desenvolvimento web com javaserver faces. 2010. Disponvel
em: < http://www.algaworks.com/downloads/apostilas/algaworks-dwjsf-desenvolvimentoweb-com-javaserver-faces-2a-edicao.pdf >. Acesso em: 5 abr. 2013.
CAELUM. Especificao e implementao do JSF. Disponvel em. <
http://www.caelum.com.br/apostila-java-testes-jsf-web-services-design-patterns/introducaoao-jsf-e-primefaces/#7-5-especificacao-e-implementacao-do-jsf>. Acesso em 28/09/2013.
JQUERY. Disponvel em <http://jqueryui.com/themeroller/>. Acesso em: 5 abr. 2013.
PRIMEFACES. Disponvel em <http://www.primefaces.org/themes.html>. Acesso em: 5
abr. 2013.
Raible, Matt. My Future of Web Frameworks Presentation. 2010. Disponvel em <
http://java.dzone.com/articles/my-future-web-frameworks>. Acesso em 28/09/2013.
SANTANA, Otvio. Desenvolvimento com solues livres. 2012. Disponvel em:
<http://otaviosantana.blogspot.com.br/2012/07/introducao-para-jsf-20.html>. Acesso em: 5
abr. 2013.

UNOPAR VIRTUAL (pgina: 11)

Anlise e Desenvolvimento de Sistemas

ZANOTTI, Emerson. Aula 7: converso e validao. 2012. Disponvel em:
<http://www.codigosfontes.com.br/jsf-conversao-e-validacao/>. Acesso em: 5 abr. 2013.

Material de apoio:
DEVMEDIA. Persistindo objetos com Java, hibernate e postgreSQL. 2013. Disponvel
em: <http://www.devmedia.com.br/ persistindo-objetos-com-java-hibernate-epostgresql/4149>. Acesso em: 15 fev. 2013.
GUJ - Grupo de Usurios Java. Disponvel em: <http://www.guj.com.br>. Acesso em: 5 abr.
2013.
JAVA SEM CAF. JPA 2.0: criando tabelas - parte 1. Disponvel em:
<http://javasemcafe.blogspot.com.br/2011/02/jpa-20-criando-tabelas-parte-1.html>. Acesso
em: 5 abr. 2013.
JAVA SEM CAF. JPA 2.0: criando tabelas - parte 2. Disponvel em:
<http://javasemcafe.blogspot.com.br/2011/03/jpa-20-criando-tabelas-parte-2.html>. Acesso
em: 5 abr. 2013.
JAVA SEM CAF. JPA 2.0: criando tabelas - parte 3. Disponvel em:
<http://javasemcafe.blogspot.com.br/2011/03/jpa-20-criando-tabelas-parte-3.html>. Acesso
em: 5 abr. 2013.
JAVA SEM CAF. JPA 2.0: gerar classes a partir do banco com o Netbeans. Disponvel
em: <http://javasemcafe.blogspot.com.br/2011/03/jpa-20-gerar-classes-partir-dobanco.html>. Acesso em: 5 abr. 2013.
JAVA SEM CAF. JPA 2.0: Java Persistence API. Disponvel em:
<http://javasemcafe.blogspot.com.br/2011/02/jpa-20-java-persistence-api.html>. Acesso
em: 5 abr. 2013.
KING, Gavin et al. Hibernate persistncia relacional para Java idiomtico:
documentao de referncia hibernate. Disponvel em
<http://docs.jboss.org/hibernate/core/3.5/reference/pt-BR/pdf/hibernate_reference.pdf>.
Acesso em: 5 abr. 2013.
PROGRAMANDOJAVA. CRUD JSF 2 + JPA 2 parte 1. Disponvel em:
<http://programandojava.wordpress.com/2012/05/31/crud-parte1/ >.Acesso em: 5 abr.
2013.
PROGRAMANDOJAVA. CRUD JSF 2 + JPA 2 parte 2. Disponvel em:
<http://programandojava.wordpress.com/2012/06/06/crud-parte2/>. Acesso em: 5 abr.
2013.
PROGRAMANDOJAVA. CRUD JSF 2 + JPA 2 parte 3. Disponvel em:
<http://programandojava.wordpress.com/2012/06/12/crud-parte3/>.Acesso em: 5 abr. 2013.
PROGRAMANDOJAVA. CRUD JSF 2 + JPA 2 parte 4. Disponvel em:
<http://programandojava.wordpress.com/2012/06/13/crud-parte-4-final/>. Acesso em: 5 abr.
2013.
UNOPAR VIRTUAL (pgina: 12)

Anlise e Desenvolvimento de Sistemas

PROGRAMANDOJAVA. CRUD JSF 2 + JPA 2 Segurana com Spring security 3.
Disponvel em: <http://programandojava.wordpress.com/2012/07/09/seguranca-springsecurity-3/>. Acesso em: 5 abr. 2013.
TUTORIAL Configurando o Eclipse para criar novos projetos Web usando os frameworks
Hibernate e JSF com banco de dados MySQL. Disponvel em:
<http://ges.dc.ufscar.br/graduacao/tutorial_criacao_projeto_web_eclipse.pdf >. Acesso em:
5 abr. 2013.
Observaes:
Caro Aluno,
Pea para o tutor de sala enviar suas dvidas pelo Chat Atividade para que o professor
possa esclarec-las.

UNOPAR VIRTUAL (pgina: 13)