Programación Web
Programación del Lado del Servidor
Conectando la API REST a una Base de Datos (SQL)
“Cada sitio web comienza con una
simple idea y unas líneas de código;
lo demás es imaginación y esfuerzo.”
Información del Docente
• Nombre: Prof. Marco Antonio Cabrera Rufino.
• Correo Electrónico: epad_instructor19@queretaro.tecnm.mx.
• Horario de Clases: Lunes, Miércoles y Viernes de 8:00 a
10:00 am.
• Horario de Consulta: (El docente lo agregará).
MySQL
MySQL es un sistema de gestión de bases de datos relacionales
(RDBMS) que utiliza SQL (Structured Query Language) para gestionar
datos.
• Es rápido, escalable y seguro, siendo una opción popular para
aplicaciones web.
• Es de código abierto y compatible con múltiples plataformas.
Casos de uso:
Aplicaciones web (Ej. WordPress, Facebook).
Sistemas de gestión empresarial (ERP, CRM).
Aplicaciones de comercio electrónico (Amazon, Mercado Libre).
Conceptos Clave en MySQL
Concepto Descripción
Base de datos Conjunto organizado de datos.
Tabla Contenedor de datos estructurados en filas y columnas.
Define el tipo de datos almacenados (Ej. nombre
Columna
VARCHAR(255)).
Fila (Registro) Entrada de datos en una tabla.
Clave primaria
Identificador único de cada registro.
(PRIMARY KEY)
Clave foránea (FOREIGN
Relación entre dos tablas.
KEY)
Consulta (QUERY) Petición en SQL para manipular datos.
Instalar MySQL
Descargar e instalar MySQL:
Descarga MySQL desde https://dev.mysql.com/downloads/
Durante la instalación, configura:
Modo de autenticación: Recomendado "Legacy Authentication".
Usuario y contraseña: root / (tu contraseña).
Verificar instalación:
Abre la terminal y ejecuta:
mysql -u root -p
Instalar MySQL
Descargar e instalar MySQL:
Descarga MySQL desde https://dev.mysql.com/downloads/
Durante la instalación, configura:
Modo de autenticación: Recomendado "Legacy Authentication".
Usuario y contraseña: root / (tu contraseña).
Verificar instalación:
Abre la terminal y ejecuta:
mysql -u root -p
Instalar MySQL
Ejecuta este comando en CMD para ver si MySQL está instalado:
where mysql
Si devuelve una ruta, MySQL está instalado pero no configurado
correctamente.
Si dice "No se encuentra", significa que MySQL no está instalado o no
está en la variable de entorno.
Si MySQL está instalado pero CMD no lo reconoce, sigue estos pasos:
1. Encuentra la ruta de instalación de MySQL
Por defecto, MySQL se instala en:
C:\Program Files\MySQL\MySQL Server 8.0\bin
o
C:\Program Files\MySQL\MySQL Server 5.7\bin
Creación de una Base de Datos
y una Tabla
1. Crear una base de datos:
CREATE DATABASE tienda;
USE tienda;
2. Crear una tabla de productos:
CREATE TABLE productos (
id INT AUTO_INCREMENT PRIMARY KEY,
nombre VARCHAR(255) NOT NULL,
precio DECIMAL(10,2) NOT NULL
);
Creación de una Base de Datos
y una Tabla
3. Insertar datos en la tabla:
INSERT INTO productos (nombre, precio) VALUES
('Laptop', 1500.00),
('Mouse', 25.99),
('Teclado', 45.50);
4. Ver los datos:
SELECT * FROM productos;
Esto mostrará una tabla con los productos insertados.
Tipos de Datos en MySQL
Tipo de Dato Descripción Ejemplo
INT Números enteros 10, 50, 1000
DECIMAL(m, Números decimales con m dígitos y d
100.50
d) decimales
VARCHAR(n) Texto de longitud n "Juan", "Producto A"
"Descripción
TEXT Texto largo
extensa..."
DATE Fecha (YYYY-MM-DD) 2024-03-10
BOOLEAN 0 (falso) o 1 (verdadero) 1
Relaciones en MySQL
Las bases de datos relacionales permiten relacionar tablas con claves foráneas (FOREIGN
KEY).
Ejemplo: Relación entre productos y categorías
CREATE TABLE categorias (
id INT AUTO_INCREMENT PRIMARY KEY,
nombre VARCHAR(100) NOT NULL
);
CREATE TABLE productos (
id INT AUTO_INCREMENT PRIMARY KEY,
nombre VARCHAR(255) NOT NULL,
precio DECIMAL(10,2) NOT NULL,
categoria_id INT,
FOREIGN KEY (categoria_id) REFERENCES categorias(id)
);
Esto permite que cada producto tenga una categoría
asociada.
Relaciones en MySQL
Insertar datos relacionados:
INSERT INTO categorias (nombre) VALUES ('Electrónica'),
('Ropa');
INSERT INTO productos (nombre, precio, categoria_id) VALUES
('Smartphone', 800.00, 1),
('Jeans', 50.00, 2);
Consultar productos con su categoría:
SELECT productos.nombre, productos.precio, categorias.nombre
AS categoria
FROM productos
JOIN categorias ON productos.categoria_id = categorias.id;
Esto mostrará los productos junto con su categoría.
Ejercicios Prácticos
Ejercicio 1: Crear una Base de Datos Personalizada
1.Crea una base de datos llamada empresa.
2.Dentro de empresa, crea una tabla empleados con las columnas:
•id (clave primaria, auto-incremental).
•nombre (texto, máximo 255 caracteres).
•salario (decimal, 10,2).
3.Inserta al menos tres empleados.
4.Consulta todos los empleados con:
SELECT * FROM empleados;
Ejercicios Prácticos
Ejercicio 2: Crear Relaciones entre Tablas
1.Crea una tabla departamentos:
•id (clave primaria).
•nombre (texto, 100 caracteres).
2.Modifica la tabla empleados para agregar una clave foránea departamento_id.
3.Inserta registros en ambas tablas y consulta los datos combinados.
Ejercicio 3: Operaciones Avanzadas
4.Usa UPDATE para aumentar el salario de los empleados en un 10%:
UPDATE empleados SET salario = salario * 1.10;
2.Usa DELETE para eliminar un empleado con ID específico.
Instalar
Ejecuta en la MySQL
terminal:
npm install express mysql2 dotenv cors
• mysql2: Cliente para conectar Node.js con
MySQL.
• dotenv: Para almacenar credenciales.
• cors: Para permitir conexiones desde el
frontend.
Verificar instalación:
Abre la terminal y ejecuta:
mysql -u root -p
Crear la Base de Datos en
MySQL
Abre MySQL en la terminal
Si usas la terminal:
mysql -u root -p
Ejecuta estos comandos en MySQL para crear la base de datos y la tabla de
productos:
CREATE DATABASE miDB;
USE miDB
CREATE TABLE productos (
id INT AUTO_INCREMENT PRIMARY KEY,
nombre VARCHAR(255) NOT NULL,
precio DECIMAL(10,2) NOT NULL
);
• Base de datos miDB creada.
• Tabla productos lista para almacenar datos.
Configurar Conexión a MySQL
Edita server.js y agrega la conexión a MySQL:
require('dotenv').config();
const mysql = require('mysql2');
const express = require('express');
const cors = require('cors');
const app = express();
const PORT = 3000;
app.use(cors());
app.use(express.json());
// Configuración de conexión a MySQL
const conexion = mysql.createConnection({
host: process.env.DB_HOST,
user: process.env.DB_USER,
password: process.env.DB_PASSWORD,
database: process.env.DB_NAME
});
Configurar Conexión a MySQL
Edita server.js y añade esto al inicio:
// Conectar a MySQL
conexion.connect(error => {
if (error) {
console.error("Error en conexión a MySQL:",
error);
return;
}
console.log("Conectado a MySQL");
});
Crea el archivo .env y añade:
DB_HOST=localhost
DB_USER=root
DB_PASSWORD=tu_contraseña
DB_NAME=miDB
Asegúrate de reemplazar "tu_contraseña" con la
contraseña de MySQL.
Implementar las Rutas CRUD en
Express
Añade estas rutas en server.js:
app.get('/productos', (req, res) => {
conexion.query('SELECT * FROM productos', (error, resultados) => {
if (error) {
console.error("Error al obtener productos:", error);
res.status(500).json({ mensaje: "Error en el servidor" });
} else {
res.json(resultados);
}
});
});
Implementar las Rutas CRUD en
Express
Añade estas rutas en server.js:
// Obtener un producto por ID
app.get('/productos/:id', (req, res) => {
conexion.query('SELECT * FROM productos WHERE id = ?', [req.params.id], (error,
resultados) => {
if (error) {
console.error("Error al obtener el producto:", error);
res.status(500).json({ mensaje: "Error en el servidor" });
} else if (resultados.length === 0) {
res.status(404).json({ mensaje: "Producto no encontrado" });
} else {
res.json(resultados[0]);
}
});
});
Implementar las Rutas CRUD en
Express
Añade estas rutas en server.js:
// Agregar un nuevo producto
app.post('/productos', (req, res) => {
const { nombre, precio } = req.body;
conexion.query('INSERT INTO productos (nombre, precio) VALUES (?, ?)', [nombre, precio],
(error, resultado) => {
if (error) {
console.error("Error al insertar producto:", error);
res.status(500).json({ mensaje: "Error en el servidor" });
} else {
res.status(201).json({ id: resultado.insertId, nombre, precio });
}
});
});
Implementar las Rutas CRUD en
Express
Añade estas rutas en server.js:
// Actualizar un producto
app.put('/productos/:id', (req, res) => {
const { nombre, precio } = req.body;
conexion.query('UPDATE productos SET nombre = ?, precio = ? WHERE id = ?', [nombre,
precio, req.params.id], (error) => {
if (error) {
console.error("Error al actualizar producto:", error);
res.status(500).json({ mensaje: "Error en el servidor" });
} else {
res.json({ mensaje: "Producto actualizado" });
}
});
});
Implementar las Rutas CRUD en
Express
Añade estas rutas en server.js:
// Eliminar un producto
app.delete('/productos/:id', (req, res) => {
conexion.query('DELETE FROM productos WHERE id = ?', [req.params.id], (error) => {
if (error) {
console.error("Error al eliminar producto:", error);
res.status(500).json({ mensaje: "Error en el servidor" });
} else {
res.json({ mensaje: "Producto eliminado" });
}
});
});
// Iniciar el servidor
app.listen(PORT, () => console.log(`Servidor en http://localhost:${PORT}`));
Actividad: Creación de una Página de
Clientes con Base de Datos en MySQL
Instrucciones
📌 1. Crear una nueva tabla en MySQL llamada clientes con los siguientes campos:
•id (entero, clave primaria, autoincremental).
•nombre (cadena de texto, máximo 255 caracteres).
•email (cadena de texto, único, máximo 255 caracteres).
•telefono (cadena de texto, máximo 20 caracteres).
📌 2. Implementar en server.js las siguientes rutas:
✔ GET /clientes → Obtiene todos los clientes.
✔ GET /clientes/:id → Obtiene un cliente por su ID.
✔ POST /clientes → Agrega un nuevo cliente.
✔ PUT /clientes/:id → Modifica los datos de un cliente.
✔ DELETE /clientes/:id → Elimina un cliente.
Actividad: Creación de una Página de
Clientes con Base de Datos en MySQL
Instrucciones
📌 3. Crear un archivo clientes.html que muestre una lista de clientes en una
tabla y permita agregar nuevos clientes mediante un formulario.
📌 4. Implementar un archivo clientes.js que:
•Haga una petición fetch() para obtener y mostrar los clientes en una tabla.
•Permita agregar nuevos clientes a través del formulario usando POST.
•Opcionalmente, permita eliminar clientes con un botón de eliminación.
📌 Evaluación de la Actividad
✔ Se creó correctamente la tabla clientes en MySQL.
✔ Se implementaron correctamente las rutas en Express.js.
✔ Se realizó una prueba con Postman para verificar los métodos GET, POST, PUT y DELETE.
✔ Se construyó una interfaz básica en HTML + JavaScript para mostrar y agregar clientes.
Fin del tema
Gracias
