Comment installer la pile MERN pour les applications basées sur JS sur Ubuntu 20.04

La pile MERN est constituée de quatre composants : MongoDB, Express, React et Node. Elle fournit un ensemble de technologies JavaScript utilisées pour créer des sites Web JS dynamiques.

MongoDB est un système de base de données NoSQL open-source et le plus utilisé pour développer des applications Web robustes. Express.js est un cadre d’application Web Node.js utilisé pour développer des applications Web hybrides. React.js est un framework JavaScript open-source utilisé pour créer une interface frontale pour les applications mobiles. Node.js est un environnement JavaScript qui permet aux développeurs d’exécuter des codes sur le serveur.

Dans ce guide, nous allons te montrer comment installer la pile MERN sur Ubuntu 20.04.

Conditions préalables

  • Un serveur exécutant Ubuntu 20.04.
  • Un mot de passe root est configuré sur le serveur.

Pour commencer

Tout d’abord, mets les paquets système à la version mise à jour en exécutant la commande suivante :

apt-get update -y

Une fois que tous les paquets sont mis à jour, tu peux passer à l’étape suivante.

Installer le serveur MongoDB

Par défaut, la dernière version de MongoDB n’est pas incluse dans le référentiel par défaut d’Ubuntu 20.04. Tu devras donc ajouter le dépôt MongoDB à ton système.

Tout d’abord, installe toutes les dépendances requises à l’aide de la commande suivante :

apt-get install gnupg2 wget curl unzip git -y

Après avoir installé toutes les dépendances, ajoute la clé GPG MongoDB à l’aide de la commande suivante :

wget -qO- https://www.mongodb.org/static/pgp/server-4.4.asc | apt-key add -

Ensuite, ajoute le référentiel MongoDB avec la commande suivante: :

echo "deb [ arch=amd64,arm64 ] https://repo.mongodb.org/apt/ubuntu focal/mongodb-org/4.4 multiverse" | tee /etc/apt/sources.list.d/mongodb-org-4.4.list

Ensuite, mets à jour le référentiel et installe le serveur MongoDB à l’aide de la commande suivante: :

apt-get update -y
apt-get install mongodb-org -y

Une fois que MongoDB a été installé, démarre le service MongoDB et active-le pour qu’il démarre au redémarrage du système :

systemctl start mongod
systemctl enable mongod

Ensuite, vérifie l’état du service MongoDB à l’aide de la commande suivante :

systemctl status mongod

Tu devrais voir la sortie suivante :

? mongod.service - MongoDB Database Server
     Loaded: loaded (/lib/systemd/system/mongod.service; disabled; vendor preset: enabled)
     Active: active (running) since Fri 2021-07-23 12:21:17 UTC; 5s ago
       Docs: https://docs.mongodb.org/manual
   Main PID: 8774 (mongod)
     Memory: 58.8M
     CGroup: /system.slice/mongod.service
             ??8774 /usr/bin/mongod --config /etc/mongod.conf

Jul 23 12:21:17 ubuntu systemd[1]: Started MongoDB Database Server.

Ensuite, vérifie l’installation de MongoDB à l’aide de la commande suivante :

mongo --eval 'db.runCommand({ connectionStatus: 1 })'

Tu devrais obtenir la sortie suivante :

MongoDB shell version v4.4.7
connecting to: mongodb://127.0.0.1:27017/?compressors=disabled&gssapiServiceName=mongodb
Implicit session: session { "id" : UUID("59c89093-9e9d-413b-aafa-ae0a4ddda087") }
MongoDB server version: 4.4.7
{
	"authInfo" : {
		"authenticatedUsers" : [ ],
		"authenticatedUserRoles" : [ ]
	},
	"ok" : 1
}

Créer l’utilisateur Admin MongoDB

Tout d’abord, connecte-toi à l’instance MongoDB avec la commande suivante :

mongo

Une fois que tu es connecté, change la base de données en admin avec la commande suivante :

> use admin

