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
- Instalar Node como se explica en el paso 1 de Cómo instalar el stack MEAN (MongoDB, Express, Angular y Node) en Ubuntu 20.04
- Instalar y asegurar MongoDB como detallamos en Cómo instalar y configurar MongoDB en Ubuntu 20.04 (incluyendo la creación de la base de datos) y Cómo asegurar MongoDB para producción
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:
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"}] })
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: