Crea un servidor con Node.js

Crea un servidor con Node.js

Cuando hablamos de Backend nos referimos a todo el desarrollo enfocado a bases de datos, servidores y estructuras de aplicaciones. Mientras el Frontend es responsable de la interacción de mayor nivel entre la aplicación y el usuario (como entradas, botones, íconos, etc.), el Backend funciona a un nivel bajo en comparación con el Frontend, brindando todo lo necesario para que la información sea o la funcionalidad solicitada se rescata de donde está y se devuelve a Frontend, que la procesará y la presentará al usuario.

Existen varias tecnologías en la actualidad para desarrollar el Backend de una aplicación como Python, Ruby, PHP, C#, etc. Hoy trabajaremos con Node.js, que usa JavaScript como base. A través de este artículo aprenderemos la estructura fundamental para crear nuestro primer servidor con esta herramienta.

Entonces, ¡manos a la obra!

¿Qué es Node.js?


Node es un intérprete de lenguaje JavaScript, creado a partir de otro llamado V8.

En los últimos dos años se ha vuelto cada vez más utilizado porque admite Javascript tanto del lado del cliente como del lado del servidor, además de ser fácil de entender. Hoy en día, es utilizado por varias empresas como Paypal, Amazon y Netflix.

En este artículo utilizaremos el sistema de módulos CommonJs, pero no nos centraremos en esta forma de exportar e importar módulos, ya que a partir de la versión 14 Node comenzó a ofrecer soporte para ECMAScript 6.

Instalación de Node


Es importante resaltar que Node debe estar instalado en tu equipo para que puedas trabajar utilizando la herramienta. Si tu sistema operativo es Mac o Windows, ingresa en https://nodejs.org/en/, descarga la versión LTS (la más actual y estable de Node.js) e instálala ejecutando el archivo descargado. Si usas alguna versión de Linux, escribe las siguientes líneas de comando en tu terminal:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

