Inteliny
DevelopmentLevel: Intermediate25mVerified Production Blueprint

How to Dockerize a MERN Stack Application Using Docker & Docker Compose

Learn to dockerize a MERN stack application using Docker and Docker Compose for efficient development and deployment

Inteliny Engineering

Principal Architect

Overview & Architecture Scope

This guide covers the process of dockerizing a MERN (MongoDB, Express, React, Node.js) stack application using Docker and Docker Compose. It is intended for developers who have a basic understanding of the MERN stack and want to improve their development and deployment workflow. By the end of this guide, you will have a fully dockerized MERN stack application that can be easily deployed and managed. Docker and Docker Compose are essential tools for efficient development and deployment, allowing for containerization and orchestration of applications. The MERN stack is a popular choice for web development, and dockerizing it can significantly simplify the development process and improve scalability.

Prerequisites & System Requirements

Ensure your development workstation or staging server fulfills the following prerequisites before initiating commands:

Node.js v18.0+ runtime environment
MongoDB v6.0+ database cluster
Active AWS or Cloudflare account with DNS access
Linux Ubuntu 22.04 LTS server instance
Basic knowledge of CLI bash & Git workflow

Target System Architecture Diagram

Browser
NGINX
Node / Express
MongoDB / Redis

Interactive Execution Checklist

0/7 Completed

Step-by-Step Implementation Guide

1

Step 1: Install Docker and Docker Compose

To start, you need to install Docker and Docker Compose on your machine. Docker is a containerization platform that allows you to package, ship, and run applications in containers. Docker Compose is a tool for defining and running multi-container Docker applications. You can download and install them from the official Docker website. Ensure you install the correct version for your operating system.

Execute Command Terminal:

bash
sudo apt-get update && sudo apt-get install docker-ce docker-ce-cli containerd.io
The installation command may vary depending on your operating system.
2

Step 2: Create a Dockerfile for the Node.js Application

Create a Dockerfile in the root of your project directory. The Dockerfile contains instructions for building your Docker image. For a Node.js application, you will typically start with an official Node.js image, set the working directory, copy the package.json file, install dependencies, copy the application code, and specify the command to run the application.

Execute Command Terminal:

dockerfile
FROM node:14
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
EXPOSE 3000
CMD ["npm", "start"]
This Dockerfile assumes your application starts with npm start and listens on port 3000.
3

Step 3: Create a Dockerfile for the React Application

Similar to the Node.js application, create a Dockerfile for your React application. This Dockerfile will use an official Node.js image, set up the environment for React, install dependencies, build the React application, and serve it.

Execute Command Terminal:

dockerfile
FROM node:14
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
EXPOSE 3001
CMD ["npm", "start"]
This assumes your React application starts with npm start and listens on port 3001.
4

Step 4: Configure Docker Compose

Create a docker-compose.yml file in the root of your project. This file defines the services that make up your application. For a MERN stack application, you will typically have services for the MongoDB database, the Node.js backend, and the React frontend.

Execute Command Terminal:

yaml
version: '3'
services:
  mongo:
    image: mongo
    volumes:
      - mongo-data:/data/db
  backend:
    build: ./backend
    ports:
      - "3000:3000"
    depends_on:
      - mongo
  frontend:
    build: ./frontend
    ports:
      - "3001:3001"
volumes:
  mongo-data:
This configuration assumes your backend and frontend code are in separate directories named backend and frontend, respectively.
5

Step 5: Run the Application with Docker Compose

With the docker-compose.yml file in place, you can now run your entire MERN stack application using a single command. Navigate to the directory containing your docker-compose.yml file and run docker-compose up. This command will build your images, create containers from them, and start the services defined in your docker-compose.yml file.

Execute Command Terminal:

bash
docker-compose up
You can run the command with the -d flag to start the containers in the background.
6

Step 6: Push Images to Docker Hub

To deploy your application, you first need to push your Docker images to a registry like Docker Hub. Create a repository for each service on Docker Hub, then tag your local images with the appropriate repository names, and push them to Docker Hub.

Execute Command Terminal:

bash
docker tag backend:latest <your-username>/backend:latest
docker push <your-username>/backend:latest
Replace <your-username> with your actual Docker Hub username.
7

Step 7: Deploy to Production

For production deployment, you can use a cloud platform like AWS or Google Cloud. Create a new instance, install Docker and Docker Compose, pull your images from Docker Hub, and run your application using docker-compose up. Ensure you configure any necessary environment variables and volumes for persistence.

Execute Command Terminal:

bash
docker-compose up -d
The -d flag runs the containers in detached mode.

Pro Tips & Optimizations

Use environment variables to manage different configurations between development and production environments.
Implement logging and monitoring tools to track the performance and health of your containers.
Regularly update your base images to ensure you have the latest security patches.
Consider using a container orchestration tool like Kubernetes for large-scale deployments.

Common Pitfalls to Avoid

Forgetting to expose the correct ports in the Dockerfile or docker-compose.yml file, leading to the application being inaccessible.
Not properly handling persistence for the MongoDB database, resulting in data loss when containers are restarted or removed.
Incorrectly configuring the depends_on directive in docker-compose.yml, causing services to start in the wrong order.
Conclusion & Next Steps

Dockerizing a MERN stack application simplifies the development and deployment process, making it easier to manage and scale your application. By following these steps, you can ensure a smooth transition to a containerized environment. Remember to continually monitor and optimize your application for the best performance.

Production Best Practices & Hardening

Security Hardening

Disable root SSH access, enforce key-based auth, and enable UFW firewall on ports 80/443.

Memory Management

Set Node.js max-old-space-size to 80% of total RAM to avoid Linux OOM-killer crashes.

Frequently Asked Questions

Yes, all NGINX, Docker, and PM2 deployment steps can be packaged into Infrastructure as Code (IaC) playbooks.

Need Help Implementing This?

Partner with Inteliny's principal architects to audit your stack, automate CI/CD, and accelerate deployment.

How to Dockerize a MERN Stack Application Using Docker & Docker Compose | Inteliny Knowledge Base