10-Router en Express para tu Blog-b

 

 Router en Express para tu Blog

Introducción al Router en Express

El router en Express es una herramienta poderosa que nos permite organizar nuestras rutas de manera modular y escalable. En este post, exploraremos cómo implementar un sistema de routing eficiente en nuestras aplicaciones Node.js con Express.

 
   5-EXPRESS
           |
          V
6-MIDDLEWARE
           |
          V
 7-express.static
        |
          V
           |
          V
       9-Plantilla
           |
          V
    10-Router-10-1-Rutas

Estructura Básica del Proyecto

Antes de implementar el router, veamos la estructura de nuestro proyecto:

Copy
Download
mi-app/
├── public/          # Carpeta de archivos estáticos
│   ├── css/
│   │   └── style.css
│   ├── js/
│   │   └── app.js
│   ├── 404.html
│
├── router/
│    ├── RutasWeb.js
│    ├── Mascotas.js
│
└── views
     ├── index.ejs
     ├── mascotas.ejs
     └── template/
          ├── cabecera.ejs
          └── footer.ejs

Configuración Básica del Router

Para comenzar, creamos un archivo de rutas (RutasWeb.js) donde definiremos nuestras rutas principales:

javascript        RutasWeb.js
const express = require('express');
const router = express.Router();

router.get('/', (req, res) => {
  res.render("index", {titulo: "mi titulo"})
});

router.get('/servicios', (req, res) => {
  res.render("servicios")
});

module.exports = router;

Integrando el Router en la Aplicación Principal

En nuestro archivo principal (app.js), importamos y usamos nuestras rutas:

javascript
app.js

const express = require('express');
const app = express();

// Configuraciones previas...

app.use(express.static(__dirname + "/public"));

// Rutas web
app.use('/', require('./router/RutasWeb'));

// Middleware para manejar errores 404
app.use((req, res, next) => {
  res.status(404).render("404", {
    titulo: "404",
    descripcion: "Título del sitio web"
  })
});

Prefijos de Ruta

Una ventaja importante del router es que podemos agregar prefijos a nuestras rutas:

javascript
Copy
Download
app.use('/api', require('./router/RutasWeb'));

Esto haría que nuestras rutas se accedan como:

  • localhost:3000/api/

  • localhost:3000/api/servicios

Creando un Router Específico para Mascotas

Para demostrar la modularidad, creamos un router específico para manejar mascotas:

  1. Archivo router/Mascotas.js:

javascript:router/Mascotas.js

const express = require('express');
const router = express.Router();

router.get('/', (req, res) => {
  res.render("mascotas", {
    arrayMascotas: [
      {id: 1, nombre: 'rex', descripcion: 'perro'},
      {id: 2, nombre: 'yaki', descripcion: 'gato'}
    ]
  })
});

module.exports = router;

  1. Integración en app.js:

javascript
Copy
Download
app.use('/mascotas', require('./router/Mascotas'));

Vista de Mascotas

La vista mascotas.ejs mostraría nuestros datos:

html
Copy
Download
Run
<%- include("template/cabecera") %>

<div class="container">
  <% if (arrayMascotas.length > 0) { %>
    <table>
      <% arrayMascotas.forEach(mascota => { %>
        <tr>
          <td><%= mascota.id %></td>
          <td><%= mascota.nombre %></td>
          <td><%= mascota.descripcion %></td>
        </tr>
      <% }) %>
    </table>
  <% } %>
</div>

<%- include("template/footer") %>

Beneficios de Usar Router

  1. Organización del código: Mantenemos las rutas relacionadas juntas en archivos separados.

  2. Escalabilidad: Podemos añadir nuevas rutas sin saturar el archivo principal.

  3. Prefijos: Facilidad para versionar APIs o agrupar rutas bajo un mismo path.

  4. Mantenibilidad: Más fácil de entender y modificar.

Conclusión

