Java Server Faces (JSF) NetBeans 5.

5
Copyright Wilder Lpez M.
1
Creando una Aplicacin J2EE con JSF y
Base de Datos en NetBeans 5.5

Autor: Wilder Lpez Melndez
1

wlopezm@yahoo.com
Fecha: 28 de junio de 2007


I.- Introduccin

Como analistas y programadores vamos desarrollando a diario nuestras habilidades para
resolver problemas usuales que se presentan en el desarrollo del software. Por cada problema
que se nos presenta pensamos distintas formas de resolverlo, incluyendo soluciones exitosas
que ya hemos usado anteriormente en problemas similares. Es as que a mayor experiencia
que tengamos, nuestro abanico de posibilidades para resolver un problema crece, pero al final
siempre habr una sola solucin que mejor se adapte a nuestra aplicacin.

Por lo tanto, los patrones de diseo son soluciones exitosas a problemas comunes. Existen
muchas formas de implementar patrones de diseo. Los detalles de las implementaciones son
llamadas estrategias, es decir soluciones tpicas de desarrollo. Hay patrones que abarcan las
distintas etapas del desarrollo; desde el anlisis hasta el diseo y desde la arquitectura hasta la
implementacin.

Un patrn es una solucin comprobada para un problema en un contexto, cuanto ms amplio
sea el contexto, ms amplio ser el campo de aplicacin del patrn, en trminos de software,
los patrones son esencialmente la destilacin de la sabidura obtenida por especialistas sobre
lo que funciona bien a la hora de especificar, disear e implementar software.

(GoF, que en espaol es la pandilla de los cuatro) desde luego que ellos no son los inventores
ni los nicos involucrados, pero ese fue luego de la publicacin de ese libro que empez a
difundirse con ms fuerza la idea de patrones de diseo. El grupo de GoF clasificaron los
patrones en 3 grandes categoras basadas en su propsito:

Creacionales: Patrones creacionales tratan con las formas de crear instancias de objetos. El
objetivo de estos patrones es de abstraer el proceso de instanciacin y ocultar los detalles de
cmo los objetos son creados o inicializados.

Estructurales: Los patrones estructurales describen como las clases y objetos pueden ser
combinados para formar grandes estructuras y proporcionar nuevas funcionalidades. Estos
objetos adicionados pueden ser incluso objetos simples u objetos compuestos.

Comportamiento: Los patrones de comportamiento nos ayudan a definir la comunicacin e
iteracin entre los objetos de un sistema. El propsito de este patrn es reducir el acoplamiento
entre los objetos.

La arquitectura Modelo-Vista-Controlador es un patrn de diseo clsico que es muy usado
en aplicaciones que requieren la habilidad de mantener mltiples vistas del mismo dato; es
decir, se usa para administrar la informacin y notificar algn cambio en la misma, por lo que su
funcionalidad est dirigida a un propsito comn.

Utilizando este tipo de patrones conseguimos: ms calidad, mejor mantenibilidad, perder el
miedo a empezar un proyecto desde cero, pero una de las cosas ms importantes es la
normalizacin y estandarizacin del desarrollo de Software.

En este artculo vamos a ver un framework de desarrollo que sigue el patrn MVC. Los
frameworks son muy tiles ya que nos permiten no tener que reinventar la rueda cada vez. Es
decir el framework no slo sigue el patrn, sino que me da unas directrices de trabajo, y nos da
gran parte del trabajo ya hecho.
Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
2

JSF (Java Server Faces) es un framework de desarrollo basado en el patrn MVC (Modelo
Vista Controlador). Al igual que Struts, JSF pretende normalizar y estandarizar el desarrollo de
aplicaciones web. Hay que tener en cuenta JSF es posterior a Struts, y por lo tanto se a nutrido
de la experiencia de este, mejorando algunas sus deficiencias. De hecho el creador de Struts
(Craig R. McClanahan) tambin es lder de la especificacin de JSF.

Vamos a crear una aplicacin tpica de mantenimiento de dos tablas relacionadas que me
permitan Crear un nuevo registro, modificarlo, eliminarlo y mostrar en una lista los registros de
las tablas.