Ensuite, crée un utilisateur admin et définis un mot de passe avec la commande suivante :

> db.createUser({user: "admin" , pwd: passwordPrompt() , roles: [{ role: "userAdminAnyDatabase" , db: "admin"}]})
Enter password:

Tu devrais obtenir le résultat suivant :

Successfully added user: {
	"user" : "admin",
	"roles" : [
		{
			"role" : "userAdminAnyDatabase",
			"db" : "admin"
		}
	]
}

Ensuite, quitte le shell MongoDB avec la commande suivante :

> quit()

Installe Node.js

Par défaut, la dernière version de Node.js n’est pas incluse dans le dépôt par défaut d’Ubuntu. Tu devras donc ajouter le dépôt de sources Node à ton système.

Pour ajouter le dépôt de sources Node, exécute la commande suivante :

curl -sL https://deb.nodesource.com/setup_14.x | bash -

Une fois le dépôt ajouté, installe Node.js avec la commande suivante :

apt-get install nodejs -y

Après l’installation, vérifie la version de Node.js avec la commande suivante :

node --version

Tu devrais voir le résultat suivant :

v14.17.2

Tu peux aussi vérifier la version de NPM à l’aide de la commande suivante :

npm --version

Tu devrais voir le résultat suivant :

6.14.13

Installer React.js

Tout d’abord, tu dois installer l’outil create-react-app pour créer une application React.js.

Tu peux l’installer à l’aide de la commande suivante :

npm install -g create-react-app

Après l’installation, crée une application React.js avec la commande suivante :

create-react-app myapp

Tu devrais voir la sortie suivante :

Success! Created myapp at /root/myapp
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd myapp
  npm start

Happy hacking!

Ensuite, change le répertoire en myapp et démarre l’application avec la commande suivante :

cd myapp
npm start 0.0.0.0

Tu devrais voir le résultat suivant :

Compiled successfully!

You can now view myapp in the browser.

  http://localhost:3000

Note that the development build is not optimized.
To create a production build, use npm run build.

Tu peux maintenant accéder à l’application React.js en utilisant l’URL http://your-server-ip:3000. Tu devrais voir ton tableau de bord React.js sur la page suivante :

NodeJS

Maintenant, appuie sur CTRL+C dans ton terminal pour fermer l’application.

Installe Express.js

Tout d’abord, installe le générateur express avec la commande suivante :

npm install -g express-generator

Après l’installation, crée un nouveau projet avec la commande suivante :

express myproject

Tu devrais obtenir la sortie suivante :

  warning: the default view engine will not be jade in future releases
  warning: use `--view=jade' or `--help' for additional options


   create : myproject/
   create : myproject/public/
   create : myproject/public/javascripts/
   create : myproject/public/images/
   create : myproject/public/stylesheets/
   create : myproject/public/stylesheets/style.css
   create : myproject/routes/
   create : myproject/routes/index.js
   create : myproject/routes/users.js
   create : myproject/views/
   create : myproject/views/error.jade
   create : myproject/views/index.jade
   create : myproject/views/layout.jade
   create : myproject/app.js
   create : myproject/package.json
   create : myproject/bin/
   create : myproject/bin/www

   change directory:
     $ cd myproject

   install dependencies:
     $ npm install

   run the app:
     $ DEBUG=myproject:* npm start

Maintenant, change le répertoire pour ton projet et installe toutes les dépendances NPM à l’aide de la commande suivante :

cd myproject
npm install

Maintenant, démarre le serveur Web Express à l’aide de la commande suivante :

npm start 0.0.0.0

Maintenant, ouvre ton navigateur Web et accède à l’application Express en utilisant l’URL http://your-server-ip:3000. Tu devrais voir la page suivante :

ExpressJS

Conclusion

Félicitations ! Tu as installé avec succès la pile MERN sur le serveur Ubuntu 20.04. Tu peux maintenant commencer à développer des applications MERN. N’hésite pas à me demander si tu as des questions.

Vous aimerez aussi...