La MERN Stack est composée de quatre composants :MongoDB, Express, React et Node. Il 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 framework 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 vous montrer comment installer la pile MERN sur Ubuntu 20.04.
Prérequis
- Un serveur exécutant Ubuntu 20.04.
- Un mot de passe root est configuré sur le serveur.
Mise en route
Tout d'abord, mettez à jour les packages système vers la version mise à jour en exécutant la commande suivante :
apt-get update -y
Une fois tous les packages mis à jour, vous pouvez 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. Vous devrez donc ajouter le référentiel MongoDB à votre système.
Tout d'abord, installez 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, ajoutez la clé MongoDB GPG avec la commande suivante :
wget -qO- https://www.mongodb.org/static/pgp/server-4.4.asc | apt-key add -
Ensuite, ajoutez 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, mettez à jour le référentiel et installez le serveur MongoDB à l'aide de la commande suivante :
apt-get update -y
apt-get install mongodb-org -y
Une fois MongoDB installé, démarrez le service MongoDB et activez-le au redémarrage du système :
systemctl start mongod
systemctl enable mongod
Ensuite, vérifiez l'état du service MongoDB à l'aide de la commande suivante :
systemctl status mongod
Vous devriez voir le résultat suivant :
? 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érifiez l'installation de MongoDB avec la commande suivante :
mongo --eval 'db.runCommand({ connectionStatus: 1 })'
Vous devriez obtenir le résultat suivant :
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 un utilisateur administrateur MongoDB
Tout d'abord, connectez-vous à l'instance MongoDB avec la commande suivante :
mongo
Une fois connecté, changez la base de données en admin avec la commande suivante :
> use admin
Ensuite, créez un utilisateur administrateur et définissez un mot de passe avec la commande suivante :
> db.createUser({user: "admin" , pwd: passwordPrompt() , roles: [{ role: "userAdminAnyDatabase" , db: "admin"}]})
Enter password:
Vous devriez obtenir le résultat suivant :
Successfully added user: { "user" : "admin", "roles" : [ { "role" : "userAdminAnyDatabase", "db" : "admin" } ] }
Ensuite, quittez le shell MongoDB avec la commande suivante :
> quit()
Installer Node.js
Par défaut, la dernière version de Node.js n'est pas incluse dans le référentiel par défaut d'Ubuntu. Vous devrez donc ajouter le référentiel source Node à votre système.
Pour ajouter le dépôt source du nœud, exécutez la commande suivante :
curl -sL https://deb.nodesource.com/setup_14.x | bash -
Une fois le dépôt ajouté, installez le Node.js avec la commande suivante :
apt-get install nodejs -y
Après l'installation, vérifiez la version de Node.js avec la commande suivante :
node --version
Vous devriez voir le résultat suivant :
v14.17.2
Vous pouvez également vérifier la version de NPM à l'aide de la commande suivante :
npm --version
Vous devriez voir le résultat suivant :
6.14.13
Installer React.js
Tout d'abord, vous devrez installer un outil create-react-app pour créer une application React.js.
Vous pouvez l'installer avec la commande suivante :
npm install -g create-react-app
Après l'installation, créez une application React.js avec la commande suivante :
create-react-app myapp
Vous devriez voir le résultat suivant :
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, changez le répertoire en myapp et démarrez l'application avec la commande suivante :
cd myapp
npm start 0.0.0.0
Vous devriez 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.
Vous pouvez maintenant accéder à l'application React.js en utilisant l'URL http://your-server-ip:3000 . Vous devriez voir votre tableau de bord React.js sur la page suivante :
Maintenant, appuyez sur CTRL+C dans votre terminal pour fermer l'application.
Installer Express.js
Tout d'abord, installez le générateur express avec la commande suivante :
npm install -g express-generator
Après l'installation, créez un nouveau projet avec la commande suivante :
express myproject
Vous devriez obtenir le résultat suivant :
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, modifiez le répertoire de votre projet et installez toutes les dépendances NPM à l'aide de la commande suivante :
cd myproject
npm install
Maintenant, démarrez le serveur Web Express à l'aide de la commande suivante :
npm start 0.0.0.0
Maintenant, ouvrez votre navigateur Web et accédez à l'application Express en utilisant l'URL http://your-server-ip:3000 . Vous devriez voir la page suivante :
Conclusion
Toutes nos félicitations! vous avez installé avec succès la pile MERN sur le serveur Ubuntu 20.04. Vous pouvez maintenant commencer le développement des applications MERN. N'hésitez pas à me demander si vous avez des questions.