Cómo instalar el stack MERN (MongoDB, Express, React y Node) en Ubuntu 20.04

Cómo instalar el stack MERN (MongoDB, Express, React y Node) en Ubuntu 20.04

Antes de comenzar con el stack MERN la programación de cualquier aplicación, el ciclo de vida del desarrollo de software requiere determinar las herramientas que se utilizarán. La rapidez necesaria del desarrollo, la infraestructura disponible del cliente y los lenguajes que manejan los miembros del equipo se consideran en el proceso. Para disponer de otro stack en tu lista de posibilidades, en esta guía aprenderás cómo instalar el stack MERN (MongoDB, Express, React y Node) en Ubuntu 20.04. En el próximo artículo explicaremos cómo conectar los distintos componentes del stack para servir el resultado con Nginx.

Requisitos previos

Paso 1: Instalación de Express, React y el driver de MongoDB para Node

Para comenzar, crea una aplicación de React con el nombre app u otro que desees. La herramienta npx es el método recomendado para hacerlo, ya que elimina la necesidad de instalar create-react-app de forma global. Luego de ejecutar el comando siguiente, confirma con y para continuar la instalación:

npx create-react-app app

En el nuevo directorio llamado app (o el que hayas elegido previamente), instala los paquetes express y mongodb. Este último es el driver the MongoDB para Node.

cd app
npm install express mongodb

De esta forma, ya has finalizado la instalación de los componentes del stack propiamente dichos. Habrás notado que, con la excepción de la base de datos, el resto se incluye a nivel de proyecto en vez de manera global. Esto te permite trabajar de manera individual por aplicación sin causar impactos negativos en el resto del sistema.

Paso 2: Inserción de datos en MongoDB

En la guía de instalación de MongoDB insertaste un registro a la base de datos sistema dentro de la colección usuarios. Luego de ingresar a la consola de MongoDB, agrega dos registros más:

mongosh
use sistema
db.usuarios.insertOne( { nombre: "Pepe", edad: 30, estado: "Inhabilitado" } )
db.usuarios.insertOne( { nombre: "Rafa", edad: 27, estado: "Habilitado" } )

Además de insertOne, MongoDB también provee el método insertMany. En esta guía decidimos utilizar el primero para mayor comodidad en copiar y pegar los comandos.

La consulta db.usuarios.find().pretty() debería devolver los siguientes datos:

como instalar el stack mern mongodb express react node ubuntu 20.04 1
Cómo instalar el stack MERN (MongoDB, Express, React y Node) en Ubuntu 20.04

Recuerda que para para salir de la consola de MongoDB debes emplear la función quit().

Al disponer de varios registros en la base de datos, en la próxima guía podrás mostrarlos en la aplicación de React.

Paso 3: Creación de un usuario de MongoDB

Seguidamente, necesitarás un usuario dedicado para conectar tu aplicación a la base de datos. Después de autenticarte a la consola de MongoDB, crea el usuario lectordb con permisos de lectura para la base de datos sistema. Entre todos los roles incorporados, este resulta el más adecuado a nivel de permisos para el propósito actual.

mongosh -u adminsistema -p --authenticationDatabase admin
db.createUser({ user: "lectordb", pwd: passwordPrompt(), roles:[{role: "read" , db:"sistema"}] })
como instalar el stack mern mongodb express react node ubuntu 20.04 2
Cómo instalar el stack MERN (MongoDB, Express, React y Node) en Ubuntu 20.04

Por motivos de seguridad y orden, es importante utilizar esta cuenta en lugar de una con privilegios administrativos.

Conclusión sobre stack MERN

En esta guía aprendiste cómo instalar el stack MERN (MongoDB, Express, React y Node) en Ubuntu 20.04. Vimos los requisitos previos y los pasos a seguir para la instalación de la misma. Esto representa la base para conectar los componentes en una aplicación web y servirla a través de Nginx. Como resultado, tendrás una herramienta más en tu lista de habilidades para un proyecto de desarrollo de software.

Por otra parte, aquí te dejamos una guía sobre cómo instalar el Stack MEAN (Mongo DB, Express, Angular y Node) donde cambiamos el uso de React por el de Angular.

A continuación, los videos de las clases de Desarrollo con stack MEAN / MERN dictados en DonWeb

Parte 1:

Parte 2:

Parte 3:

¿Te resultó útil esta guía?

Imagen por defecto
Gabriel Cánepa

Gabriel trabaja actualmente como desarrollador full-stack en Scalar, una firma que se dedica a hacer valuaciones de empresas. Es Administrador de Sistemas certificado por la Fundación Linux y previamente ha escrito un gran número de artículos y contenidos técnicos sobre el tema para: DigitalOcean, Linode, Carrera Linux Argentina y Tecmint.

Tiene una certificación en programación de la Universidad de Brigham Young-Idaho, y está completando las carreras de programador y analista de sistemas en la Universidad Nacional de Villa Mercedes (UNViMe).

En su tiempo libre, Gabriel disfruta leyendo libros de Stephen R. Covey, tocando piano y guitarra, y enseñando conocimientos de programación a su dos hijas.