Conecta una base de datos a JavaScript

Antes de entrar en detalles sobre cómo hacer una conexión local a la base de datos, es necesario entender un concepto muy importante en Arquitectura de Software, el MVC (Modelo-Vista-Controlador).

¿Qué es MVC?

MVC es un patrón arquitectónico para optimizar la comunicación de tu aplicación con la base de datos. Normalmente, dividimos la aplicación en tres capas: Modelo, Vista y Controlador y, a través de estas capas, realizamos solicitudes y cambios en nuestra base de datos.

Aunque todavía es posible abstraer el código en más de tres capas, la mayoría de los programadores prefieren seguir con el patrón original para evitar que el código se vuelva demasiado complejo.

Este concepto es fundamental para cualquier desarrollador que se inicia en el estudio del Backend y es un patrón utilizado en software de varias empresas. Entonces, ahora que tenemos la comprensión básica de la arquitectura de software, podrás entender a detalle todas las capas de un MVC. Luego, te enseñaré cómo crear una aplicación usando MVC.

Capa Model (Modelo de Negocio)

La capa Model o Modelo es responsable de comunicarse con la base de datos. Gestiona y controla los datos de la aplicación a través de funciones, pudiendo editar, añadir o realizar solicitudes de datos (todo ello siguiendo la lógica de la función creada).

Capa Controller

La aplicación utiliza la capa de Control para llamar funciones desde la capa Modelo. A veces, usamos una capa de servicios en el medio que se encarga de validar datos, devolver errores, entre otros problemas que a algunos les gusta abstraer de la lógica del controlador.

Capa View

La capa View sería la encargada de mostrar visualmente los datos que obtenemos de la base de datos en formato JSON o en una estructura HTML. Esta capa generalmente se deja al desarrollador Frontend.

Crear una aplicación con base de datos

Después de comprender las capas de comunicación de la aplicación, es posible consumir y editar la base de datos de una manera mucho más optimizada y refinada. Para explicar mejor este concepto, se creará una aplicación que siga el patrón en la práctica. Para empezar, ingresaremos al MySQL Workbench y crearemos una base de datos con algunos ya ingresados.

Como el objetivo del artículo es ejemplificar la comunicación con la base de datos, no se explicará en detalle la creación de la base de datos. Sin embargo, para una mejor comprensión, tenemos el diagrama de las tablas creadas:

Ya creada la base de datos es posible acceder a ella a través de nuestra aplicación, pero para eso será necesario crear el servidor, crear un directorio e instalar las dependencias siguiendo el paso a paso a continuación:

mkdir my_first_app_with_database

cd my_first_app_with_database

touch .env

npm init -y

npm install express

npm install dotenv

npm install mysql2

Con las dependencias instaladas, creamos el archivo app.js con el siguiente contenido:

src/app.js

El express permite hacer peticiones a la base de datos y luego se creará el controlador que importamos. Sin embargo su función es sacar datos de los gestores.

El bodyParser es responsable de permitir que los datos pasen a través del cuerpo de la solicitud. Recomiendo usar la extensión Thunder Client en tu VS Code para visualizar mejor su funcionamiento.

Con la aplicación creada, crea el archivo server.js con el siguiente contenido:

src/server.js

Después de eso, solo se debe editar el package.json:

/package.json

Y, por último, metemos las variables de entorno en el archivo .env, el archivo encargado de que los datos utilizados solo se guarden localmente, garantizando la seguridad de la aplicación.

/.env

MYSQL_HOST=localhost

MYSQL_USER=root

MYSQL_PASSWORD=SUASENHA

MYSQL_DATABASE=CompanieDatabase

PORT=3000

HOST=localhost

Con esos archivos ya podemos insertar el comando para iniciar el servidor:

npm start

A pesar de que ya es posible ejecutar el servidor, todavía no estamos conectados a la base de datos local. Para ello, es necesario crear un archivo de conexión al directorio models:

/src/models/connection.js

El archivo creado anteriormente utiliza variables de entorno para conectarse con la base de datos localmente, la constante que se importó es la constante que nos permite enviar comandos con el lenguaje SQL directamente a través de funciones Javascript.

Con la conexión creada, se hará un modelo específico para los comandos relacionados con los gerentes.

/src/models/managersModel.js

En el archivo anterior usamos un comando SQL para datos de dos tablas diferentes. Este comando toma cada gerente y de que área es responsable y en el segundo comando insertamos un nuevo gerente en la tabla.

La Capa Model es la más importante, ya que desde ella accedemos a los datos de nuestro ejemplo.

Ahora se hará la capa de Servicios. En nuestro ejemplo, tendrá una validación simple de nombre, pero vale la pena estudiar más esta capa para proyectos futuros.

/src/services/managersServices.js

Por último, la capa que usamos para llamar a los comandos: la capa Controlador.

/src/controllers/managerController.js

Con todos los archivos listos ejecutamos de nuevo el comando npm start o el comando npm run debug.

Con el servidor corriendo al intentar acceder a http://localhost:3000/managers, tendremos un retorno visual en formato JSON y podremos usar el objeto devuelto en nuestra aplicación Frontend.

Es importante entender que podemos ejecutar cualquier instrucción SQL en nuestra capa Model y crear cualquier función dentro de los límites establecidos del lenguaje. En nuestro ejemplo, podemos crear nuevos empleados, nuevos gerentes, editar datos en cualquier tabla y eliminar datos, entre muchas otras características. Recomiendo tratar de desarrollar otras funciones para la aplicación por ti mismo/a.

Conclusión

Conectar su aplicación a una base de datos local es solo el comienzo. el uso de variables de entorno hace que la transición al consumo de datos de la base de datos desde un servidor alojado en línea sea mucho más simple. Es decir, aprender sobre arquitectura de software y cómo manipular una base de datos usando su lenguaje es extremadamente importante para cualquier desarrollador de Backend y, con el tiempo, puede usarse para un sinfín de posibilidades.


¡Hasta luego!