El sistema de routing en Express es fundamental para construir aplicaciones web organizadas y mantenibles. Al modularizar nuestras rutas, mejoramos la estructura del proyecto y facilitamos su crecimiento futuro.

¿Has implementado routers en tus proyectos de Express? ¡Comparte tus experiencias en los comentarios!

Express Router: Domina el Enrutamiento Profesional en Node.js

🔍 ¿Qué es Express Router?

El Router de Express es un sistema modular para:

  • Organizar rutas en archivos separados

  • Estructurar mejor aplicaciones grandes

  • Crear mini-aplicaciones con su propio middleware

  • Jerarquizar rutas con prefijos comunes

Diagrama de Router Express

🛠️ Configuración Básica

1. Estructura de proyecto recomendada

Copy
Download
mi-app/
├── routes/
│   ├── users.js
│   ├── products.js
│   └── api/
│       └── v1/
│           ├── auth.js
│           └── posts.js
└── app.js

2. Ejemplo básico (users.js)

javascript
Copy
Download
// Importar Router
const express = require('express');
const router = express.Router();

// Rutas
router.get('/', (req, res) => {
  res.send('Lista de usuarios');
});

router.get('/:id', (req, res) => {
  res.send(`Detalles del usuario ${req.params.id}`);
});

// Exportar Router
module.exports = router;

3. Conexión en app.js

javascript
Copy
Download
const usersRouter = require('./routes/users');

app.use('/usuarios', usersRouter);
// Ahora:
// GET /usuarios → Lista de usuarios
// GET /usuarios/5 → Detalles del usuario 5

💡 Características Clave

1. Middleware específico

javascript
Copy
Download
// Solo aplica a este router
router.use((req, res, next) => {
  console.log('Middleware solo para rutas de productos');
  next();
});

2. Jerarquía de rutas

javascript
Copy
Download
// routes/api/v1/posts.js
const router = express.Router();

router.get('/featured', (req, res) => {
  res.send('Posts destacados');
});

// En app.js
app.use('/api/v1/posts', require('./routes/api/v1/posts'));
// Ruta final: /api/v1/posts/featured

3. Manejo de verbos HTTP

javascript
Copy
Download
router.route('/libros/:id')
  .get((req, res) => { /* Obtener libro */ })
  .put((req, res) => { /* Actualizar libro */ })
  .delete((req, res) => { /* Eliminar libro */ });

🏗️ Ejemplo Completo: Sistema de Blog

1. posts.js (routes)

javascript
Copy
Download
const express = require('express');
const router = express.Router();

// Middleware solo para posts
router.use((req, res, next) => {
  console.log('Time:', Date.now());
  next();
});

// GET /posts/
router.get('/', (req, res) => {
  res.send('Listado de posts');
});

// GET /posts/:id
router.get('/:id', (req, res) => {
  res.send(`Detalles del post ${req.params.id}`);
});

module.exports = router;

2. app.js (principal)

javascript
Copy
Download
const express = require('express');
const postsRouter = require('./routes/posts');

const app = express();

// Montar el router bajo /posts
app.use('/posts', postsRouter);

app.listen(3000, () => {
  console.log('Servidor corriendo en puerto 3000');
});

🚀 Patrones Avanzados

1. Controladores separados

javascript
Copy
Download
// controllers/userController.js
exports.list = (req, res) => {
  res.send('Lista de usuarios');
};

exports.detail = (req, res) => {
  res.send(`Usuario ${req.params.id}`);
};

// routes/users.js
const { list, detail } = require('../controllers/userController');

router.get('/', list);
router.get('/:id', detail);

2. Validación con middleware

javascript
Copy
Download
// Middleware de validación
const validateUserId = (req, res, next) => {
  if(!isValidId(req.params.id)) {
    return res.status(400).send('ID inválido');
  }
  next();
};

// Aplicar a rutas específicas
router.get('/:id', validateUserId, userController.detail);

