1. Introducción
1.1. Présentation
El PDF de este documento es |AQUÍ|.
Los ejemplos de este documento están disponibles |AQUÍ|.
En este documento nos proponemos presentar, mediante ejemplos
- el framework Java Server Faces 2 (JSF2),
- la biblioteca de componentes PrimeFaces para JSF2, destinada a aplicaciones de escritorio y móviles.
Este documento está dirigido principalmente a estudiantes y desarrolladores interesados en la biblioteca de componentes PrimeFaces y [http://www.primefaces.org]. Este marco ofrece varias decenas de componentes con tecnología AJAX ([http://www.primefaces.org/showcase/ui/home.jsf]) que permiten crear aplicaciones web con un aspecto y un comportamiento similares a los de las aplicaciones de escritorio. PrimeFaces se basa en JSF2, de ahí la necesidad de presentar primero este marco de trabajo. Además, PrimeFaces ofrece componentes específicos para dispositivos móviles. También los presentaremos.
Para ilustrar lo que queremos explicar, crearemos una aplicación de gestión de citas en diferentes entornos:
- una aplicación web clásica con las tecnologías JSF2 / EJB3 / JPA en un servidor Glassfish 3.1,
- la misma aplicación adaptada a Ajax, con la tecnología PrimeFaces,
- y, por último, una versión móvil con la tecnología PrimeFaces Mobile.
Cada vez que se haya creado una versión, la trasladaremos a un entorno JSF2 / Spring / JPA en un servidor Tomcat 7. Por lo tanto, crearemos seis aplicaciones Java EE.
El documento solo presenta lo necesario para compilar estas aplicaciones. Por lo tanto, no hay que buscar en él la exhaustividad. No la encontrarás. Tampoco es una recopilación de buenas prácticas. Los desarrolladores experimentados pueden pensar que habrían hecho las cosas de otra manera. Simplemente espero que este documento tampoco sea una recopilación de malas prácticas.
Para profundizar en JSF2 y PrimeFaces, se pueden consultar las siguientes referencias :
- [ref1]: Tutorial de Java EE5 [http://java.sun.com/javaee/5/docs/tutorial/doc/index.HTML], la referencia de Sun para descubrir Java EE5. Se recomienda leer la sección II [Web Tier] para familiarizarse con la tecnología web y, en particular, con JSF. Los ejemplos del tutorial se pueden descargar. Se presentan en forma de proyectos de NetBeans que se pueden cargar y ejecutar,
- [ref2]: «Core Faces» de David Geary y Cay S. Horstmann, tercera edición, de la editorial McGraw-Hill,
- [ref3]: la documentación de PrimeFaces [http://primefaces.googlecode.com/files/primefaces_users_guide_3_2.pdf],
- [ref4]: la documentación de PrimeFaces Mobile: [http://primefaces.googlecode.com/files/primefaces_mobile_users_guide_0_9_2.pdf].
En ocasiones haremos referencia a [ref2] para indicar al lector que puede profundizar en un tema con este libro.
El documento se ha redactado de tal forma que resulte comprensible para el mayor número posible de personas. Los requisitos previos necesarios para su comprensión son los siguientes:
- conocimientos del lenguaje Java,
- conocimientos básicos de desarrollo en Java EE.
En la página web [http://developpez.com] se pueden encontrar todos los recursos necesarios para cumplir estos requisitos previos. Algunos de ellos se encuentran en la página web [http://tahe.developpez.com]:
- [ref5]: Introducción a la programación web en Java (septiembre de 2002): ofrece los fundamentos de la programación web en Java: servlets y páginas JSP,
- [ref6]: Fundamentos del desarrollo web MVC en Java (mayo de 2006) []: recomienda el desarrollo de aplicaciones web con arquitecturas de tres capas, en las que la capa web implementa el patrón de diseño (Design Pattern) MVC (Modelo, Vista, Controlador).
- [ref7]: Introducción a Java EE 5 (junio de 2010). Este documento permite descubrir JSF 1 y los EJB3.
- [ref8]: Persistencia en Java: práctica (junio de 2007). Este documento permite descubrir la persistencia de datos con JPA (Java Persistence API).
- [ref9]: Creación de un servicio web Java EE con NetBeans y el servidor GlassFish (enero de 2009). Este documento analiza la creación de un servicio web. La aplicación de ejemplo que se analiza en este documento procede de [ref9].
1.2. Los ejemplos
Los ejemplos de este documento están disponibles en URL [AQUÍ] en forma de proyectos Maven tanto para NetBeans como para Eclipse:
![]() |
Para importar un proyecto en NetBeans:
![]() |
- En [1], se abre un proyecto,
- en [2], se selecciona el proyecto que se desea abrir en el sistema de archivos,
- en [3], se abre.
Con Eclipse,
![]() |
- en [1], se importa un proyecto,
- en [2], el proyecto es un proyecto Maven ya existente,
![]() |
![]() |
- en [3]: se selecciona en el sistema de archivos,
- en [4]: Eclipse lo reconoce como un proyecto Maven,
- en [5], el proyecto importado.
1.3. Las herramientas utilizadas
A continuación, utilizamos (mayo de 2012):
- el entorno de desarrollo integrado (IDE) NetBeans 7.1.2, disponible en la versión URL [http://www.netbeans.org],
- Eclipse Indigo (IDE) en su versión personalizada como SpringSource Tool Suite (STS) [http://www.springsource.com/developer/sts],
- PrimeFaces en su versión 3.2, disponible en URL y [http://primefaces.org/],
- PrimeFaces Mobile, en su versión 0.9.2, disponible en URL y [http://primefaces.org/],
- WampServer para las versiones SGBD, MySQL y [http://www.wampserver.com/].
1.3.1. Instalación de NetBeans IDE
A continuación describimos la instalación de NetBeans 7.1.2, disponible en URL y [http://netbeans.org/downloads/].
![]() |
Se puede utilizar la versión de Java EE con los dos servidores GlassFish 3.1.2 y Apache Tomcat 7.0.22. El primero permite desarrollar aplicaciones Java EE con EJB3 (Enterprise Java Bean) y el otro, aplicaciones Java EE sin EJB. A continuación, sustituiremos los EJB por el framework Spring.
Una vez descargado el instalador de NetBeans, lo ejecutaremos. Para ello, es necesario disponer de un JDK (Java Development Kit) y un [http://www.oracle.com/technetwork/java/javase/overview/index.HTML]. Además de NetBeans 7.1.2, instalaremos:
- el framework JUnit para las pruebas unitarias,
- el servidor GlassFish 3.1.2,
- el servidor Tomcat 7.0.22.
Una vez finalizada la instalación, se inicia NetBeans:
![]() |
- en [1], NetBeans 7.1.2 con tres pestañas:
- la pestaña [Projects] muestra los proyectos de NetBeans abiertos;
- la pestaña [Files] muestra los distintos archivos que componen los proyectos de NetBeans abiertos;
- la pestaña [Services] agrupa una serie de herramientas utilizadas por los proyectos de NetBeans;
- en [2], se activa la pestaña [Services] y, en [3], la rama [Servers],
- En [4], se inicia el servidor Tomcat para comprobar que se ha instalado correctamente,
![]() |
- en [6], en la pestaña [Apache Tomcat] [5], se puede comprobar que el servidor se ha iniciado correctamente,
- en [7], se detiene el servidor Tomcat,
Se procede de la misma manera para comprobar la correcta instalación del servidor Glassfish 3.1.2:
![]() |
- en [8], se inicia el servidor Glassfish,
- en [9] se comprueba que se ha iniciado correctamente,
![]() |
- en [10], lo paramos.
Ahora ya tenemos un IDE operativo. Podemos empezar a crear proyectos. En función de estos, tendremos que detallar diferentes características del IDE.
Ahora vamos a instalar el IDE Eclipse y, dentro de él, vamos a registrar los dos servidores Tomcat 7 y Glassfish 3.1.2 que acabamos de descargar. Para ello, necesitamos conocer las carpetas de instalación de estos dos servidores. Esta información se encuentra en las propiedades de ambos servidores:
![]() |
- en [1], la carpeta de instalación de Tomcat 7,
![]() |
- en [2], la carpeta de dominios del servidor Glassfish. En la configuración de Glassfish en Eclipse, solo habrá que introducir la siguiente información: [D:\Programs\devjava\Glassfish\glassfish-3.1.2\glassfish].
1.3.2. Instalación de Eclipse
Aunque Eclipse no es el IDE que se utiliza en este documento, presentamos de todos modos su instalación. De hecho, los ejemplos del documento también se proporcionan en forma de proyectos Maven para Eclipse. Eclipse no incluye Maven preintegrado. Para ello, es necesario instalar un complemento. En lugar de instalar una versión básica de Eclipse, vamos a instalar SpringSource Tool Suite [http://www.springsource.com/developer/sts], una versión de Eclipse que ya incluye numerosos complementos relacionados con el marco Spring, así como una configuración de Maven preinstalada.
![]() |
- visita la página web de SpringSource Tool Suite (STS) [1], para descargar la versión actual de STS [2A] [2B],
![]() |
![]() |
- El archivo descargado es un instalador que crea la estructura de archivos [3A] y [3B]. En [4], se ejecuta el archivo ejecutable,
- en [5], aparece la ventana de trabajo de IDE tras cerrar la ventana de bienvenida. En [6], se muestra la ventana de servidores de aplicaciones,
![]() |
- en [7], la ventana de servidores. Hay un servidor registrado. Se trata de un servidor VMware que no vamos a utilizar. En [8], se abre el asistente para añadir un nuevo servidor,
![]() |
- en [9A], se nos proponen varios servidores. Elegimos instalar un servidor Tomcat 7 de Apache [9B],
![]() |
- en [10], indicamos la carpeta de instalación del servidor Tomcat 7 instalado con NetBeans. Si no se dispone de un servidor Tomcat, utilice el botón [11],
- en [12], el servidor Tomcat aparecerá en la ventana [Servers],
![]() |
- en [13], iniciamos el servidor,
- en [14], ya está en marcha,
- en [15], lo paramos.
En la ventana [Console], si todo va bien, aparecen los siguientes registros de Tomcat:
![]() |
- todavía en la ventana [Servers], se añade un nuevo servidor [16],
- en [17], el servidor Glassfish no aparece en la lista,
- en ese caso, se utiliza el enlace [18],
![]() |
- en [19], se elige añadir un adaptador para el servidor Glassfish,
- se descarga y, de vuelta en la ventana [Servers], se añade un nuevo servidor,
- esta vez en [21], se proponen los servidores Glassfish,
![]() |
- en [22], se selecciona el servidor Glassfish 3.1.2 descargado con NetBeans,
- en [23], se indica la carpeta de instalación de Glassfish 3.1.2 (presta atención a la ruta indicada en [24]),
- si no se dispone de un servidor Glassfish, utilizar el botón [25],
![]() |
- en [26], el asistente nos solicita la contraseña de administrador del servidor Glassfish. Para una primera instalación, suele ser adminadmin,
- una vez finalizado el asistente, en la ventana [Servers], aparece el servidor Glassfish [27],
![]() |
- en [28], lo iniciamos,
- en [29] puede surgir un problema. Depende de la información proporcionada durante la instalación. Glassfish requiere un JDK (Java Development Kit) y no un JRE (Java Runtime Environment),
- para acceder a las propiedades del servidor Glassfish, hacemos doble clic sobre él en la ventana [Servers],
- aparecerá la ventana [20], en la que hay que seguir el enlace [Runtime Environment],
![]() |
- en [31], vamos a sustituir el JRE utilizado por defecto por un JDK. Para ello, utilizamos el enlace [32],
- en [33], los JRE instalados en el equipo,
- en [34], se añade otro,
![]() |
- en [35], se elige [Standard VM] (máquina virtual),
- en [36], se selecciona un JDK (>=1.6),
- en [37], el nombre asignado al nuevo JRE,
![]() |
- Al volver a la pantalla de selección de JRE para Glassfish, elegimos el nuevo JRE, que se ha declarado como [38],
- una vez finalizado el asistente de configuración, reiniciamos [Glassfish] y [39],
- en [40], se inicia,
![]() |
- en [41], el árbol de directorios del servidor,
- en [42], se accede a los registros de Glassfish:
![]() |
- en [43], paramos el servidor Glassfish.
1.3.3. Instalación de [WampServer]
[WampServer] es un conjunto de programas para desarrollar en PHP / MySQL / Apache en un equipo con Windows. Lo utilizaremos únicamente para SGBD y MySQL.
![]() |
- En la página web de [WampServer] [1], elige la versión adecuada [2];
- el archivo ejecutable descargado es un instalador. Durante la instalación se solicita diversa información. Dicha información no afecta a MySQL, por lo que puede ignorarse. Al finalizar la instalación, aparece la ventana [3]. Se ejecuta [WampServer],
![]() |
- en [4], el icono de [WampServer] se instala en la barra de tareas, en la parte inferior derecha de la pantalla [4],
- al hacer clic en él, aparece el menú [5]. Permite gestionar el servidor Apache y el SGBD MySQL. Para gestionar este último, se utiliza la opción [PhpPmyAdmin],
- y aparecerá la ventana que se muestra a continuación,

No daremos muchos detalles sobre el uso de [PhpMyAdmin]. Simplemente mostraremos cómo utilizarlo para crear la base de datos de la aplicación de ejemplo de este tutorial.






























