Primeros pasos en Node.js

By: ->

 En este articulo veremos los primeros pasos para aprender Node.

Necesitas conocimientos intermedios en desarrollo web y tener VSC.

Veremos como hacer servidores usando node.js

 

1. Importar

Primero veremos como importar elementos, ya que es diferente a JS. Para ello:

Usamos 'require' y en este caso como son elementos propios, damos la ubicación:


const funcionMensaje = require("./moduloMensaje.js");
const {Mensaje} = require("./moduloMensaje.js");
 


Pero si es un modulo como librería, solo ponemos su nombre:


const express = require("express");
 


2. Exportar

Si creamos elementos (llamados módulos) en node, y los necesitamos en otros scripts, haremos lo siguiente:

 
function Mensaje(men) {
    console.log(`<<${men}>>`);
}

module.exports.Mensaje = Mensaje;
 
module.exports = {
    Mensaje: Mensaje
}
 

Tenemos una función de ejemplo. Luego tenemos la forma de exportar un único elemento. También, tenemos una forma de exportar varios elementos.


3. Crear servidor

Para esto, debemos hacer varios pasos.


const http = require("http"); // Uso de la libreria

const servidor = http.createServer((req, res) => { // Crear servidor
    res.end("Respuesta: Hola"); // Termina el proceso y le envia algo al usuario
});

const puerto = 9999;

servidor.listen(puerto, () => { // Activa la escucha de solicitudes en un puerto definido
    console.log(`Servidor activo en el puerto ${puerto} - http://localhost:${puerto}`);
});

Primero necesitamos la librería HTTP.

Creamos el servidor con 'createServer' y damos un mensaje con 'end'.

Luego creamos su url para ser albergada con un puerto definido.


4. Uso del servidor

Para activarlo solamente debemos ir a la carpeta. Algo importante es usar nodemon (este lo que hace es evitar el reinicio del servidor cada vez que cambiemos el código).

Entonces en una terminal normal. Escribimos "nodemon ejemplo.js" y así empezara a ejecutarse, como comprobante saldrá el mensaje: Respuesta: Hola.


5. Objetos REQ y RES

En el código anterior tenemos que pasar 2 objetos, los cuales tienen un propósito diferente.

5.1 REQ

Este objeto tiene la solicitud del usuario, todo lo que pide el usuario al servidor. Como la url, método http etc.

5.2 RES

Este objeto es la respuesta que nosotros daremos, como ya usamos con anterioridad, y es donde enviaremos los recursos a mostrar...

Ejemplo de los objetos:


const servidor = http.createServer((req, res) => {
    res.end("<<Objeto REQ>>");
    console.log(`URL visitada: http://localhost:3000${req.url}`);
    console.log(`Metodo HTTP: ${req.method}`);
    console.log(`Heders: ${req.headers}`);

    res.end("<<Objeto RES>>");
    console.log(`Estado: ${res.statusCode}`);
});
 


6. Operaciones HTTP

Para esto crearemos una "base de datos" en un JSON, como este:


let DB = {
    "frutas": [
        {
            id: 1,
            titulo: "🍓",
            detalle: "Fresa",
            nivel: "Alto"
        },
        {
            id: 2,
            titulo: "🍏",
            detalle: "Manzana verde",
            nivel: "Medio"
        },
        {
            id: 3,
            titulo: "🍌",
            detalle: "Banano",
            nivel: "Bajo"
        }
    ],
    "verduras": [
        {
            id: 1,
            titulo: "🥑",
            detalle: "Aguacate",
            nivel: "Bajo"
        },
        {
            id: 2,
            titulo: "🍅",
            detalle: "Tomate",
            nivel: "Alto"
        },
        {
            id: 3,
            titulo: "🥒",
            detalle: "Pepino",
            nivel: "Medio"
        }
    ]
}

module.exports.DB = DB;
 

Entonces, creamos nuestro servidor con normalidad, pero agregaremos las operaciones HTTP:

 
const servidor = http.createServer((req, res) => {
    const {method} = req; // Extraemos method HTTP
   
    if(method == "GET") {
        return FuncionGet(req, res);
    } else if(method == "POST") {
        return FuncionPost(req, res);
    } else {
        console.log("No hay, no existe...");
       
    }
});
 

Como ven, del objeto 'req' extraemos el método que solicita el usuario. Y entonces creamos unos condicionales para hacer una operación determinada (para mayor facilidad, en funciones fuera de ese código). Importante es tener una alternativa con el error.

6.1 GET

Haremos que, dependiendo de la url consultada mostraremos las frutas o las verduras. Ejemplo:


function FuncionGet(req, res) {
    const path = req.url; // La url que esta el usuario

    if(path === "/") {
        res.statusCode = 200;
        return res.end(JSON.stringify(DB));
    } else if(path === "/frutas") {
        res.statusCode = 200;
        return res.end(JSON.stringify(DB.frutas));
    } else if(path === "/verduras") {
        res.statusCode = 200;
        return res.end(JSON.stringify(DB.verduras));
    } else {
        res.statusCode = 404;  
        return res.end("No existe esta pagina");
    }
}
 

Como vemos en el código. Primero debemos obtener el 'path' o url consultada. Verificamos que sea correcta y retornaremos los elementos correspondientes. 

También, algo bueno, es modificar el código de estatus para dar al navegador mas detalles de la consulta hecha por el usuario.

6.2 POST

Haremos algo similar pero para POST, en este caso, no actualizaremos nada realmente, solo daremos un mensaje en consola.


function FuncionPost(req, res) {
    const path = req.url;

    if(path === "/frutas/nuevo") {
        res.statusCode = 200;
       
        let body = "";
        req.on("data", contenido => {
            body += contenido.toString();
        });

        req.on("end", () => {
            console.log(body);
            body = JSON.parse(body);

            res.end("Se recibio un POST en /frutas/nuevo");
            console.log(body.titulo);
           
        });


    }
}
 

En el código anterior, con la url correcta, obtendremos lo enviado por el usuario y se mostrara en consola...

Inciso: para probar el servidor en VSC directamente, necesitaremos la herramienta "REST client"

Entonces crearemos un archivo: 'index.http' y escribimos:

 
POST http://localhost:9000/frutas/nuevo
Content-Type: application/json

{"titulo": "Servicio! :D"}
 

Y dando click a ´send request', podremos ver el resultado usando el método POST. También podremos usar los otros métodos. Así:

 
GET http://localhost:3000
POST http://localhost:3000
PUT http://localhost:3000
DELETE http://localhost:3000
 


7. Paquetes

Es importante crear y empaquetar nuestra aplicación, para ello en la terminal usaremos: 'npm init' y llenamos los datos. O, de manera mas rápida: 'npm init --yes'.



Existe una segunda parte, la cual usaremos express y se profundizara un poco mas.