📌 Mejores Prácticas

  1. Separa rutas por dominio (users, products, etc.)

  2. Usa prefijos lógicos (/api, /admin)

  3. Mantén los controladores delgados

  4. Documenta tus rutas con comentarios

  5. Usa middleware específico cuando sea necesario

🔥 Ejemplo Real: API REST

javascript
Copy
Download
// routes/api/users.js
const router = express.Router();

router.get('/', userController.list);
router.post('/', userController.create);
router.get('/:id', userController.get);
router.put('/:id', userController.update);
router.delete('/:id', userController.delete);

module.exports = router;

// En app.js
app.use('/api/users', require('./routes/api/users'));

💡 Conclusión

Express Router te permite:
✅ Escalar aplicaciones fácilmente
✅ Mantener código organizado
✅ Reutilizar lógica de rutas
✅ Crear APIs bien estructuradas

Próximo paso: Combínalo con express-validator para validación robusta de datos en tus rutas.

bash
Copy
Download
npm install express-validator

¿Listo para llevar tu backend al siguiente nivel? ¡El Router es tu mejor aliado! 🚀

Comentarios

Publicar un comentario

Entradas más populares de este blog

9-Nuestra Primera Plantilla con EJS

Imagen
  Creando Nuestra Primera Plantilla con EJS y Express   5- EXPRESS            |           V 6- MIDDLEWARE            |           V 7- express.static            |           V 8- Motor de plantilla            |           V      9-Plantilla mi-app/ ├── public/ # Archivos estáticos (opcional) │ ├── css/ │ │ └── style.css │ ├── js/ │ │ └── app.js │ └── images/ │ └── logo.png ├── views/ # Carpeta para las plantillas EJS (obligatoria) │ ├── index.ejs # Vista principal │ └── partials/ # Fragmentos reutilizables (opcional) │ ├── header.ejs │ └── footer.ejs ├── app.js # Archivo principal de la aplicación └── package.json # Configuración del proyecto En este post, aprenderemos...
Leer más

6-Middleware?

Imagen
  Middleware en Node.js con Express: Guía Definitiva      5- EXPRESS            |           V 6-MIDDLEWARE ¿Qué es un Middleware? mi-app/ ├ app.js └── package.json El middleware son  funciones intermedias  que procesan las solicitudes ( req ) y respuestas ( res ) en tu aplicación Express. Actúan como "puentes" entre la recepción de una petición y el envío de la respuesta final. 🔧 Tipos de Middleware 1.  Middleware de Aplicación Se ejecutan en  todas las rutas : javascript Copy Download app . use ( ( req , res , next ) => { console . log ( 'Middleware global' ) ; next ( ) ; // ¡No olvides next()! } ) ; 2.  Middleware de Ruta Específicos para ciertas rutas: javascript Copy Download app . get ( '/ruta' , ( req , res , next ) => { console . log ( 'Middleware solo para /ruta' ) ; next ( ) ; } ) ; 3.  Middleware de Terceros Paquetes externos como  body-...
Leer más

Cómo Iniciar un Proyecto Node.js

  Cómo Iniciar un Proyecto Node.js desde Cero: Guía Paso a Paso Solución 1: Cambiar la política de ejecución (recomendado) Abre PowerShell  como administrador . Ejecuta este comando para permitir la ejecución de scripts firmados: powershell Copy Download Set-ExecutionPolicy RemoteSigned - Scope CurrentUser Si estás comenzando con Node.js, esta guía te mostrará cómo configurar un proyecto básico con las herramientas esenciales. Paso 1: Inicializar el proyecto bash Copy Download npm init --yes Este comando crea automáticamente un archivo  package.json  con valores predeterminados. El  package.json  es el corazón de tu proyecto Node.js, donde se almacenan: Dependencias del proyecto Scripts personalizados Metadatos del proyecto (nombre, versión, descripción, etc.) Paso 2: Instalar dependencias esenciales Express - El framework web bash Copy Download npm install express Express es el framework web más popular para Node.js. Te permite: Crear rutas (endpoints)...
Leer más