📂 Archivo técnico
Este contenido lo publiqué en un blog anterior durante mis primeros proyectos. Hoy lo conservo aquí como referencia y ejemplo práctico para quienes quieran reforzar la lógica de programación.
En esta entrada vamos a aprender a crear una aplicación Java web totalmente desde cero, la cual se conectará a una base de datos MySQL para poder realizar un login (inicio de sesión). La información de los usuarios estará almacenada en una base de datos.
Nos vamos a basar en el modelo de programación por capas, es decir, la aplicación estará estructurada en varias capas para poder tener todos los componentes separados y mejor organizados. Las capas en las que estará dividida nuestra aplicación son las siguientes:
- Capa de presentación
- Capa de acceso a datos
- Capa de lógica de negocios
- Capa de configuración
Para el front de la página se usarán las librerías JQuery, Bootstrap y Bootstrapvalidator además de hojas de estilos personalizadas (css).
Pretendo dividir todas las explicaciones en varias publicaciones y centrarme en los aspectos prácticos. Si necesitan reforzar algunos conceptos les invito a revisar la documentación y la web ya que allí abundan por montones 😉
Con respecto a las explicaciones prácticas procuraré ser lo más detallado posible tanto en el uso de las herramientas como en la construcción de la aplicación en sí.
Las herramientas que vamos a utilizar son:
- IDE Eclipse JEE: Donde escribiremos el código, realizaremos la compilación y ejecución del mismo.
- MySQL y MySQL Workbench 6: para la gestión y creación de la base de datos y tablas de una manera visual.
- Conector MySQL-Java 5.1.47: Es el driver que permite que Java pueda «conversar» con MySQL.
- Tomcat 8.5: Motor para la ejecución de JSPs y Servlets
- Java jdk v7, 8: Contiene el compilador y la máquina virtual de Java
Si aún no sabes como instalar Java o Eclipse, hace unos años creé una entrada con información que te puede ser útil: como-programar-en-java-instalacion-del-ide-eclipse.
Además, hace unos años hice dos videotutoriales en donde expliqué a detalle cómo realizar una conexión entre una aplicación Java simple y una base de datos en MySQL totalmente desde cero: .
Cómo conectar una aplicación Java (Eclipse) con una Base de Datos MySQL
Lo recomiendo mucho para que tengan una base más sólida para lo que se va a explicar aquí.
Contenido
ToggleCreación de la base de datos y de la tabla usuario
Vamos a ejecutar el script SQL que se deja debajo para la creación de:
- La base de datos bd_sistema
- La tabla usuario.
Pueden ejecutar el script directamente o sino hacer la creación mediante la interfaz gráfica de MySQL Workbench tal y como se explica en el video número 1 que está más arriba de esta entrada.
Adicionalmente, se muestran las sentencias SQL INSERT que permiten registrar 3 cuentas de usuario de prueba en la tabla usuario.
CREATE DATABASE IF NOT EXISTS `bd_sistema`;
USE `bd_sistema`;
CREATE TABLE `usuario` (
`idusuario` int(11) NOT NULL AUTO_INCREMENT,
`nombre` varchar(45) NOT NULL,
`clave` varchar(45) NOT NULL,
PRIMARY KEY (`idusuario`)
);
INSERT INTO `usuario` VALUES (1,'jose','123'),(2,'jorge','456'),(3,'james','789');
Cambiar la perspectiva de Eclipse a Java EE
Antes de continuar, vamos a asegurarnos de que nuestro IDE Eclipse esté situado en la perspectiva Java EE. Para ello, hacemos clic en el menú Window / Perspective / Open Perspective / Other…
Aparecerá una ventana llamada Open Perspective en la cual seleccionaremos la opción Java EE (default) y por último damos clic en el botón Open.
Otra manera para abrir la ventana de Perspectivas de eclipse es haciendo clic en el botón «Open perspective» situado en la esquina superior derecha del IDE
Descarga y configuración de Tomcat
Con el objetivo de descargar Tomcat nos dirigimos a la página oficial http://tomcat.apache.org/ y para este tutorial nos descargaremos la versión 8.5. Para ello, en el panel izquierdo de la página debemos seleccionar la versión Tomcat 8. Cuando la página termine de cargar, veremos varias zonas:
- Tomcat 8 Software Downloads
- Quick Navigation
- Mirrors
- 8.5.59 (Esta es la versión de tomcat 8 en el momento y tal vez en un futuro esto cambie)
Dentro de 8.5.59 Habrá una subzona llamada Binary Distributions la cual a su vez tiene varias secciones: Core, Full documentation, deployer, extras, etc. Los links que nos interesan se ubican en la sección Core. Allí vamos a elegir entre descargar la versión de 32 o 64 bits. Para este tutorial usaremos la de 64 bits por lo tanto haremos clic en 64-bit Windows zip (pgp, sha512) para que empiece la descarga.
Habrá que descargarlo en cualquier ubicación de la PC y luego descomprimir el zip. Luego queda configurar Eclipse para que pueda utilizar el Tomcat que acabamos de descargar y podamos trabajar con páginas JSPs y Servlets.
Configuración de Eclipse con Tomcat
- Ubicamos la pestaña Servers
- En un área vacía hacemos clic derecho, elegirmos New / Server
Se nos abrirá una ventana llamada «New Server«. Nos dirigimos hacia la lista de tipos de servidores y buscaremos el que diga «Apache», hacemos clic en él para desplegar la sublista y seleccionaremos la opción «Tomcar v8.5 Server» para posteriormente hacer clic en el botón Next.
Ahora damos clic en el botón «Browse» para poder seleccionar la ruta donde se encuentra la carpeta descomprimida de Tomcat que acabamos de descargar.
Nos ubicamos en la carpeta descomprimida de Tomcat y luego hacemos clic en el botón «Seleccionar carpeta»
Una vez que hemos seleccionado la carpeta de Tomcat solo nos queda hacer clic en el botón «Finish»
Dentro de la sección «Servers» aparecerá el servidor Tomcat 8.5 cuyo estado inicial es «Stopped»
Para iniciar el servidor y probar que funcione correctamente hacemos clic derecho sobre él y luego elegimos la opción «Start»
Si todo sale bien, se podrá apreciar que el servidor Tomcar 8.5 ahora tiene el estado «Started», eso quiere decir que está funcionando de forma correcta. Ahora ya tenemos el Eclipse listo para poder crear nuestras aplicación Java Web
Creación de la aplicación Java Web
Aparecerá una ventana llamada «New Dynamic Web Project».
Dentro de Project name pondremos un nombre al proyecto, que para este caso será «JavaWeb«.
En Target runtime debemos asegurarnos de que se encuentre seleccionado Apache Tomcat v8.5 el cual ya fue configurado en pasos anteriores. Luego damos clic en el botón «Finish«.
Descarga y configuración del conector MySQL
El conector de MySQL permitirá que haya comunicación entre la aplicación Java web que estamos implementando y el motor de MySQL el cual contiene la base de datos junto con la tabla que hemos creado. Habrá que descargarlo e importarlo en nuestro proyecto web. Este es el link para poder descargarlo:
https://dev.mysql.com/get/Downloads/Connector-J/mysql-connector-java-5.1.47.zip
Luego de descargar el conector MySQL-Java deberán descomprimir el archivo. Dentro de la carpeta descomprimida habrá un archivo Jar llamado «mysql-connector-java-5.1.47.jar»
Copian (ctrl + c) el archivo jar señalado anteriormente y lo pegan dentro de la carpeta lib del proyecto web en Eclipse (ctrl + v)
Ruta completa:
WebContent/WEB-INF/lib
Puede que no encuentren la carpeta WebContent. En ese caso, lo más seguro es que tengan la estructura de directorios siguiente: src/main/webapp y dentro encuentren a WEB-INF/lib siendo la ruta completa: src/main/webapp/web-inf/lib
Clase Conexión.java para la conexión con la base de datos
Crearemos un paquete llamado «conexion» y dentro de ella una clase java llamada Conexion que tendrá el código para realizar la conexión con la base de datos que creamos al inicio. Esta clase será reutilizada en varias partes de nuestro proyecto java web.
Haremos clic derecho en la carpeta src y elegimos New / Package.
Obs: Si usan versiones actuales del IDE, tendrán que hacer clic derecho en src/main/java.
package conexion;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;
public class Conexion {
private static final String CONTROLADOR = "com.mysql.jdbc.Driver";
private static final String URL = "jdbc:mysql://localhost:3306/bd_sistema";
private static final String USUARIO = "root";
private static final String CLAVE = "mysql";
static {
try {
Class.forName(CONTROLADOR);
} catch (ClassNotFoundException e) {
System.out.println("Error al cargar el controlador");
e.printStackTrace();
}
}
public static Connection getConexion() {
Connection conexion = null;
try {
conexion = DriverManager.getConnection(URL, USUARIO, CLAVE);
System.out.println("Conexión OK");
} catch (SQLException e) {
System.out.println("Error en la conexión");
e.printStackTrace();
}
return conexion;
}
}
Temporalmente crearemos un paquete llamado «test» y dentro una clase java de prueba llamada TConexion.java con la cual probaremos que la clase Conexion permita realizar conexiones existosas con la base de datos bd_sistema.
package test;
import conexion.Conexion;
public class TConexion {
public static void main(String[] args) {
Conexion.getConexion();
}
}
Para ejecutar esta última clase TConexion, hacemos clic derecho sobre la clase TConexion y elegimos Run As/Java Application
Si todo se realizó de forma correcta, en la Consola deberá aparecer el mensaje «Conexión Ok»
Hasta aquí termina la primera parte de esta entrada: Login en Java web (JSP’s y Servlets) y MySQL en N capas.
Lista completa de publicaciones sobre Login en Java Web y MySQL usando JSP’s y Servlets:
Parte 1: Login en Java web y MySQL – N capas (JSP’s y Servlets) Parte 1 – 4
Parte 2: Login en Java web y MySQL – N capas (JSP’s y Servlets) Parte 2 – 4
Parte 3: Login en Java web y MySQL – N capas (JSP’s y Servlets) Parte 3 – 4
Parte 4: Login en Java web y MySQL – N capas (JSP’s y Servlets) Parte 4 – 4

