Tutorial del framework Node.js Express.js

En este tutorial, estudiaremos el framework Express. Este framework está diseñado para funcionar como un framework de aplicaciones web Node.js minimalista y flexible, que proporciona un conjunto robusto de características para crear aplicaciones web de una sola página, de varias páginas e híbridas.

¿Qué es Express.js?

Express.js es un framework de servidor de aplicaciones web para Node.js, diseñado específicamente para la creación de aplicaciones web de una sola página, de varias páginas e híbridas.

Se ha convertido en el framework de servidor estándar para Node.js. Express es la parte de backend de lo que se conoce como la pila MEAN.

Express aplica capas de enrutamiento y middleware sobre el núcleo HTTP de Node.js, corrientes y API de eventos.

MEAN es gratuito y de código abierto. JavaScript pila de software para crear sitios web dinámicos y aplicaciones web que tiene los siguientes componentes:

1) MongoDB — La base de datos NoSQL estándar

2) Expreso.js — El marco de trabajo predeterminado para aplicaciones web

3) AngularJS - Los JavaMarco de trabajo MVC de scripts utilizado para aplicaciones web

4) Node.js — Marco de trabajo utilizado para aplicaciones de red y del lado del servidor escalables.

El marco Express.js facilita el desarrollo de una aplicación que se puede utilizar para manejar múltiples tipos de solicitudes, como solicitudes GET, PUT, POST y DELETE.

Instalación y uso de Express

Express se instala a través del administrador de paquetes de Node. Esto se puede hacer ejecutando la siguiente línea en la línea de comandos

npm instalar express

El comando anterior solicita al Administrador de paquetes de Node que descargue el express necesario. módulos e instalarlos según corresponda.

Nota de versión: npm ahora instala Express 5.2; muchos proyectos todavía usan Express 4. Ambos ejecutan los ejemplos a continuación en un Versión compatible con Node.js.

Usemos nuestro marco Express recién instalado y creemos una aplicación simple "Hola mundo".

Nuestra aplicación va a crear un sencillo módulo de servidor que estará a la escucha en el puerto número 3000. En nuestro ejemplo, si se realiza una solicitud a través del navegador en este puerto, la aplicación del servidor enviará una respuesta "Hola Mundo" al cliente.

var express=require('express');
var app=express();
app.get('/',function(req,res)
{
res.send('Hello World!');
});
var server=app.listen(3000,function() {});

Code Explicación:

1. En nuestra primera línea de código, utilizamos la función require para incluir el "módulo expreso".
2. Antes de que podamos comenzar a usar el módulo express, necesitamos convertirlo en un objeto.
3. Aquí estamos creando una función de devolución de llamada. Esta función se ejecutará cada vez que alguien acceda a la raíz de nuestra aplicación web, que es http://localhost:3000. La función de devolución de llamada se utilizará para enviar la cadena "Hola Mundo" a la página web.
4. En la función de devolución de llamada, enviamos la cadena "Hola mundo" al cliente. El parámetro 'res' se utiliza para enviar contenido a la página web. Este parámetro 'res' es algo que proporciona el módulo 'solicitud' para permitir enviar contenido a la página web.
5. Luego usamos la función listen para que nuestra aplicación de servidor escuche las solicitudes de los clientes en el puerto 3000. Aquí puede especificar cualquier puerto disponible.

Si el comando se ejecuta correctamente, se mostrará la siguiente salida cuando ejecute su código en el navegador.

Salida:

Desde la salida,

• Puedes ver claramente que si navegas a la URL Si accedes a localhost en el puerto 3000, verás la cadena "Hello World" mostrada en la página.
• Debido a que en nuestro código hemos mencionado específicamente que el servidor escuche en el puerto 3000, podemos ver la salida cuando navegamos a este URL.

¿Qué son las Rutas?

Una única ruta raíz es solo el punto de partida.

El enrutamiento determina la forma en que una aplicación responde a la solicitud de un cliente a un punto final específico.

Por ejemplo, un cliente puede realizar una solicitud HTTP GET, POST, PUT o DELETE para varios URL como los que se muestran a continuación;

http://localhost:3000/Books
http://localhost:3000/Students

En el ejemplo anterior,

• Si se realiza una solicitud GET para el primero URL, entonces la respuesta idealmente debería ser una lista de libros.
• Si la solicitud GET se realiza para el segundo URL, entonces la respuesta idealmente debería ser una lista de estudiantes.
• Así que, basado en el URL Al acceder a la página, se activará una funcionalidad diferente en el servidor web y, en consecuencia, se enviará la respuesta al cliente. Este es el concepto de enrutamiento.

Cada ruta puede tener una o más funciones de controlador, que se ejecutan cuando la ruta coincide.

La sintaxis general de una ruta se muestra a continuación.

app.METHOD(PATH, HANDLER)

Donde,

1) la aplicación es una instancia del módulo expreso

2) MÉTODO es un método de solicitud HTTP (GET, POST, PUT o DELETE)

3) PATH es una ruta en el servidor.

4) HANDLER es la función que se ejecuta cuando la ruta coincide.

