8/9/2019 Primeira App Jsf
1/23
http://www.guj.com.br
Minha primeira aplicao utilizando Java Server Faces +
Glassfish
Este tutorial apresenta de forma simples, como iniciar no desenvolvimento com o framework Java Serverfaces 1.2, utilizando-se o servidor glassfish como servidor de aplicao e a IDE eclipse.
Requisitos deste tutorial:
Conhecer o bsico sobre projetos Java EE (Projetos Web, Servlets, JSP).Introduo
Ns desenvolvedores de software, estamos assistindo a rpida evoluo da internet e seus sites. Quem selembra dos CGI e logo depois os Servlets /JSPs, Struts e agora o Java Server Faces que tem disponibilizado aodesenvolvedor uma forma de desenvolver uma aplicao web 2 que prov interao do usurio s aplicaes. Ofato que cada vez mais as aplicaes web fornecem interao ao usurio, e, para prover padres de mercado ede desenvolvimento surgiu o framework Java Server Faces.
O que o Java Server Faces?
O Java Server Faces um framework MVC que prov componentes UI, mecanismos de aes, validadorese toda a estrutura necessria para que seja criada uma aplicao Web complexa.
Por que utilizar o Java Server Faces?
O framework Java Server Faces foi desenvolvido na tecnologia Java e utiliza-se dos padres de projetosatuais, alm de possuir uma poderosa arquitetura para o desenvolvimento de aplicaes de grande porte com
qualidade, e fornece recursos e componentes web 2 tornando assim possvel a criao de produtos interativos.Evoluo do frameworkComo sabemos, uma mudana radical no surge da noite para o dia, e com o Java Server Faces no seria
diferente. As primeiras verses das especificaes do Java Server Faces possuam muitos bugs, mas j dava parater uma viso do potencial que o framework disponibilizaria para o desenvolvimento de aplicaes JEE.
Foram tantas as marteladas no dedo, horas na frente do computador buscando uma soluo para problemasque pareciam to simples. Mas Hoje, podemos dizer que temos uma boa verso do framework, e que podemossim desenvolver com produtividade uma aplicao que rode 24x7 com compatibilidade entre navegadores eservidores de aplicao.
Objetivo
Para mostrar que possvel e introduzir esta tecnologia aos desenvolvedores que esto curiosos paraconhec-la, iremos desenvolver uma aplicao de login.
Requisitos
Para desenvolvermos a aplicao deste tutorial, devemos realizar o download da Api JBoss RichFaces, oGlassfish o Eclipse Ganymede.
Richfaces:http://www.jboss.org/jbossrichfaces/downloads/ Eclipse:
8/9/2019 Primeira App Jsf
2/23
http://www.guj.com.br
http://www.eclipse.org/downloads/Commons Beanutils, Collections, Logging e Digesterhttp://commons.apache.orgGlassfish:https://glassfish.dev.java.net/
Obs: Para realizar a instalao do glassfish necessrio que o apache ant esteja instalado na mquina.
Segue abaixo o link do tutorial de como instalar o servidor de aplicao do glassfish(Em Ingls):
http://blogs.sun.com/bharath/entry/glassfish_installation_process_the_beginner
Mos na Massa
Nossa aplicao utilizar a API richfaces, que prov componentes UI ao framework JSF e neste projeto,ser realizado o armazenamento dos dados, porm na memria voltil e no em um banco de dados.
IncioAps configurar o seu eclipse com o glassfish e o Java 5, iremos iniciar o nosso Projeto.Obs: O glassfish j acompanha a implementao da Sun do Java Server Faces, portanto no ser
necessrio o download do pacote no site da Sun.
Instalando o suporte ao glassfish ao Eclipse
Primeiro ser preciso instalar o suporte ao servidor Glassfish ao eclipse, pois por default na distribuio doeclipse, ele no vem com o suporte.
8/9/2019 Primeira App Jsf
3/23
http://www.guj.com.br
ACESSAR O MENU WINDOW -> PREFERENCES DO ECLIPSENO ITEM SERVER > RUNTIME ENVIORNMENTS SELECIONAR O BOTO ADD
8/9/2019 Primeira App Jsf
4/23
http://www.guj.com.br
SELECIONAR A OPO DOWNLOAD ADDITIONAL SERVER ADAPTERS
8/9/2019 Primeira App Jsf
5/23
http://www.guj.com.br
O SISTEMA IR CARREGAR A CONFIGURAO DO SERVIDOR GLASSFISH. SELECIONLA ESEGUIR OS PASSOS DO BOTO NEXT.
SER NECESSRIA A REINICIALIZAO DO ECLIPSE.
8/9/2019 Primeira App Jsf
6/23
http://www.guj.com.br
INICIANDO O PROJETO
Agora iremos criar o nosso projeto web onde utilizaremos o framework do java server faces. Comodito anteriormente o servidor glassfish j possui uma bilbioteca com a implementao do Java Serverfaces, e para que estas bibliotecas sejam inclusas na aplicao, precisaremos configurar a aplicaocom a faceta do projeto, basta seguir os passos a seguir:
SELECIONAR O MENU FILE > NEW > OTHER > WEB > DYNAMIC WEB PROJECT
8/9/2019 Primeira App Jsf
7/23
http://www.guj.com.br
Configurar o seu projeto com o nome de ssWeb, configurar um runtime do Glassfish v2 (verso quevoc fez o download), mdulo da web 2.5 e configurao de faceta do Java Server faces 1.2.
8/9/2019 Primeira App Jsf
8/23
http://www.guj.com.br
8/9/2019 Primeira App Jsf
9/23
http://www.guj.com.br
8/9/2019 Primeira App Jsf
10/23
http://www.guj.com.br
Selecionar o radio Server Supplied Java Server Faces implementation, o que far com que o projetoutilize a biblioteca padro do servidor glassfish.
Aps tudo configurado corretamente, clicar em finish.
O segundo passo incluir as bilbiotecas do richfaces e configurar os arquivos xml de configurao doJava Server Faces para fazer a utilizao de suas bibliotecas.
Aps descompactar o zip de distribuio do richfaces, copiar os arquivos jar richfacesapi3.2.2.GA.jar, richfacesimpl3.2.2.GA.jare e richfacesui3.2.2.GA.jar contidos na pasta lib para apasta lib do seu projeto.
Inclua tambm os jars do apache commons (logging, collections, beanutils e digester)
8/9/2019 Primeira App Jsf
11/23
http://www.guj.com.br
8/9/2019 Primeira App Jsf
12/23
http://www.guj.com.br
Colar na pasta lib de seu projeto.
Em seguida voc dever alterar o arquivo web.xml , incluindo as seguintes linhas:
org.richfaces.SKINblueSkyRichFaces Filterrichfacesorg.ajax4jsf.Filterrichfaces
Faces ServletREQUESTFORWARDINCLUDE
8/9/2019 Primeira App Jsf
13/23
http://www.guj.com.br
Criando a Pgina de Login
O prximo passo criar nossa primeira pgina utilizando o richfaces, para isso, devo introduzir aestrutura bsica dos documentos jsp do Java Server faces.
No seu projeto criar o documento ndex.jsp e colocar o seguinte contedo dentro dos arquivo:
Solicitao de Servio Web
8/9/2019 Primeira App Jsf
14/23
http://www.guj.com.br
1.Taglibs:a. As duas primeiras linhas, so as taglibs obrigatrias do framework Java Server faces,
elas contm as estruturas bsicas para se trabalhar com os componentes do JSF.i.A taglib core referente as funcionalidades do framework JSF como validao,
converso e manipulao de eventos.ii.A taglib HTML referente aos componentes HTML (botes, tabelas, campos de
texto, etc).b. A terceira e quarta linha so as taglibs do richfaces, que contm os componentes e
estruturas bsicas para se trabalhar com os componentes e ajax.i.A taglib rich referente aos componentes UI ricos, como abas, painis,
menus, etc..ii.A taglib Ajax referente s funcionalidades do Ajax4JSf para se trabalhar com
chamadas Ajax.2.A tag f:view Esta tag obrigatria no documento JSF ela indica o incio e o fim do documento
JSF. o nvel mais alto de tags do JSF.
Criar tambm o arquivo painel.jsp e colocar o seguinte contedo dentro do arquivo:
Solicitao de Servio Web
No existem itens a serem exibidos.
No existem itens a serem exibidos.
8/9/2019 Primeira App Jsf
15/23
http://www.guj.com.br
O objetivo deste tutorial no abordar todos os componentes do richfaces, mas introduzir osconceitos bsicos para que o desenvolvedor atravs das documentaes consiga desenvolveraplicaes utilizando todos os componentes disponveis.
Utilizando o primeiro componente
Aps criarmos nossa estrutura bsica iremos adicionar um painel do richfaces nossa aplicao. Estepainel ser referente ao agrupamento dos campos de login:
8/9/2019 Primeira App Jsf
16/23
http://www.guj.com.br
Solicitao de Servio Web
Explicao das tags:
H:form esta tag produz um formulrio do JSF
Rich:panel A tag rich:panel inclui um painel do richfaces na tela. Todo o seu contedo deve ficaraninhado dentro de sua tag.
F:facet name=header: Esta tag indica que estamos configurando o header de nosso painel
8/9/2019 Primeira App Jsf
17/23
http://www.guj.com.br
H:outputtext Esta tag produz um label nos padres do skin utilizado
H: panelgrid Esta tag produz uma tabela orientada a colunnas. O atributo columns indica aquantidade de colunas que a tabela possuir, a cada 2 tags column uma nova linha criada.
H: column: A tag column produz uma coluna dentro do panel grid
h:inputText A tag h:input text produz um campo de entrada de texto, a seguir, veremos comoassociar este campo com os atributos do backbean.
H: commandButton: esta tag produz um boto de ao para enviar o formulrio
Resultado:
Associando um Bean Tela
8/9/2019 Primeira App Jsf
18/23
http://www.guj.com.br
O prximo passo criar a camada controller da nossa aplicao de login. O JSF utiliza um modelodiferente dos servlets, struts. Para entendermos melhor estes mecanismos vamos falar sobre o ciclode vida do JSF. Segue abaixo a imagem do ciclo de vida do JSF.
O ciclo iniciase quando o usurio faz uma requisio.
Restaurar a view Esta fase iniciada quando o usurio faz uma requisio. Nesta fase, a pgina iniciada, os validadores e manipuladores de eventos so
invocados e a view salva no FacesContext.**O FacesContext contm toda informao do estado da pgina, necessria para manipular os
componentes GUI para a requisio atual.
Fase: Atualizar valores do modelo Aps confirmar que os dados so vlidos na fase anterior, os valores dos
backing beans so atualizados/armazenados. Caso os dados no sejam
compatveis, o fluxo do ciclo de vida segue para a etapa de exibir a resposta.
Fase: Invocar a fase da aplicao
8/9/2019 Primeira App Jsf
19/23
http://www.guj.com.br
Antes desta fase, os componentes foram convertidos, validados, earmazenados nos beans ento agora, voc pode utilizar estes dados paraexecutar a regra de negcio da aplicao. Aps executar suas regras denegcio, a aplicao pode direcionar para uma pgina contida na regra denavegao do faces config.
Faser: Renderizar a resposta Nesta fase a resposta renderizada ao cliente e os componentes so
exibidos em seus estados atuais.
As classes referentes camada controller no Java Server Faces so comumente chamadas de back
beans(Actions no Struts).
O prximo passo ser criar um back bean e associlo ao nosso formulrio de login, para istocriaremos o pacote ssweb.bean. Crie um bean Java simples com o nome de LoginBean.
package ssweb.bean;
publicclass LoginBean {
private String login;
private String senha;
/***MtodoresponsvelporexecutaraaodeLogin
*@returnStringcontendooforward
*/
public String executarLogin() {
if(login.equals("admin") && senha.equals("123")) {
return"sucesso";
}
return"falha";
}
public String getLogin() {
returnlogin;
}
publicvoid setLogin(String login) {
this.login = login;
8/9/2019 Primeira App Jsf
20/23
http://www.guj.com.br
}public String getSenha() {
returnsenha;
}
publicvoid setSenha(String senha) {
this.senha = senha;
}
}
Aps criarmos o nosso bean, ser necessrio configurar o arquivo facesconfig.xml. O eclipse provum editor do facesconfig, para abrilo basta dar um duplo clique no arquivo em sua rvore denavegao.
Aps o editor do Arquivo de Configurao do JSF estiver aberto, selecione a aba ManagedBean. Eadicione um novo managed bean utilizandose o escopo de request. Utilize o nome loginBean.
8/9/2019 Primeira App Jsf
21/23
http://www.guj.com.br
Aps criado o bean, ser necessria a criao da regra de navegao que direcionar o usurioo doformulrio de login para a tela do painel, caso o usurio e senha estejam corretos.
Para criar esta configurao, selecione no editor do Arquivo de Configurao do JSF a aba source einclua no arquivo a seguinte configurao:
/index.jsp
sucesso
/painel.jsp
falha
/index.jsp
As regras de navegao definem as regras de mudanas de pginas que podem ocorrer noframework. Estas configuraes so obrigatrias e devem ser configuradas corretamente. Paracriao de uma regra utilizada a tag navigationrule. A tag fromviewid define a qual pgina a regra
8/9/2019 Primeira App Jsf
22/23
http://www.guj.com.br
pertence e cada navigationcase case referente um fluxo a ser direcionado... Estes fluxos so oretorno string do mtodo referente s aes do commandButton que veremos a seguir.
Configurando o JSP para refletir a ao de Login.
Abra novamente o arquivo index.jsp e altere seu cdigo fonte para:
Solicitao de Servio Web
Agora execute a aplicao novamente, fornea o usurio admin e senha 123 e execute a ao delogin.Concluso
Este foi um tutorial rpido de como iniciar no desenvolvimento de aplicaes JSF, espero que possater aberto a primeira porta para que voc deslanche no desenvolvimento com este framework evenha a criar novos tutoriais para a comunidade Java.
8/9/2019 Primeira App Jsf
23/23
http://www.guj.com.br
Voc pode visualizar exemplos de outros componentes em:
http://livedemo.exadel.com/richfacesdemo
E incluir na pgina painel.jsp os cdigos fontes.
Ademir Constantino
Top Related