Josel Toro: 10. Integrando MVC con JSF Y JPA

¡Bienvenidos a todos! Esta publicación formará parte de una serie de 10 publicaciones que estaré desarrollando para aprender a crear una aplicación web en Java, bajo la plataforma JEE usando los frameworks de JPA y JSF. Este será un curso en forma de guía para todas aquellas personas que estén empezando en el mundo de la programación web.

En este curso aprenderemos a desarrollar aplicaciones web en N-CAPAS utilizando los patrones de diseño JEE, el estilo arquitectónico MVC y las funcionalidades provistas por los framework JSF (Java Server Faces) a nivel de vista-controlador y por JPA (Java Persistence API) a nivel de persistencia.

Este curso estará dividido en dos partes, En la primera parte, aprenderemos a configurar y utilizar el framework JPA mediante el desarrollo de aplicaciones Stand.Alone. En la segunda parte, aprenderemos a utilizar el framework JSF para desarrollar aplicaciones web. Por último, integraremos las funcionalidades de ambos frameworks en una aplicación final.

APLICACIÓN

Para este ejemplo: Implementaremos un Mantenimiento de Empleados con un logín integrando JSF (Java Server Faces) y JPA (Java Persistence API) donde vamos a aprender a generar entidades a partir de las tablas de base de datos utilizando el Wizard que trae JPA el cual se encargará de aplicar el ORM Mapping o mapeo relacional de objetos a las entidades y generar las estrategias de llave primaria. Asociaremos un entityListener a una entidad con tablas relacionadas, crearemos el PhaseListener para monitorear la ejecución de faces del JSF, emplearemos plantilla faceles, emplearemos archivos de recursos de textos para el cambio de idioma y agregaremos validaciones a las interfaces, es decir todo lo visto en este curso.

Aplicacion_JSF_07

1. Pasos para Configurar el proyecto

Paso 1 - Crear un proyecto web dinámico integrando JSF y JPA.

Vea el siguiente link para saber como crear un dynamic web proyect integrado con JSF (Java Server Faces) Y JPA (Java Persistence API) y Apache Tomcat como servidor web:

Paso 2 - Agregar las librerías básicas en la carpeta lib del webContent. Si hemos seguidos los pasos de como crear un dynamic web proyect integrado con JSF (Java Server Faces) Y JPA (Java Persistence API), no es necesario incluir las librerías de JPA y JSF, puesto que ya han sido configurado al crear el proyecto desde un principio. Solo incluiríamos las librerías extras que usaremos en el proyecto como log4j, mysql.conector, primefaces, etc. Ahora, si no hemos seguido los pasos de creación del proyecto JSF y JPA, y solo creamos un dynamic web proyect simple sin integrar JSF y JPA, es posible configurarlo después, puesto que es obvio que lo necesitaremos si queremos trabajar con estos frameworks.

