Enrutamiento realmente básico en Node.js con Express

El objetivo de esta historia es explicar brevemente cómo funciona el enrutamiento en Express mientras se crea una aplicación de nodo simple, muy simple.

También usaremos EJS, un motor de plantillas que "le permite generar marcado HTML con JavaScript simple", según su sitio web. Básicamente, nos permitirá crear páginas HTML que pueden variar según la solicitud que realice el cliente. No usaremos esta última función, pero es excelente. Al final de este artículo, encontrará algunos recursos donde puede obtener más información.

¿Qué es el enrutamiento? (En dos líneas)

En primer lugar, echemos un vistazo rápido (realmente rápido) a qué es el enrutamiento:

somewebsite.com/someroute

Básicamente se trata de llevar al usuario (o algunos datos) de un lugar a otro. Ese lugar es la ruta. Te dije que iba a hacerlo rápido.

Creando el proyecto

Vamos a crear un sitio web elegante para aprender cómo funciona el enrutamiento en Express. Echale un vistazo:

¿Guay, verdad? Pero es todo lo que necesitamos por el momento.

Primero, creemos el proyecto e instalemos los paquetes. Simplemente ejecute lo siguiente en la línea de comando:

npm install express npm install ejs

También puede agregar el guión guardar guión (escribo - como " guión" porque Medium lo formatea automáticamente, y no se ve bien para este propósito) para guardarlo en su archivo package.json . Pero cómo funciona esto es una historia para otro día.

Luego, necesitaremos Express y configuraremos el motor de vista en EJS en nuestro archivo app.js de la siguiente manera:

var express = require('express');var app = express();app.set('view engine', 'ejs');

También incluiremos la siguiente línea para que nuestra aplicación escuche solicitudes:

app.listen(3000);

Manejo de solicitudes GET

¡Felicitaciones, todo está listo para atender solicitudes! Hay varios tipos de solicitudes en HTTP, pero solo manejaremos solicitudes GET, que se utilizan para recuperar datos del servidor. Para manejar este tipo de solicitud en Express, usamos el siguiente método:

app.get('/about', function(req, res) { res.render('about');});

Echemos un vistazo a lo que está sucediendo aquí. Le decimos a nuestro servidor que, cada vez que alguien escribe somewebsite.com/about , queremos activar una función. Esa función toma dos parámetros, req (solicitud) y res (respuesta). Usando el objeto de respuesta, renderizamos la página acerca de .

Para que esto funcione, tendremos que crear una página llamada about.ejs en HTML. También lo colocaremos en una carpeta llamada vistas dentro de nuestra carpeta de proyecto. Esta es la carpeta donde Express buscará renderizar la vista. Aquí tienes el megacomplejo acerca de la página que usaremos para este ejemplo:

¡Agradable! Pero, ¿y si el usuario no escribe ninguna ruta? Como hacemos la mayoría de las veces, ¿ algún sitio web.com ? Bueno, muy fácil. Cambie / a punto de solo / y renderice la página que desee:

app.get('/', function(req, res) { res.render('home');});

Manejo de rutas no existentes

Pero, ¿y si alguien escribe una ruta que no existe? Probablemente no queremos que aparezca una página de error predeterminada. En su lugar, queremos una página de error personalizada y genial.

Bueno, la buena noticia es que es muy fácil hacer uno con Express. Simplemente reemplace el parámetro de ruta en el método get con un asterisco y genere su propia página de error así:

app.get('*', function(req, res) { res.render('error');});

¡Probándolo!

Finalmente, ejecutemos nuestro servidor desde la línea de comando (asumiendo que el servidor se llama app.js )

aplicación de nodo

¡y mira si funciona! Ingresemos el nombre de nuestro servidor ( localhost , ya que es un servidor local que se ejecuta en nuestra computadora) y el puerto ( 3000 en este caso) en nuestro navegador:

localhost: 3000

¡Asombroso!

Otras lecturas

Puede aprender todo lo que necesita saber sobre enrutamiento en la guía Express, ¡y también hay muchas cosas útiles en el sitio web de EJS!

Espero que este artículo te haya resultado útil. Si fue así, ¡deja un comentario y aplaude!

Codificación feliz ... ¡ O enrutamiento feliz, supongo!