nvm install lts/*


Si la instalación de Node se completó correctamente para alguno de los casos mencionados, cuando ejecutemos el siguiente comando recibiremos la versión instalada de Node como información en nuestra terminal:


node --version

Primeros pasos con Node


La primera acción que haremos será crear un directorio para nuestro proyecto y, dentro de él, iniciar una terminal donde ejecutaremos el siguiente comando:

npm init -y

Esta línea escrita es responsable de crear un archivo package.json que tendrá toda la información importante sobre el proyecto que estamos creando. Podemos cambiar este archivo de dos maneras: lo cambiamos directamente después de crearlo o lo hacemos ejecutando el comando npm init en lugar de npm init -y.

Esto permitirá disponer de una serie de preguntas antes de la creación del fichero, de forma que, al responderlas, completamos la información de package.json.
El archivo package.json, cuando se inicia con el comando mencionado anteriormente (npm init -y), creará un archivo con la siguiente información:

Figura 1 - Archivo package.json.

El campo name se crea con el nombre del directorio donde se inserta. Los campos de version y description traen la versión y descripción del proyecto. Siéntete libre de actualizar la versión de acuerdo con los cambios que se realicen y también de insertar una descripción breve y detallada sobre la aplicación.

En el campo main rellenaremos la dirección de nuestro fichero principal en el que estará contenido el servidor. Para ello, crearemos el archivo server.js dentro de la carpeta src y en la principal detallaremos la ruta a este archivo creado, tomando como referencia la carpeta raíz:

Figura 2 - Creación del archivo principal server y personalización del package.json.

Antes de centrarnos en el archivo server.js, debemos realizar un último cambio esencial en el archivo package.json: el campo scripts. En él podemos insertar cualquier rutina de ejecución que se hará a través del comando npm en una terminal abierta en la carpeta raíz. En este caso, crearemos una rutina que siempre ejecutará nuestro archivo server.js a través de Node:

Figura 3 - Creación del script dev.

⚠️
Nota: ponemos el nombre del desarrollador en el script creado, pero es posible insertar cualquier nombre que queramos, ¡así que no le preste atención cuando esté creando sus scripts!


Finalmente, todo está listo para comenzar a crear nuestro primer servidor. El foco está ahora en el archivo server.js.

Estructura básica de un servidor

Para que podamos construir una aplicación capaz de manejar solicitudes y respuestas, necesitamos un framework capaz de organizar esta información y ayudarnos durante todo el proceso. Esta herramienta se llama Express y la instalaremos mediante el siguiente comando que se debe ejecutar en la carpeta raíz de nuestra aplicación:

npm install express

Lo primero que debes hacer es importarlo y ejecutarlo en el archivo server.js. Recuerda que usamos el sistema de módulos CommonJs, por lo que emplearemos require para la importación:

Figura 4 - Importación y ejecución de Express.

Una vez hecho esto, debemos decirle a Express en cuál puerto queremos que funcione nuestra aplicación y cuál función debe ejecutarse al usar el script de desarrollo. Para ello utilizaremos la función listen ubicada dentro de Express, la cual recibirá como parámetros el número de puerto y una función que, en nuestro caso, solo ejecutará un console.log con el siguiente mensaje:

Figura 5 - Creación del método listen para la aplicación.


Abre tu terminal en la carpeta raíz del proyecto y escribe el script que creamos en el archivo package.json:

npm run dev

Si todo va bien, el mensaje que creamos en la línea 6 debería aparecer en tu terminal de la siguiente manera:

Figura 6 - Servidor en ejecución.

¡Listo! ¡Tenemos nuestro primer servidor Node en funcionamiento! Sin embargo, si accedes a la dirección del puerto que creamos (ve a http://localhost:3333 en tu navegador), verás que no hay absolutamente nada que mostrar aparte del mensaje "Cannot GET /". Esto sucede porque no enviamos ninguna información a través de la respuesta a nuestro servidor.

Para cualquier tipo de acción realizada a través del protocolo HTTP (que es lo que vamos a hacer), existen métodos (o verbos, como también se les llama) que definen qué acción se debe realizar y cuál respuesta debe devolver el servidor.

Hoy trabajaremos con el verbo GET. Para que esto suceda, utilizaremos una función Express llamada get, la cual recibirá la ruta donde se desplegará la información y una función que recibe como parámetros la petición (req) y la respuesta (res):

Figura 7 - Creación del método GET.

El parámetro req contendrá toda la información que se envía a nuestro servidor (usualmente usamos otros métodos para esto, como PUT, DELETE o POST), mientras que el parámetro res tendrá todas las respuestas que enviaremos para su visualización. En este ejemplo, solo usaremos res, devolviendo una respuesta de envío con un elemento HTML como parámetro:

Figura 8 - Creación del método GET con la respuesta creada.

Hay varios tipos de respuestas que podemos reenviar, ya sea en formato JSON (res.json), o redirecciones (res.redirect), o incluso páginas enteras (res.render) y la que estamos usando, que permite enviar textos y elementos HTML. Esto es exactamente lo que hacemos: agregar un elemento HTML de tipo div a la respuesta, que a su vez tiene otros elementos insertados en su interior.

Ten en cuenta que, incluso después de realizar todas estas implementaciones, cuando actualices tu página existente en el puerto 3333, no se mostrará nada. Esto sucede porque debido a la forma en que estructuramos nuestro servidor, siempre necesitamos reiniciarlo para que actualice la información que ingresamos.

Entonces, cierra el servidor en la terminal (Ctrl+C) y ejecuta el script npm run dev nuevamente y, cuando actualices la página, sucederá la magia.

Figura 9 - Aplicación en ejecución.

Es muy molesto reiniciar nuestro servidor cada vez que hacemos un cambio, ¿verdad? ¿Y si te digo que hay una forma de que cada vez que guardemos los archivos del proyecto, la propia aplicación actualice automáticamente el servidor?

Primero, deja de ejecutar el servidor (Ctrl+C) e instala lo siguiente en la carpeta raíz a través de la terminal:

npm install nodemon

Una vez hecho esto, editaremos nuestro script, informando a nuestra aplicación que, a partir de ahora, en lugar de que Node ejecute nuestro archivo server.js, lo hará el nodemon que acabamos de instalar. Esta herramienta realiza exactamente la función que queríamos: observa si se ha producido algún nuevo guardado de los archivos que componen la aplicación y, en caso afirmativo, actualiza el servidor sin tener que “demolerlo”.

Figura 10 - Sustitución del script dev por nodemon.

Ahora, cuando ejecutemos nuestro script en la terminal, tendremos el siguiente retorno:

Figura 11 - Ejecución del script con la alteración.

⚠️
Nota: Siempre que enviamos una respuesta a nuestro servidor, es común que también tenga un estado que, a partir de él, es posible identificar de qué se trata el mensaje, si funcionó y si todo está en conformidad. Para enviar un estado junto con la respuesta, simplemente inserta el siguiente cambio en la función res:
Figura 12 - Añadir un estatus para la response enviada.


Consideraciones Finales


En este artículo vimos los conceptos básicos y esenciales para crear un servidor funcional usando Node.js, usando el verbo GET. Es importante resaltar que existen varios métodos HTTP, siendo los más conocidos GET, POST, PUT y DELETE.

Cada uno se usa para una determinada funcionalidad y situación, y es esencial comprender lo más posible sobre ellos para que podamos realizar solicitudes y respuestas efectivas con Node.js. Pero dime: ¿Ya conocías otros verbos además de GET? ¡Dinos en los comentarios!

¡Hasta luego!

⚠️
Las opiniones y comentarios emitidos en este artículo son propiedad única de su autor y no necesariamente representan el punto de vista de Revelo.

Revelo Content Network da la bienvenida a todas las razas, etnias, nacionalidades, credos, géneros, orientaciones, puntos de vista e ideologías, siempre y cuando promuevan la diversidad, la equidad, la inclusión y el crecimiento profesional de los profesionales en tecnología.