Install MERN Stack for JS Based Applications on Ubuntu 20.04 - Step by step guide ?

MERN is a popular stack that comprises MongoDB, Express, React, NodeJS. This stack is based on JavaScript and is used to build modern and scalable web applications. It is composed of the front-end (React), back-end (Node and Express), and database components (MongoDB).

Here at LinuxAPT, as part of our Server Management Services, we regularly help our Customers to perform related MongoDB configuration queries.

In this context, we shall look into how to install MERN Stack on Ubuntu 20.04.


Steps to install  and configure MERN Stack or JS Based Applications on Ubuntu 20.04


1. Install MongoDB

MongoDB is a cross-platform document-oriented database program that is part of the NoSQL family.NoSQL differs from traditional table-based SQL databases in that it saves data in binary JSON format using documents and collections. This allows for large changes to databases with no downtime.

MongoDB is available in the official Ubuntu repository but not in the latest version. At the time of this writing, the latest version of MongoDB available for download is 5.0.

To install MongoDB 5.0 Community edition on Ubuntu 20.04, we first need to import and the GPG key with the below command:

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

Next, add MongoDB repository to the APT package manager with the command:

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

Then, update your Ubuntu package repository:

$ sudo apt update

Next, install MongoDB with the command:

$ sudo apt install mongodb-org* -y

After the installation is done, start and enable MongoDB to run automatically on system boot. Execute the command:

$ sudo systemctl start mongod
$ sudo systemctl enable mongod

To verify successful installation, run the following command to check the status of MongoDB:

$ sudo systemctl status mongod

You will see that the MongoDB service is now up and running.


2. Create MongoDB Admin User

Now let's create an Admin user for the database. Log into MongoDB with the command:

$ sudo mongo

Once connected to the Mongo shell, run these commands to create and set a password for the admin user:

$ use admin
$ db.createUser({user: "admin" , pwd: passwordPrompt() , roles: [{ role: "userAdminAnyDatabase" , db: "admin"}]})

Exit the Mongo shell with the command:

$ exit


3. Install NodeJS

Node.js is an open-source, cross-platform Javascript runtime environment that allows us to build fast and scalable server-side applications. Node.js is usually used with JavaScript frontend frameworks such as React, Vue, and Angular.

Just like MongoDB, the latest version of Node.js is not available in the Ubuntu default package repository. You need to add the Node source repository to system packages with the below command:

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

After the repository is added, proceed to install Node.js with the command:

$ sudo apt-get install nodejs -y

Then, verify the Node.js version with the command:

$ node --version

You can also verify the version of npm installed. NPM is a node package manager that contains all libraries and other tools for the development of JavaScript applications. Run the command:

$ npm --version


4. Install ReactJS

ReactJS is a JavaScript library for creating responsive modern user interfaces.

First, you need to install the create-react-app tool using the npm package manager. Create-react-app installs the tools required to build and run a React application. Execute the command:

$ npm install -g create-react-app

Now you are ready to create a React.js application. Run the command:

$ create-react-app my-app

Next, go into the my-app directory in order to start the ReactJS application with the command:

$ cd my-app
$ npm start 0.0.0.0

Next, open your web browser and access React using the following address:

http://your-server-ip:3000 


5. Install ExpressJS

ExpressJS is a minimal web application framework for NodeJS, which comes with robust features for modern mobile and web applications. After installing React, we can now install the express-generator:

$ npm install -g express-generator

Next, create a new express application with the command:

$ express new-app

Next, navigate to your project directory and install all NPM dependencies by executing the following command:

$ cd new-app
$ npm install

Now, start the Express web server using the following command:

$ npm start 0.0.0.0

To access your Express application, open your web browser and navigate to the address:

http://your-server-ip:3000


[Need help in installing any Software on your Ubuntu Linux system ? We can help you. ]

This article covers how to install the MERN stack on your Ubuntu 20.04 system. In fact, The MERN Stack is made from four components: MongoDB, Express, React, and Node. It provides a bundle of JavaScript technologies used for building dynamic JS websites.

Related Posts