Debo mencionar que realizar este tipo de aplicacin por ms sencilla que parezca sin utilizar un
framework demanda mucho tiempo su realizacin, obviamente respetando todas las reglas del
Patrn MVC, es decir crear una clase que me permita manejar la Base de Datos (Modelo),
crear un servlets (controlador) para controlar todas las transacciones, y finalmente los JSPs
(Vistas) que me permitirn mostrar los datos al usuario en formato HTML, en el rea de
Desarrollo donde trabajo, desarrollamos estos tipos de aplicaciones, bajo este esquema.


II. Desarrollo de la aplicacin JSF

Primero empezaremos definiendo nuestra Base de Datos que ser como sigue:




















Aqu observamos la relacin de las tablas facultad a escuela, una facultad puede tener una o
muchas escuelas, esto lo vemos por que el campo (PK) Facultad.idfacultad a migrado a la tabla
Escuela.idfacultad como (FK).


Despus de descargar el NetBeans 5.5 desde http://www.netbeans.org vamos a crear un
nuevo proyecto











Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
3





Elegimos una aplicacin Web (Web Application)





Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
4
Elegimos el nombre el directorio de trabajo del NetBeans, esto para mi es fundamental,
siempre insisto con mis alumnos a prestar atencin a ese cuadro de dialogo, por que aqu
defino donde se guardar mi proyecto.




Elegimos soporte para trabajar con el FrameWork JavaServer Faces - JSF



Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
5
Ahora tendremos un entorno de trabajo de JSF, por defecto nos proporciona dos JSP



Vamos a conectarnos a la base de datos donde se encuentran nuestras tablas Facultad y
Escuela.



2.1. Conexin a la Base Datos en Forma Nativa

Para ello debemos utilizar los drives del motor de base de datos del que se esta utilizando,
para este ejemplo estamos utilizando SQL Server 2000, tengo los drivers en una carpeta, y es
necesario primero copiarlos a la carpeta src en la carpeta donde se esta grabando nuestro
proyecto. Para nuestro caso la ruta exacta es:

D:\DataWLM\Proyectos\Articulos\webJSF\src\java







Copiar la
carpeta lib,
a este lugar
Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
6
Comprobamos si el paquete lib ya se muestra en nuestro proyecto.























Aadimos los .Jar al paquete Libraries, pulsando clic derecho sobre el paquete y seleccionando
la opcin Add JAR/Flder
























Seleccionamos la carpeta donde esta la carpeta lib que copiamos en el prrafo anterior y
empezamos a aadir uno a uno los componentes mbase.jar, mssqlserver.jar, msutil.jar,
sqljdb.jar







Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
7







Finalmente debemos tener en el paquete Libraries todos los componentes aadidos.



























Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
8
Como ya tenemos los componentes para poder conectarse con el motor de Base de Datos,
pasemos hacer justamente eso. Para ello pulsamos clic en Runtime, Databases




Primero debemos crear el Driver, clic derecho New Driver, luego pulsamos clic en Add y
aadiremos el Jar mssqlserver.jar





Ahora ya tenemos conectado el driver SQL Server 2000, pulsamos clic derecho Connect Using,
en esta ventana tenemos que colocar el servidor el puerto y la base de datos
jdbc:microsoft:sqlserver://<HOST>:<PORT>[;DatabaseName=<DB>], en nuestro caso vamos
a utilizar lo siguiente: jdbc:microsoft:sqlserver://localhost:1432;DatabaseName=demo. Usuario y
clave sa

Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
9



Cambiamos el HOST, PORT y DB





2.2. Conexin a la Base Datos Por medio del ODBC

Tambin pueden conectarse a la Base de Datos por medio del Windows con ODBC, con esta
opcin no necesitas tener los drivers del motor de la Base Datos, el Sistema Operativo se
encarga de hacer un puente entre el JDBC de java el Motor de BD. Seguramente te estars
preguntando cual de las dos opciones es la ms adecuada y la ms rpida?. La respuesta
es, la primera opcin, conectarse por medio de los Drivers que es la forma Nativa del JDBC.
ODBC lo utilizamos con fines acadmicos, aparte de que esta amarrado al S.O Windows.