Paso 3 - Configurar el Faces Servlet en el archivo de configuración "web.xml", este archivo es creado al momento de crear el proyecto.


  
    faces/inicio.xhtml
  
   
  
    Faces Servlet
    javax.faces.webapp.FacesServlet
    1
  
  
    Faces Servlet
    /faces/*

Paso 4 - Crear el archivo de configuración "faces-config.xml" dentro de la carpeta WEB-INF para registrar el listener y el archivo de recursos de texto que posteriormente crearemos, este archivo de configuración también se crea al momento de crear el proyecto.


     
    
        jsf.listener.JSFListener
    
     
    
     
      pe.edu.cibertec.recursos.textos
      texto
     
     pe.edu.cibertec.recursos.textos
     
      es
      en

2. Crear las clases

Anteriormente, nosotros creábamos las clases entidades manualmente y también aplicábamos la técnica ORM Mapping para asociar las entidades con las tablas de base de datos y para mapearlas utilizábamos anotaciones, el problema era que todo lo teníamos que hacer manualmente, pero ¿qué pasaría si tuviésemos 10, 20, 30 tablas? seria tedioso mapearlas una por una. Pues bueno, eso se acabó, ahora haremos lo mismo pero en pocos segundo empleando el Wizard que nos trae JPA para generar las entidades a partir de las tablas de base de datos. Para ello, si no hemos seguido los pasos de como crear un proyecto web integrado con JSF Y JPA debemos de configurarlo para poder utilizar el Wizard.

Paso 5 - Configurar el Java Persintence API (JPA) en tu proyecto web java

Visitar el siguiente link para saber como configurar un proyecto web simple para el caso de que no tengas integrado las facetas de JPA y JSF. (Opcional)

Paso 6 - Generar las clases entidades a partir de las tablas de base de datos utilizando el wizard de JPA, de esta manera evitamos crear las entidades y mapearlas con las tablas de base de datos de manual.

Visitar el siguiente link para saber como generar entidades a partir de las tablas de base de datos utilizando el Wizard de JPA.

Paso 7 - El Wizard de JPA generará las entidades relacionadas TbCargo.java, TbCasillero.java, TbEmpleado.java, TbSecuencia.java, TbUsuario.java en el paquete persistence.entity.

. TbCargo.java

. TbCasillero

. TbEmpleado

. TbSecuencia

. TbUsuario

Paso 8 - Sincronizar la lista de clases y establecer la conexión a la base de datos MySql en el archivo persistence.xml.

Paso 9 - Crear el Entity Listener TbEmpleadoListener.java para comprender el Ciclo de Vida de una entidad en el paquete persistence.entity.listener.

. TbEmpleadoListener.java

Paso 10 - Crear el Phase Listener PhaseListener.java para monitorear la ejecución de faces del JSF en el paquete jsf.listener.

. JSFListener.java

Paso 11 - Crear la clase ApplicationBusinessDelegate.java en el paquete business.delegate.

. ApplicationBusinessDelegate.java

Paso 12 - Crear las interfaces LoginService.java, EmpleadoService.java, CargoService.java

y su clases que la implementan en el paquete business.service.

. LoginService.java

. EmpleadoService.java

. CargoService.java

. LoginServiceImpl.java

. EmpleadoServiceImpl.java

. CargoServiceImpl.java

Paso 13 - Crear el paquete persistence.jpa que contendrá las clases donde se implementará las funcionalidades de acceso a base de datos y operaciones CRUD con las tablas relacionales TbCargoJPA.java, TbEmpleadoJPA.java, TbUsuarioJPA.java.

. TbCargoJPA.java

. TbEmpleadoJPA.java

. TbUsuarioJPA.java

Paso 14 - Crear los managed bean EmpleadoBean.java, ListadosBean.java, localeBean.java, LoginBean.java dentro del paquete jsf.managed.

. EmpleadoBean.java

. ListadosBean.java

. LocaleBean.java

. LoginBean.java

Donde:

Método consultar:
-em.getResultList(): Obtiene lista de entidades, en base al JPQL definido

Método insertar:
-em.persist(entidadEmpleado): Genera un insert a la tabla relacional mapeada con los datos del objeto.

Método actualizar:
-em.merge(entidadEmpleado): Genera un update a la tabla relacional mapeada con los datos del objeto.

Método eliminar:
-Es necesario primero realizar una búsqueda por llave primaria para asociar el objeto entidad a la transacción con JPA
-em.remove(entidadEmpleado): Genera un delete a la tabla relacional mapeada con los datos del objeto.
-em.find(ClaseEntidad.class, valorLlavePrimaria): Realiza una búsqueda por llave primaria en la tabla que representa la Clase Entidad.

IMPORTANTE:

. Asegúrense que los objetos “entidad” fueron cargados con todos los valores necesarios en sus atributos antes de ejecutar las transacciones, de lo contrario puede dar error al momento de ejecutarlas.

3. Crear los archivos de recursos de texto

Paso 14 - Crear los archivo textos.properties y textos_en.properties dentro del paquete pe.edu.cibertec.recursos

Personalizar mensajes de validación

. textos.properties

. textos_en.properties

4. Crear la plantilla faceles
Paso 15 - Crear la página plantilla.xhtml dentro de la carpeta plantillas y sus secciones cabecera.xhtml, menu.xhtml y pie.xhtml dentro de la carpeta secciones como se muestra en la siguiente imagen:

. plantilla.xhtml

Configurar con FACELETS la plantilla de diseño de página

. Para ello primero debemos referenciar los taglibs

. Luego incluir las secciones requeridas utilizando la etiqueta ui:insert cuyo contenido por defecto se define con la etiqueta ui:include según:

. Cada página referenciada con la etiqueta ui:include debe definir cuál será el contenido que incluirá en la plantilla. Ello se realiza con la etiqueta ui:composition según:

. Se observa que la sección contenido no incluye ninguna página por defecto. Esta sección contendrá el contenido de las diversas páginas del aplicativo que irá cambiando en tiempo de ejecución. Tenemos que sobreescribir en cada página del aplicativo la sección en mención con la etiqueta ui:composition para referenciar la plantilla y la etiqueta ui:define para definir el contenido a incluir en ui:insert= “body”.

. cabecera.xhtml

. menu.xhtml

. pie.xhtml

5. Crear las páginas XHTML

Paso 15 - Crear la página inicio.xhtml dentro del WebContent, principal.xhtml, empleadoListado.xhtml, empleadoEdicion.xhtml y empleadoDetalle.xhtml en la carpeta paginas dentro del webContent.

Tenemos que sobreescribir en cada página del aplicativo la sección body con la etiqueta ui:composition para referenciar la plantilla y la etiqueta ui:define para definir el contenido a incluir en ui:insert= “body”.

Reemplazar textos estáticos en páginas JSF por los definido en el archivo de recursos de texto

Añadir validaciones a campos de formulario y emplear el uso del atributo label

Definir id a cada campo y asociarlo a un elemento h:message

. inicio.xhtml

. empleadoListado.xhtml

. empleadoEdicion.xhtml

. empleadoDetalle.xhtml

Paso 16 - Probar aplicación

ESTRUCTURA FINAL DEL PROYECTO