⚠️ expresa 5 Nota: Estas firmas no han cambiado, pero app.del() se convirtió en app.delete(), res.sendfile() se convirtió en res.sendFile() y los comodines ahora necesitan nombres como /*splat.

Veamos un ejemplo de cómo podemos implementar rutas en Express. Nuestro ejemplo creará 3 rutas como

1. Una ruta /Nodo que mostrará la cadena "Tutorial en Nodo" si se accede a esta ruta
2. Una ruta /Angular que mostrará la cadena "Tutorial sobre Angular" si se accede a esta ruta
3. Una ruta predeterminada / que mostrará la cadena “Bienvenido a Guru99 tutoriales.

Nuestro código básico seguirá siendo el mismo que el de los ejemplos anteriores. El siguiente fragmento es un complemento para mostrar cómo se implementa el enrutamiento.

var express = require('express');
var app = express();
app.route('/Node').get(function(req,res)
{
    res.send("Tutorial on Node");
});
app.route('/Angular').get(function(req,res)
{
    res.send("Tutorial on Angular");
});
app.get('/',function(req,res){
    res.send('Welcome to Guru99 Tutorials');
});

Code Explicación:

1. Aquí estamos definiendo una ruta si la URL http://localhost:3000/Node is selected in the browser. To the route, we are attaching a callback function which will be called when we browse to the Node URLLa función tiene 2 parámetros.
   • El parámetro principal que usaremos es el parámetro 'res', que se puede usar para enviar información al cliente.
   • El parámetro 'req' tiene información sobre la solicitud que se realiza. A veces, se pueden enviar parámetros adicionales como parte de la solicitud que se realiza y, por lo tanto, el parámetro 'req' se puede utilizar para encontrar los parámetros adicionales que se envían.
2. Estamos utilizando la función de envío para enviar la cadena "Tutorial en el nodo" al cliente si se elige la ruta del nodo.
3. Aquí estamos definiendo una ruta si la URL http://localhost:3000/Angular is selected in the browser. To the route, we are attaching a callback function which will be called when we browse to the Angular URL.
4. Estamos utilizando la función de envío para enviar la cadena "Tutorial sobre Angular" al cliente si se elige la ruta Angular.
5. Esta es la ruta predeterminada que se elige cuando uno navega a la raíz de la aplicación: http://localhost:3000. Cuando se elige la ruta predeterminada, el mensaje “Bienvenido a GuruSe enviarán 99 tutoriales al cliente.

Si el comando se ejecuta correctamente, se mostrará la siguiente salida cuando ejecute su código en el navegador.

Salida:

Desde la salida,

• Puedes ver claramente que si navegas a la URL de localhost en el puerto 3000, verá la cadena 'Bienvenido a GuruEn la página se muestran 99 tutoriales.
• Porque en nuestro código hemos mencionado que nuestro valor predeterminado URL mostraría este mensaje.

A continuación, navegue hasta /Node.

Desde la salida,

• Puedes ver que si el URL Se ha cambiado a /Node, se elegiría la ruta Node correspondiente y se mostraría la cadena "Tutorial sobre Node".

Luego, navegue hasta /Angular.

Desde la salida,

• Puedes ver que si el URL Se ha cambiado a /Angular, se elegiría la ruta de Node correspondiente y se mostraría la cadena "Tutorial sobre Angular".

Servidor web de muestra usando express.js

En el ejemplo anterior, vimos cómo podemos decidir qué salida mostrar según el enrutamiento. Este tipo de enrutamiento es el que se usa en la mayoría de las aplicaciones web modernas. La otra parte de un servidor web consiste en usar plantillas en Node.js.

Para crear aplicaciones Node.js rápidas y sencillas, una forma fácil y rápida es usar plantillas. Existen muchos frameworks disponibles en el mercado para crear plantillas. En este caso, utilizaremos como ejemplo el framework Jade.

Jade se instala a través del Administrador de paquetes de Node. Esto se puede hacer ejecutando la siguiente línea en la línea de comandos.

npm instala jade

El comando anterior solicita al gestor de paquetes de Node que descargue los módulos Jade necesarios y los instale correctamente.

NOTA: En la última versión de Node, jade ha quedado obsoleto. En su lugar, utiliza pug.

⚠️ Equivalente moderno: instalar Pug, cambia el nombre de index.jade a index.pug y establece app.set('view engine','pug'). El paquete jade no recibe actualizaciones; los pasos siguientes se ejecutan igualmente.

Vamos a usar nuestro framework Jade recién instalado y crear algunas plantillas básicas.

Paso 1) El primer paso es crear una plantilla Jade. Crea un archivo llamado index.jade e inserta el siguiente código. Asegúrate de crear el archivo en la carpeta "views".

1. Aquí especificamos que el título de la página se cambiará a cualquier valor que se pase cuando se invoque esta plantilla.
2. También especificamos que el texto de la etiqueta de encabezado se reemplazará por el que se pase en la plantilla Jade.

A continuación se muestra el código de la aplicación que lo renderiza.

var express=require('express');
var app=express();
app.set('view engine','jade');
app.get('/',function(req,res)
{
res.render('index',
{title:'Guru99',message:'Welcome'})
});
var server=app.listen(3000,function() {});

Code Explicación:

1. Lo primero que hay que especificar en la aplicación es el "motor de renderizado" que se utilizará para mostrar las plantillas. Como vamos a usar Jade para renderizarlas, lo especificamos en consecuencia.
2. La función de renderizado se utiliza para renderizar una página web. En nuestro ejemplo, estamos renderizando la plantilla (index.jade) que se creó anteriormente.
3. Estamos pasando los valores de “Guru99” y “Bienvenido” a los parámetros “título” y “mensaje” respectivamente. Estos valores serán reemplazados por los parámetros “título” y “mensaje” declarados en la plantilla index.jade.

Si el comando se ejecuta correctamente, se mostrará la siguiente salida cuando ejecute su código en el navegador.

Salida:

Desde la salida,

• Podemos ver que el título de la página se establece en “Guru99” y el encabezado de la página se establece en “Bienvenido”.
• Esto se debe a la plantilla Jade que se invoca en nuestra aplicación Node.js.

Preguntas Frecuentes