Para crear un ODBC debemos entrar al Panel de Control de Windows y seleccionar la opcin
Herramientas Administrativas Orgenes de datos (ODBC)

Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
10



En esta cuadro de dialogo debemos agregar un origen de datos de usuario, pulsando clic en el
botn Agregar.



















Seleccionamos el motor de base datos en nuestro caso SQL Server.






Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
11
Ahora colocamos un nombre y seleccionamos la base de datos, de nombre pondremos
dbDemo, y como servidor (local) con esto levantamos la BD instalado en forma local.




Configuramos el modo de autentificacin de la base de datos puedes probar con las dos
opciones autentificacin de Windows o la autentificacin de Sql Server, estas autentificaciones
depende de cmo configuraste el SQL Server, en mi caso seleccionar la primera opcin.





Seleccionamos la base de datos con la que trabajar, aqu seleccionamos la BD Demo.




Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
12
Pulsamos clic en Finalizar y con esto ya tenemos creado nuestro DSN de usuario



Pulse clic en el botn probar origen de datos, si muestra la ventana de resultados de pruebas el
mensaje PRUEBAS COMPLETAMENTE CORRECTAMENTE, todo fue exitoso. Pulse aceptar
en todas la ventanas abiertas





Nos vamos al entorno de NetBeans 5.5, a la pestaa Runtime para conectarnos al ODBC que
hemos creado. Pulsar clic derecho en el Drriver JDBC-ODBC Bridge y elegimos la opcin
Connect Using






Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
13
En esta ventana colocamos el nombre del ODBC que creamos anteriormente en el campo
Database URL, y pulsamos OK.






Si logramos conectarnos a la Base de Datos tendremos una ventana con las tablas existentes.
Pulse clic derecho sobre cualquier tabla y seleccione la opcin View Data, para mostrar los
datos.











Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
14
2.3. Creando el la aplicacin Mantenimiento de las tablas Escuela y Facultad con JSF

1 Nos vamos a Project y pulsamos clic derecho en el proyecto webJSF del sub men
seleccionamos New Entity Classes from Database




Si les presenta un mensaje de que no puede crear clases entity en este Project, debemos subir
el nivel del origen de java a level 1.5, tal como se muestra en la figura




Para solucionar este problema, vamos a pulsar clic derecho sobre el proyecto y seleccionamos
la opcin Properties, y cambiamos el Source Level a 1.5, con esto podremos crear una clase
de tipo Entity clases desde base de datos.
Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
15



Repetimos el paso 1 y seleccionamos la base de datos en la opcin Database Connection,
colocaremos la conexin jdbc:odbc:dbDemo que creamos anteriormente; con esto tendremos
cargado las tablas que en ella existe, trasladamos la tabla Escuela al lado derecho con el botn
Add >, automticamente pasar la tabla Facultad porque se encuentra relacionado, finalmente
pulsamos el botn Next >




Escribimos un paquete llamado demo para agrupar las clases que se van autogenerar, tambin
debemos pulsar clic en el botn Create Persistente Unit, en el cuadro de dialogo pulsamos
create. Pulse clic en el botn finalizar para terminar

Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
16



Con esto tenemos dos clases creados de tipos persistentes, la clase Escuela y la clase
Facultad.



El cdigo fuente de la clase Escuela.java

Nombre del
paquete a
crearse
Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
17
2. Ahora nos toca crear los JSF Pages a partir de las clases creadas, para ello pulsar clic
derecho sobre la carpeta Web Pages, seleccionamos del sub men la opcin New JSP
Pages from Entity Class







Seleccionamos las clases de donde se crearn los JSF, pulsando clic en el botn Add All >>,
pulsamos Next.













Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
18
Nos aseguramos que el paquete sea demo Pulsamos clic en el botn fins.




