Java Server Faces Primeros Pasos

Bueno ahora en la actualidad bueno de hace ratos se viene insistiendo en usar Framework de trabajo los cuales nos faciliten el desarrollo de algunos aspectos que no son tan criticos y nos centremos en lo que importa en un sistema.

JavaServer Faces (JSF) es una tecnología y framework para aplicaciones Java basadas en web que simplifica el desarrollo de interfaces de usuario en aplicaciones Java EE. JSF usa JavaServer Pages (JSP) como la tecnología que permite hacer el despliegue de las páginas.

JSF incluye:

• Un conjunto de APIs para representar componentes de una interfaz de usuario y administrar su estado, manejar eventos, validar entrada, definir un esquema de navegación de las páginas y dar soporte para internacionalización y accesibilidad.
• Un conjunto por defecto de componentes para la interfaz de usuario.
• Dos bibliotecas de etiquetas personalizadas para JavaServer Pages que permiten expresar una interfaz JavaServer Faces dentro de una página JSP.
• Un modelo de eventos en el lado del servidor.
• Administración de estados.
• Beans administrados.

Objetivos de Java Server faces

• Estos objetivos de diseño representan el foco de desarrollo de JSF:
• Definir un conjunto simple de clases base de Java para componentes de la interfaz de usuario, estado de los componentes y eventos de entrada. Estas clases tratarán los aspectos del ciclo de vida de la interfaz de usuario, controlando el estado de un componente durante el ciclo de vida de su página.
• Proporcionar un conjunto de componentes para la interfaz de usuario, incluyendo los elementos estándares de HTML para representar un formulario. Estos componentes se obtendrán de un conjunto básico de clases base que se pueden utilizar para definir componentes nuevos.
• Proporcionar un modelo de JavaBeans para enviar eventos desde los controles de la interfaz de usuario del lado del cliente a la aplicación del servidor.
• Definir APIs para la validación de entrada, incluyendo soporte para la validación en el lado del cliente.
• Especificar un modelo para la internacionalización y localización de la interfaz de usuario.
• Automatizar la generación de salidas apropiadas para el objetivo del cliente, teniendo en cuenta todos los datos de configuración disponibles del cliente, como versión del navegador...

La version actual es la 2.1.

Para Trabajar con JSF lo puedes hacer en Netbeans configurando un servidor o algun contenedor como el Tomcat para desplegar aplicaciones JSF,En eclipse yo recomiendo añadir la extension JbossTools el cual trae una opcion para generar un proyecto JSF y correrlo en Algun Servidor Jboss instalado,En JDeveloper hay que configurar el WebLogic que trae interno el IDE, para ejecutar la aplicacion este ultimo trae un diseñador visual.

La forma mas facil es en Netbeans ya que solo nos bajamos la version full y ya trae la caracteristica para trabajar,En el Ejemplo hago caso omiso a que ya te bajaste el IDE,ya configuraste el tomcat o cualquier otro,y estas listo para crear un proyecto web JSF.

Antes de empezar el pequeño tutorial tienes que haber usado netbeans para que no te perdas en los pasos.

Lo primero que haremos es un proyecto web nuevo como lo vemos en la imagen.

Le ponemos un nombre al proyecto:

Luego le ponemos a que servidor estara ejecutandose antes de eso debemos de configurar el tomcat hay una entrada en el blog que explica como paso a paso.

En la siguiente pantalla seleccionamos que queremos trabajarlo con JSF con las librerias 2.1 que son las mas recientes las demas pestañas no la tocamos lo dejamos por default y presionamos terminar.

Ya creado el proyecto vemos en la imagen que explica las partes del proyecto cada una tiene una funcion especifica y fundamental de existir.Por experiencia la carpeta que mas tocaremos es WEB-INF aca tendremos que tener nuestras imagenes en dado caso usemos las librerias externas que no las contiene el IDE aca deben de ir.

Nos colocamos en la carpeta WEB-INF y presionamos click derecho y seleccionamos nuevo y nos saldra esta pantalla.

Y seleccionamos del panel izquiedo java server faces y del derecho jsf configuration.

le dejamos por default el nombre ya que solo abra uno pero que es esto que acabamos de crear.

Es el archivo de Configuracion de JSF como su nombre lo indica aca iran todos los beans las vistas y los casos de navegacion para nuestra aplicacion.

Luego de estos en donde tienen que ir nuestras clases java creamos un paquete y una clase con nombre BeanLogin como lo vemos en la imagen.

Un bean en JSF es el que comunicara la vista de nuestra aplicacion con nuestra logica de negocio lo cual sigue el patron de diseño MVC para un mejor desarrollo y distribucion de las capas de la aplicacion.

Lo siguiente que tenemos que hacer es metodos get y set para la propiedad de usuario tipo String y pass como lo vemos en la imagen.

Luego tenemos que abrir el faces config y editar su codigo para poder agregar un managed bean el cual nos ayudara a comunicar la vista(pagina XHTML,JSP) con la logica de negocio(tus clases Java).

Damos clik derecho sobre el archivo como lo vemos en la imagen y nos saldra un menu el cual seleccionaremos managed bean.Y nos saldra la siguiente pantalla.

Aca le ponemos un nombre al bean en mi caso LoginBean en la opcion de bean class presionamos el boton señalado en la imagen para que buscar la clase que anteriormente habiamos creado,luego de eso cambiamos el estado del bean a session porque lo necesitaremos en cada cliente,los scopes son el ambito del bean,session quiere decir que estara creado por cada cliente y no se destruira hasta que nosotros lo indiquemos,el aplication esta presente en todo el sistema en general, y request es el que solo se crea en una peticion luego desaparece.

Luego de esto abrimos nuestro XHTML y ponemos el siguiente codigo que se muestra en la imagen:

Esto son etiquetas JSF mescladas con html normal.si vemos en la propiedad value del inputText  enlazo mi bean.propiedad con el objeto de la vista asi cuando se haga una peticion a un metodo nosotros obtendremos los valores que en inputText digitaron y en caso de asignar informacion desde el servidor a la vista.Por medio de la propiedad que declaramos en el bean.Para llamar un metodo desde un boton podemos usar la propiedad Action el cual nos pedira el nombre del bean y el metodo (solo el nombre).

Luego de eso nos vamos a nuestro bean para crear el metodo login:

Un metodo que retorne un String lo siguiente es crear una nueva pagina XHTML que se llame principal que sera la que se muestre cuando el login sea correcto y ponemos el siguiente codigo en la nueva pagina.

Regresamos a nuestro faces config para crear una nueva regla de navegacion que nos servira para redireccionar entre paginas cuando haya un metodo de por medio.

Y nos saldra un menu el cual tenemos que indicar el origen de la nueva regla.

Otra vez presionamos clik derecho para crear un nuevo caso de navegacion.

Y nos saldra un menu el cual tenemos que indicar que regresara la pagina y que hara si eso se cumple.

Acordemonos que en el metodo regresamos correcto por eso el caso de navegacion retornara correcto.En dado caso se cumpla se mostrara la pagina principal,cuando no sea correcto tenemos que crear otro caso de navegacion en este caso cuando la pagina retorno incorrecto.

Y listo ya esta listo nuestro Ejemplo cuando no sea el usuario correcto se quedara en la misma pagina si es correcto se mostrara la pagina principal.

Presionamos Entrar y veremos la pagina principal.

Y eso es todo para una pequeña introduccion a algo que es muy potente y bonito de manejar ahora ya pueden leer el manual para hacer cosas mas complicadas.
Manual JSF

Mas adelante veremos cosas mas interesantes Comenten no sean Bayuncos