Cómo crear un CRUD en Java Web con JSP y Servlet

Hola que tal, bienvenido a este nuevo artículo, en donde aprenderás cómo crear un CRUD en Java Web con JSP y Servlet.

Para este ejercicio usaremos Maven para la gestión de librerías, aclarar también que si bien es cierto que el CRUD es de una sola tabla, el tutorial es muy práctico ya que te da las bases para que tu continúes de forma autodidacta aplicando esos conocimientos en un proyecto más grande.

Que necesitas?

Tener instalado Java 8, descargar Eclipse Neon y configurado con Apache Tomcat, si no tienes instalado nada de lo anterior, puedes hacerlo revisando estos tutoriales: Instalar Java 8, Consola VS IDEIntegrar Apache en Eclipse.

Tener instalado MySQL con algún entorno para poder administrarlos bien sea phpMyadmin o MySQL Workbench, si no tienes instalado, puedes revisar estos tutoriales: Instalar MySQL y MySQL WORKBENCH en Windows 10 o bien Cómo instalar WampServer en Windows 10

Hoja de ruta de lo que vamos hacer

Crear la base de datos con la tabla artículos.

Crear el proyecto Web.

Convertir el proyecto Web a Maven y configurar el archivo pom.xml.

Definir la conexión a la base de datos usando el archivo web.xml

Crear el modelo para la tabla artículos.

Crear la clase DAO (métodos CRUD) y Controlador.

Crear las Vistas.

De momento dejo una vista previa de como va quedar la vista principal de proyecto.

Crear la base de datos y la tabla artículos

Para crear la base de datos junto con la tabla, bien puedes hacerlo de forma gráfica o usar el siguiente script Descarga Script. La tabla artículos tiene 5 campos (id, codigo, nombre, descripcion, existencia, precio) que hacen referencia al artículo, la clave primaria es el campo id y es un campo auto numérico.

Recuerda que antes de ejecutar el script para crear la tabla, debes crear la base de datos y esta debe llamarse javaweb_crud.

Estructura completa del Proyecto

Esta es la estructura del proyecto que debe quedar al final del tutorial y que la iré explicando en el transcurso del mismo.

Crear el Web Dynamic Project

Como la idea de este artículo es aprender un poco de Java Web con JSP y Servlet vamos a crear un proyecto Web Dynamic Project, como se muestra en la siguiente imagen.

Si no lo encuentras en en esa opción, pincha al final en la opción Other->Web->Dynamic Web Project, lo siguiente es darle el nombre el proyecto y crearlo.

Es importante que en el proyecto, la versión de Servlet sea la 3.1 y que esté atado al contenedor de Servlet Apache Tomcat.

Finalmente el proyecto quedaría como se muestra a continuación.

Convertir el Proyecto a Maven

La idea de usar Maven en un proyecto es poder gestionar el uso de librerías que va utilizar la aplicación, por lo que ya no tenemos que descargar los .jar, sino que Maven lo hará por nosotros, sólo bastará con indicarle en el archivo pom.xml, las librerías que vayamos a usar. En las siguientes imágenes, te muestro paso a paso como hacerlo, primero debes dar click derecho sobre el proyecto y luego seguir la imagen.

Te va pedir algunos datos con respeto al proyecto Maven.

Ahora la vista del proyecto quedará de la siguiente manera, el archivo pom.xml es donde añadiremos las dependencias del proyecto, que son las librerías que vamos a usar.

Finalmente se añade las dependencias al archivo pom.xml (jstl, jsp, servlet y MySQL) de manera que traiga las librerías desde su repositorio (las dependencias deben estar entre la etiqueta <description> y <build>).

Una vez agregadas las dependencias debemos actualizar el proyecto de manera que los cambios surjan efectos.

Te va indicar que proyecto se va actualizar y le das OK. Al actualizar el proyecto se descargarán automáticamente las librerías a utilizar de modo que ahora el proyecto quedará como en la siguiente imagen.