Con esto hemos creado todos los JSF y los controladores que nos permitirn gestionar las
tablas escuela y facultad, como podrs observar, ahora tenemos dentro de Web Page los
paquetes escuela y Facultad, dentro de ellos tenemos los jsps Detail, Edit, List, y New que
incluyen en su cdigo sentencias de JSF, a esto lo conocemos como las vistas, del M-V-C.
Tambin contamos con dos clases EscuelaController y EscuelaConverter, la primera
representa al controlodor del M-V-C, la segunda sirve de enlace entre controladores. Las
clases creados en el punto 1 representan al modelo del M-V-C


Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
19
Vamos a cambiar los datos que se encuentran en el index.jsp.



















Por estos datos


Ejecutemos la aplicacin pulsando clic derecho sobre el proyecto y seleccionando la opcin
Run Project del men contextual.


Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
20
Pulsando clic en el link Mantenimiento de facultad tenemos la lista de facultades con los
botones de New, Edit Destroy




Si seleccionamos la opcin Edit, podremos editar los datos de la fila seleccionada pulsando clic
en Save guardaremos los datos, todo esto es administrado por FacultadController.java por
medio de los Beans creados.














Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
21
Tenemos los datos cambiados y un mensaje enviado por el Controlador





Lo mismo observamos con mantenimiento de escuela.














Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
22

Para crear una nueva escuela pulsamos New Escuela





Podemos definir la cantidad de registros a mostrar en la lista, entrando a la clase
EscuelaController.java, y all cambiamos la variable batchSze = 5;





Validacin en JSF

JSF traen validacin que se pueden hacer a campos de ingreso, de tal forma que no tengas
que programar la validacin de la misma. Analicemos New.jsp del paquete Facultad.




Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
23




Para validar el campo de ingreso de datos sea obligatorio bastar con poner la propiedad
required=true. Para validar la longitud del ingreso de un campo tenemos que utilizar la
etiqueta <f:validateLength



Para validar un rango de ingreso de datos, como por ejemplo [0-1500]



Con esto tambin estamos validando que el dato ingresado sea de tipo Entero.
Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
24



Observemos ahora el archivo faces-config.xml

Este fichero es donde configuramos JSF. Es como el pegamento que une modelo, vista y
controlador. En este fichero por un lado declaramos los beans que vamos a utilizar para
recoger la informacin de los formularios, y por otro lado las reglas de navegacin.


Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
25

Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
26






Java Server Faces (JSF) NetBeans 5.5
Copyright Wilder Lpez M.
27
III. Conclusiones.

Como habrn notado no tuvimos que trabajar con HttpSession. HttpRequest, como tienen los
servlets, pero esto no es necesario en JSF.

Hemos trabajado generando las cosas a partir de una tabla de BD, y luego metimos mano en el
cdigo para darle forma y validaciones, esto es fastidioso para alguno desarrolladores que
vienen de Microsoft.

Existen Entornos que nos permiten trabajar directamente los datos del diseo, tal como lo hace
Swing, NetBeans cuenta con el Visual Web Aplicattion, tambin existe el jCreator que tren
incluido el Framework JSF.

Los Frameworks nos ahorran tiempo a la hora de desarrollar una aplicacin WEB, pero
debemos comprender tambin que quedamos atados al mismo.

Es muy importante tener definidos nuestra bases de datos a la hora de desarrollar aplicaciones
Web, tambin es importante trabajar en forma nativa con la conexin.

Queda como parte de Ud. Investigar ms sobre este Frameworks para ir probando su
productividad, estoy seguro que los nuevos desarrolladores lo adoptarn sin ningn
inconveniente

En nuestro pas el Framework ms utilizado es el Struts, y migrar a otro demanda muchos
recursos econmicos y tiempo, algo que las empresas no estn dispuestos a invertir.














1
Acerca del Autor


Director de la Oficina General de Sistemas e Informtica Universidad Nacional de Ucayali
Docente Universitario en J2EE y J2SE.
Actualmente dirige varios proyectos de desarrollo de software WEB en J2EE
Cuenta con 10 aos de experiencia en el rea de Desarrollo de Software, dedicando los
ltimos 04 aos al uso exclusivo de la tecnologa JAVA
Propulsor del uso de la tecnologa Java para el desarrollo de software WEB
El Sr. Lpez es Ingeniero de Sistemas titulado por la Universidad Privada del Norte -
Trujillo - Per