INTRODUÇÃO A JSF
   (JavaServer Faces)
                  Equipe:
             Joseane de Assis
              Daniele Gomes
               Jorge William
Turma: sistema de Informação – 6 ° período
Objetivo.
• Apresentar uma introdução sobre uma tecnologia
  muito utilizada atualmente pela sua simplicidade e
  agilidade nas técnicas de interfaces com o cliente
  WEB.

• Buscar um entendimento sobre como podemos
  utilizar o framework de gerenciamento de interfaces
  JSF.
Tópicos apresentados.
•   1 - Funcionamento entre Cliente e servidor;
•   2 - O que é JavaServer Faces (JSF);
•   3 – Vantagem e Desvantagem;
•   4 – O que é UI.
•   5 - O que é HTM, XML, JSP, XHTML;
•   6 - Configuração do ambiente para desenvolvimento;
•   7 - Framework para desenvolvimento;
•   8 - Bibliotecas;
•   9 - O que é um Managed Bean;
•   10 - Para que serve uma faces-config.xml;
•   11 - Criando um formulário simples com JSF.
Funcionamento entre Cliente e
              Servidor
• Realizando uma comunicação HTTP ( Hipertext
  Transfer Protocol ), sobre a comunicação TCP/IP.

     Cliente                 Servidor HTTP                Aplicação WEB
                Pedido                        Executa


                 Resposta                       dados



     O pedido e entendido como uma Request que destina a uma requisição
     HTTP.
     A resposta e entendido como uma Response que destina a uma resposta
     da informação ao cliente.
O que é JavaServer Faces (JSF).
• JavaServer Faces, ou JSF, é um framework para desenvolvimento
   web que implementa o modelo MVC (Model View Controller) e foi
   desenvolvido pela comunidade JCP (Java Community Proccess) que
   é um grupo de empresas e/ou grupos de desenvolvedores de
   software que estabelece padrões de solução para problemas
   comuns. Este surgiu com a necessidade de se agilizar e automatizar
   processos que eram utilizados em todos os projetos J2EE.
Características e Vantagens:
• Facilita a criação de telas.
• Facilita a transferência de dados na tela através da camada de
   modelo.
• Criar um simples gerenciamentos de estado.
• Promove um mecanismo produtivo.
• Permiti personalização de UI.
Vantagem e Desvantagem
• Vantagem:
1.   Apoio na comunicação entre as camadas de uma aplicação MVC. O JSF,
     através dos managed beans, permite a comunicação entre as camadas de
     controle e de visão da aplicação.
2.   Conjunto de componentes para interface de usuário (UI).
3.   Permite que o desenvolvedor crie UIs através de um conjunto de
     componentes UIs pré-definidos;
4.   Fornece um conjunto de tags JSP para acessar os componentes;
5.   Reusa componentes da página;
6.   Associa os eventos do lado cliente com os manipuladores dos eventos do
     lado servidor (os componentes de entrada possuem um valor local
     representando o estado no lado servidor);
7.   Fornece separação de funções que envolvem a construção de aplicações
     WEB.
Vantagem e Desvantagem
• Desvantagem:
1. Curva de aprendizagem - projectos pequenos; prazos curtos,
   programadores inexperientes.
