The MERN Stack: Everything You Need to Know.

Janusska Inparajah
3 min readJun 19, 2021
Architecture

MERN stack is a web development framework. It consists of MongoDB, ExpressJS, ReactJS, and NodeJS as its working components.

The user interacts with the ReactJS UI components at the application front-end in the browser, as depicted in the diagram above. The application backend, which is hosted on a server, serves this frontend using ExpressJS, which is built on top of NodeJS.

MongoDB

MongoDB is a nonrelational document-oriented database (NoSQL), which is a cross-platform document-based database. MongoDB, except for traditional relational databases, doesn’t even have a schema design based on tables and columns.

Why MongoDB…

  1. Fast & scalable
  2. Flexible Document Model
  3. Use of JavaScript
  4. Schema Less
  5. Data stored in the form of JSON

Express

Another MERN component, Express, is a web application framework for Node.js. Rather than creating whole web server code by hand in Node.js, developers utilize Express to make writing server code easier. There’s no need to keep repeating the same code, as there is with the Node.js HTTP module.

The Express framework was created to make creating APIs and efficient web applications simple and easy. It has a bunch of plugin functionality and is known for being speedy. Its simple layout makes it easy for developers to pick up and use right away.

Why Express…

  1. Efficient, fast & scalable
  2. It has the biggest community for Node.js
  3. Robust API
  4. Asynchronous and single-threaded.
  5. Express promotes code reusability with its built-in router.

React

React was created by one of Facebook’s software engineers and later made into an open-source library. A JavaScript library for building user interfaces and it is maintained by Facebook alongside a dedicated group of individual and corporate developers and can be used to create views rendered in HTML. The same code can run on both the server and the browser with React.

The MERN stack is anchored by React. In some ways, it’s the stack’s unique feature. It’s the only thing that sets MERN apart from MEAN, a popular JavaScript stack that relies on AngularJS (a front-end web application framework) rather than the React library.

Why React…

  1. High Performance
  2. Developing Android/IOS apps is easy.
  3. Start react application using npm or yarn.
  4. Virtual DOM
  5. Components

Node.js

Node.js is the runtime environment for JavaScript. Node.js was created for Google Chrome and then open-sourced by the company in 2008. It is based on the V8 JavaScript engine in Chrome. It’s used to run JavaScript on a computer instead of in a browser. It can run JavaScript code outside of a browser and is meant to construct scalable network applications.

Why Node.js…

  1. Single threading
  2. Data Streaming
  3. Open source JavaScript Runtime Environment
  4. Highly Scalable

Advantages of MERN stack

  1. Easy code maintenance.
  2. Flexible architecture.
  3. Faster web app development process.
  4. Supports MVC architecture.
  5. A JavaScript stack.
  6. Built-in extensive suite to test tools.
  7. An open source frame work.

How to Get Started with the MERN Stack…

  1. Install Node
  2. Install a code editor
  3. Setting up the project
  4. Connecting to MongoDB Atlas
  5. Server API endpoints
  6. Setting up the React application
  7. Setting up the React router
  8. Creating components
  9. Connecting the Front End to the Back End
  10. Finishing the application

--

--