Crear el archivo web.xml

Con la versión anterior a la 3.1 (Servlet) este archivo se generaba automáticamente, puesto que ahí se mapeaba todo lo referente a la configuración de los Servlets, con la versión 3.1 todo se lo hace con anotaciones dentro del mismo Servlet. Pues bien, dicho lo anterior, es necesario crear el archivo web.xml ya que vamos a cargar ahí las configuraciones para el acceso a la base de datos, hacemos esto por se una buena práctica, en cuanto a seguridades se refiere.

Como te mencionaba, aquí vamos a cargar tanto la URL de conexión, así como el usuario y la clave, de tal manera que en las clases donde se acceda a la conexión sólo llamaremos a los atributos del archivo web.xml, la configuración del archivo debe quedar como sigue, no olvides que debes cambiar tu usuario y clave para entrar a MySQL.

Crear la clase para la conexión

La clase para la conexión queda de la siguiente manera, básicamente lo que se hace es crear la conexión con los parámetros pasados desde el archivo web.xml, la clase contiene dos métodos, uno para conectar y otro para desconectar, se añade también el acceso a la variable de la conexión jdbcConnection, de manera que se la pueda obtener desde cualquier parte del DAO, la clase debe estar dentro del paquete com.ecodeup.articulos.model.

Crear la clase Articulo para el modelo 

Esta clase contiene los atributos para mapear el objeto hacia la tabla de la base de datos y debe estar dentro del paquete com.ecodeup.articulos.model

Crear la clase lo métodos CRUD para la tabla artículos

Esta clase contiene todos los métodos CRUD para la tabla artículos y está organizada de la siguiente manera, esta clase debe estar dentro del paquete com.ecodeup.articulos.dao.

Crear el Servlet que sirve de controlador

El Servlet se llama AdminArticulo, y se encuentra dentro del paquete com.ecodeup.articulos.controller.

En el Servlet manejamos todas las peticiones como por ejemplo para crear un nuevo artículo, actualizar  y eliminar.

Crear las vistas para el ejemplo

Las vistas son simples archivos con extensión .jsp, en las cuales usamos JSTL (Java Server Pages Tag Library) que no son más que etiquetas y que nos permiten manipular o embeber código java dentro de una pagína JSP.

Para poder hacer uso de estas etiquetas, se debe incluir una declaración en el inicio de la página JSP donde vayamos a usarlas (línea 4), en este caso pongo como ejemplo la página mostrar.jsp que está dentro de la carpeta vista y que muestra todos los artículos, finalmente recordar que (a excepción de la página index.jsp) las páginas JSP están dentro de la carpeta vista.

Las demás vistas, index.jsp, register.jsp y editar.jsp las puedes descargar del proyecto completo, del siguiente enlace Descargar Proyecto Completo.

Finalmente te dejo una imagen de como se muestran los artículos ingresados junto con sus respectivas acciones, tanto de editar como de eliminar. 

Espero haya sido de ayuda, si tienes alguna pregunta, la puedes hacer en la parte de comentarios, nos vemos en la próxima entrada.

Si quieres seguir el tema de programación Web con Java puedes revisar los siguientes enlaces:

Opt In Image
Te gusta la Programación Web?
Suscríbete ahora y recibe los mejores contenidos sobre Programación Web con Java y PHP en tu correo.

Tus datos estarán protegidos y 100% libre de Spam

Compartir en:Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn

Desarrollador Web con Java y PHP, Blogger, aprendiendo y compartiendo conocimientos.

2 comentarios sobre el tema “Cómo crear un CRUD en Java Web con JSP y Servlet

  1. Fernando

    Gracias por compartir, oye puedes hacer un tutorial donde expliques lo mismo solo que utilizando las vistas o mejor utilizando PrimeFaces y JasperReport 😀

    1. Elivar Largo

      Hola Fernando, lo tendré en cuenta para los próximos artículos.

Deja un Comentario