2. Documentação (inferior a JSP)
3. Maior opacidade na execução - debug; optimizações.
4. Suporte ao desenvolvimento - comparado com JSP
5. Rigidez da abordagem, MVC!
O que é UI ?
• jQuery UI é um JavaScript biblioteca que fornece abstrações
  de baixo nível de interação e de animação , efeitos avançados
  e de alto nível, themeable os widgets , construídas em cima
  do jQuery biblioteca JavaScript, que podem ser usados ​para
  construir aplicações web interativas.(http://en.wikipedia.org/wiki/JQuery_UI)




                        http://jqueryui.com/themeroller/
O que é HTML,JSP,XML e XHTML.
• Um HTML (HyperText Markup Language em português Linguagem
  de Marcação de Hipertexto) especificada na década de 1990.

• O XML e uma extensão do HTML recomendada pela W3C para
  marcações especiais, e um documento com os dados organizados.

• JSP(JavaServer Pages) é uma tecnologia no desenvolvimento JAVA
  WEB, semelhante ao Active Server Pages(ASP) da Microsoft.

• O JSF utiliza XHTML que combina o HTML com XML para melhor
  acessibilidades dos diversos tipos de dispositivos.
Configuração do ambiente para
           desenvolvimento
• Para o desenvolvimento precisamos:
• Kit de desenvolvimento Java JDK 1.6 ou
  superior.
• Apache TomCat 6.0 ou superior
• NetBeans IDE 6 ou superior
Configuração do ambiente para
             desenvolvimento
• Configurando um projeto.

  1° Novo Projeto



                    2° Selecionar “JAVA WEB”
                                                        3° Selecionar “Aplicação Web”




                                 4° Pressiona Próximo
Configuração do ambiente para
           desenvolvimento
• Configurando um projeto.


             1°




                        2°
Configuração do ambiente para
           desenvolvimento
• Configurando um projeto.


           1°




                      2°
Configuração do ambiente para
           desenvolvimento
• Configurando um projeto.


           1°

                         3°

            2°
Configuração do ambiente para
       desenvolvimento




    1°



                 2°
Framework para desenvolvimento
• Existem varias implementações feitas;
• Utilizaremos o Framework PRIMEFACE
Bibliotecas
•   Utilizaremos as seguintes bibliotecas:
•   JSF API jsf-api.jar e jsf-impl.jar.
•   Implementações primefaces.jar
•   JSTL Teg Lib jstl.jar e standard.jar
O que é um Managed Bean?
• Managed Beans são uma parte central do JSF,
  eles representam os dados e também as ações
  das paginas WEB, ou seja, dados utilizados para
  popular as informações e também eventos das
  paginas.
• Um Managed Bean é um JavaBean gerenciado
  pelo framework JSF, ou seja, ele é instanciado e
  colocado no escopo de acordo com as
  configurações encontradas no faces-config.xml
O que é um Managed Bean

          @RequestScoped – não guarda na sessão.
       @SessionScoped – guarda na sessão as informações



                       Ação de redirecionamento
                              de paginas
Para que serve uma faces-config.xml
• O faces-config.xml e o principal arquivo de
  configuração do JSF, neles anotamos o
  comportamento da Managed Bean.

• Configuramos na faces-config.xml o Menaged
  Bean um nome a classe que ir ser chamado via
  Expression Language (EL) nas paginas.
Para que serve uma faces-config.xml



                        Nome para associação da
                                 MB


                         Redirecionamento de
                        pagina de acordo com a
                        mensagem enviada pela
                                  MB.
Criando um formulário simples com
                JSF
• Importado a biblioteca no XHTML.


             1°




                    2°



   Documentação PrimeFaces : http://primefaces.org/documentation.html
Criando um formulário simples com
                JSF
• TAGs.




   Documentação PrimeFaces : http://primefaces.org/documentation.html
Criando um formulário simples com
               JSF




 Documentação PrimeFaces : http://primefaces.org/documentation.html
Bibliografia
• http://www.guj.com.br/content/articles/jsf/jsf.pdf
• http://primefaces.org/documentation.html
• Livro Java na Web com Jsf, Spring, Hibernate e Netbeans 6 - Yuri Marx P.
  Gomes / CIENCIA MODERNA
• Apostila DIVUS.
Agradecemos pela atenção!

   Fucapi ano 2012 2° semestre

Introdução a jsf

  • 1.
    INTRODUÇÃO A JSF (JavaServer Faces) Equipe: Joseane de Assis Daniele Gomes Jorge William Turma: sistema de Informação – 6 ° período
  • 2.
    Objetivo. • Apresentar umaintrodução sobre uma tecnologia muito utilizada atualmente pela sua simplicidade e agilidade nas técnicas de interfaces com o cliente WEB. • Buscar um entendimento sobre como podemos utilizar o framework de gerenciamento de interfaces JSF.
  • 3.
    Tópicos apresentados. • 1 - Funcionamento entre Cliente e servidor; • 2 - O que é JavaServer Faces (JSF); • 3 – Vantagem e Desvantagem; • 4 – O que é UI. • 5 - O que é HTM, XML, JSP, XHTML; • 6 - Configuração do ambiente para desenvolvimento; • 7 - Framework para desenvolvimento; • 8 - Bibliotecas; • 9 - O que é um Managed Bean; • 10 - Para que serve uma faces-config.xml; • 11 - Criando um formulário simples com JSF.
  • 4.
    Funcionamento entre Clientee Servidor • Realizando uma comunicação HTTP ( Hipertext Transfer Protocol ), sobre a comunicação TCP/IP. Cliente Servidor HTTP Aplicação WEB Pedido Executa Resposta dados O pedido e entendido como uma Request que destina a uma requisição HTTP. A resposta e entendido como uma Response que destina a uma resposta da informação ao cliente.
  • 5.
    O que éJavaServer Faces (JSF). • JavaServer Faces, ou JSF, é um framework para desenvolvimento web que implementa o modelo MVC (Model View Controller) e foi desenvolvido pela comunidade JCP (Java Community Proccess) que é um grupo de empresas e/ou grupos de desenvolvedores de software que estabelece padrões de solução para problemas comuns. Este surgiu com a necessidade de se agilizar e automatizar processos que eram utilizados em todos os projetos J2EE. Características e Vantagens: • Facilita a criação de telas. • Facilita a transferência de dados na tela através da camada de modelo. • Criar um simples gerenciamentos de estado. • Promove um mecanismo produtivo. • Permiti personalização de UI.
  • 6.
    Vantagem e Desvantagem •Vantagem: 1. Apoio na comunicação entre as camadas de uma aplicação MVC. O JSF, através dos managed beans, permite a comunicação entre as camadas de controle e de visão da aplicação. 2. Conjunto de componentes para interface de usuário (UI). 3. Permite que o desenvolvedor crie UIs através de um conjunto de componentes UIs pré-definidos; 4. Fornece um conjunto de tags JSP para acessar os componentes; 5. Reusa componentes da página; 6. Associa os eventos do lado cliente com os manipuladores dos eventos do lado servidor (os componentes de entrada possuem um valor local representando o estado no lado servidor); 7. Fornece separação de funções que envolvem a construção de aplicações WEB.
  • 7.
    Vantagem e Desvantagem •Desvantagem: 1. Curva de aprendizagem - projectos pequenos; prazos curtos, programadores inexperientes. 2. Documentação (inferior a JSP) 3. Maior opacidade na execução - debug; optimizações. 4. Suporte ao desenvolvimento - comparado com JSP 5. Rigidez da abordagem, MVC!
  • 8.
    O que éUI ? • jQuery UI é um JavaScript biblioteca que fornece abstrações de baixo nível de interação e de animação , efeitos avançados e de alto nível, themeable os widgets , construídas em cima do jQuery biblioteca JavaScript, que podem ser usados ​para construir aplicações web interativas.(http://en.wikipedia.org/wiki/JQuery_UI) http://jqueryui.com/themeroller/
  • 9.
    O que éHTML,JSP,XML e XHTML. • Um HTML (HyperText Markup Language em português Linguagem de Marcação de Hipertexto) especificada na década de 1990. • O XML e uma extensão do HTML recomendada pela W3C para marcações especiais, e um documento com os dados organizados. • JSP(JavaServer Pages) é uma tecnologia no desenvolvimento JAVA WEB, semelhante ao Active Server Pages(ASP) da Microsoft. • O JSF utiliza XHTML que combina o HTML com XML para melhor acessibilidades dos diversos tipos de dispositivos.
  • 10.
    Configuração do ambientepara desenvolvimento • Para o desenvolvimento precisamos: • Kit de desenvolvimento Java JDK 1.6 ou superior. • Apache TomCat 6.0 ou superior • NetBeans IDE 6 ou superior
  • 11.
    Configuração do ambientepara desenvolvimento • Configurando um projeto. 1° Novo Projeto 2° Selecionar “JAVA WEB” 3° Selecionar “Aplicação Web” 4° Pressiona Próximo
  • 12.
    Configuração do ambientepara desenvolvimento • Configurando um projeto. 1° 2°
  • 13.
    Configuração do ambientepara desenvolvimento • Configurando um projeto. 1° 2°
  • 14.
    Configuração do ambientepara desenvolvimento • Configurando um projeto. 1° 3° 2°
  • 15.
    Configuração do ambientepara desenvolvimento 1° 2°
  • 16.
    Framework para desenvolvimento •Existem varias implementações feitas; • Utilizaremos o Framework PRIMEFACE
  • 17.
    Bibliotecas • Utilizaremos as seguintes bibliotecas: • JSF API jsf-api.jar e jsf-impl.jar. • Implementações primefaces.jar • JSTL Teg Lib jstl.jar e standard.jar
  • 18.
    O que éum Managed Bean? • Managed Beans são uma parte central do JSF, eles representam os dados e também as ações das paginas WEB, ou seja, dados utilizados para popular as informações e também eventos das paginas. • Um Managed Bean é um JavaBean gerenciado pelo framework JSF, ou seja, ele é instanciado e colocado no escopo de acordo com as configurações encontradas no faces-config.xml
  • 19.
    O que éum Managed Bean @RequestScoped – não guarda na sessão. @SessionScoped – guarda na sessão as informações Ação de redirecionamento de paginas
  • 20.
    Para que serveuma faces-config.xml • O faces-config.xml e o principal arquivo de configuração do JSF, neles anotamos o comportamento da Managed Bean. • Configuramos na faces-config.xml o Menaged Bean um nome a classe que ir ser chamado via Expression Language (EL) nas paginas.
  • 21.
    Para que serveuma faces-config.xml Nome para associação da MB Redirecionamento de pagina de acordo com a mensagem enviada pela MB.
  • 22.
    Criando um formuláriosimples com JSF • Importado a biblioteca no XHTML. 1° 2° Documentação PrimeFaces : http://primefaces.org/documentation.html
  • 23.
    Criando um formuláriosimples com JSF • TAGs. Documentação PrimeFaces : http://primefaces.org/documentation.html
  • 24.
    Criando um formuláriosimples com JSF Documentação PrimeFaces : http://primefaces.org/documentation.html
  • 25.
    Bibliografia • http://www.guj.com.br/content/articles/jsf/jsf.pdf • http://primefaces.org/documentation.html •Livro Java na Web com Jsf, Spring, Hibernate e Netbeans 6 - Yuri Marx P. Gomes / CIENCIA MODERNA • Apostila DIVUS.
  • 26.
    Agradecemos pela atenção! Fucapi ano 2012 2° semestre