Visualizar información dinámica en páginas web con JavaServer Faces

En esta guía de aprendizaje se enseña a diseñar un sitio Web dinámico que funciona como la sección de anuncios clasificados de un periódico. El sitio Web es una aplicación Web J2EE completa que utiliza componentes JavaServer Faces (JSF) y Objetos de datos de servicio (SDO). Esta aplicación utiliza tecnología JSF para crear páginas Web dinámicas que enlazan con una base de datos que almacena datos de anuncios clasificados. Arrastrando componente JSF a sus páginas puede crear una aplicación Web JSF conocida como aplicación CRUD porque puede crear, leer, actualizar y suprimir registros de una base de datos. Los usuarios del sitio podrán utilizar estas funciones para gestionar los anuncios clasificados en la base de datos.

Para esta guía de aprendizaje necesitará algunos componentes de instalación opcional. Para asegurarse de haber instalado los componentes opcionales adecuados, consulte la lista de requisitos del sistema.

Una vez seguida hasta el final esta guía de aprendizaje, los usuarios no sólo pueden ver los artículos a la venta sino que también pueden añadir artículos nuevos, cambiar detalles de los artículos (por ejemplo el precio o la descripción) o buscar un artículo específico. Aunque el diseño de este sitio de guía de aprendizaje es simple, los principios y tecnologías que trata también se utilizan en sitios Web más grandes y complicados.

Objetivos de aprendizaje

Esta guía de aprendizaje se divide en dos módulos, cada uno de ellos con sus propios objetivos de aprendizaje. Puede realizar cualquiera de los módulos, o ambos. Dentro de cada módulo, debe completar los ejercicios para que el sitio web funcione adecuadamente.

Módulo 1: Crear páginas web con conexiones de datos

En este módulo se enseña a configurar una conexión a una base de datos y a visualizar la información de la base de datos en una página web. En este módulo podrá:

Conectar páginas web a bases de datos.
Crear páginas que visualizan, crean, editan y suprimen registros de la base de datos.
Enviar datos de una página a otra

Módulo 2: Añadir características avanzadas

En este módulo se enseñan formas más desarrolladas en el uso de datos de la base de datos. En este módulo podrá:

Dar formato a registros de bases de datos de una página Web
Añadir un componente que permite subir archivos a una base de datos desde una página Web
Navegar de una página a otra automáticamente
Automatizar algunas tareas de administración de bases de datos

Cuando esté preparado, comience por el Módulo 1: Creación de páginas web con conexiones de datos.

Tiempo necesario

Total: 3 horas y 30 minutos

Módulo 1: 2 horas

Módulo 2: 1 hora y 30 minutos

Nivel de habilidad

Intermedio

Público

Desarrolladores de aplicación Web, diseñadores de interfaz de usuario Web

Requisitos del sistema

Para seguir esta guía de aprendizaje, primero debe instalar y configurar un servidor de tiempo de ejecución. Esta guía de aprendizaje se ha probado con los servidores siguientes:

WebSphere Application Server 6.1

Para obtener información sobre el despliegue de los SDO en servidores que no sean WebSphere Application Server, consulte Tema de ayuda: Desplegar SDO en servidores no WAS.

Esta guía de aprendizaje necesitará algunas posibilidades que no se han iniciado durante la instalación del producto. Si no encuentra las opciones de interfaz de usuario descritas en la guía de aprendizaje, asegúrese de haber habilitado las posibilidades adecuadas (Ventana > Preferencias > Posibilidades). Para poder seguir esta guía de aprendizaje, necesitará las posibilidades siguientes:

Java Developer
Web Developer (típico)
XML Developer
Database Developer
Enterprise Java Developer
Data

Para utilizar esta guía de aprendizaje, debe tener un servidor de aplicaciones instalado y configurado. Para verificar que tiene disponible un entorno de tiempo de ejecución de servidor, pulse Ventana > Preferencias, expanda Servidor y pulse Entornos de tiempo de ejecución instalados. Puede utilizar este panel para añadir, eliminar o editar definiciones de tiempo de ejecución de servidor instalados. También puede descargar e instalar el soporte para un servidor nuevo.

Prerrequisitos

Para completar esta guía de aprendizaje debe estar familiarizado con:

Conceptos básicos de diseño web, como sitios web, páginas Web, navegadores y servidores.
Cómo crear una página web estática sencilla
Los elementos de una página web, como tablas, hiperenlaces, formularios e imágenes.
Términos de bases de datos, como tablas, registros, columnas y campos.

También será de ayuda si se sabe:

Cómo utilizar las perspectivas y vistas del entorno de trabajo.
Cómo editar el código HTML para una página Web.

Resultados esperados

Una vez finalizada la aplicación Web, la página inicial tendrá el aspecto de la imagen siguiente. La navegación del sitio Web que se añade a las páginas Web a través de la plantilla del sitio, los enlaces a las páginas que permiten crear un anuncio nuevo o ver todos los anuncios. La acción de fila de la tabla que se visualiza a continuación le lleva a una página de actualización en la que puede cambiar la información asociada a un anuncio determinado.