Deploying MEAN Stack Applications on Heroku

 The MEAN stack—MongoDB, Express.js, Angular, and Node.js—is a popular full-stack JavaScript framework for building dynamic web applications. Once you’ve built your MEAN stack app locally, the next step is to deploy it so users can access it online. Heroku, a cloud platform that supports Node.js, offers an easy and efficient way to host full-stack apps. In this blog, we’ll walk through the process of deploying a MEAN stack application on Heroku.

Step 1: Prepare Your Project for Deployment

Before deployment, ensure your project is production-ready:

Combine Frontend & Backend: Use ng build --prod to compile your Angular app. Copy the output folder (dist/) into the backend's public directory.

Update server code: Serve static files using Express:

app.use(express.static(path.join(__dirname, 'dist/<angular-folder-name>')));

app.get('*', (req, res) => {

  res.sendFile(path.join(__dirname, 'dist/<angular-folder-name>/index.html'));

});

Environment Variables: Replace local database URIs or keys with environment variable references for security.

Step 2: Set Up MongoDB Atlas (Optional)

If your app uses MongoDB, use MongoDB Atlas (a cloud-based MongoDB service):

Create a MongoDB Atlas account.

Create a cluster and whitelist your IP.

Get the connection URI and store it in an environment variable like MONGO_URI.

Step 3: Initialize a Git Repository

If you haven't already:

git init

git add .

git commit -m "Initial commit"

Step 4: Create a Heroku App

Install the Heroku CLI if not already installed. Then:

heroku login

heroku create your-app-name

Set necessary environment variables:

heroku config:set MONGO_URI=your_mongo_connection_string

Step 5: Deploy to Heroku

Push your code to Heroku:

git push heroku master

Heroku will install dependencies, build the app, and start the server using the start script in package.json.

Step 6: Open Your Live App

After successful deployment, run:

heroku open

Your MEAN stack application is now live!

Conclusion

Deploying a MEAN stack app on Heroku is a smooth process when done step-by-step. By integrating MongoDB Atlas and using Heroku’s seamless Git-based workflow, developers can launch scalable web applications with minimal infrastructure overhead. Perfect for startups, prototypes, or personal projects!

Learn MEAN Stack Training Course

Read more: 

Top Companies Hiring MEAN Stack Developers

Learning MEAN Stack as a Complete Beginner

Creating RESTful APIs with MEAN Stack

How Angular Integrates with Node.js in MEAN Stack

Visit Quality Thought Training Institute
Get Direction









Comments

Post a Comment

Popular posts from this blog

DevOps vs Agile: Key Differences Explained

 In the modern software development landscape, DevOps and Agile are two dominant methodologies that aim to deliver high-quality software efficiently and reliably. While they share common goals—such as faster releases, improved collaboration, and continuous improvement—they are not the same. This blog explains the key differences between DevOps and Agile, their core principles, and how they complement each other. Definition and Focus Agile is a software development methodology focused on iterative development, where requirements and solutions evolve through collaboration between cross-functional teams. Agile emphasizes adaptability, customer feedback, and working software delivered in small, frequent iterations (sprints). DevOps, on the other hand, is a software delivery approach that bridges the gap between development and operations teams. It emphasizes automation, continuous integration/continuous delivery (CI/CD), monitoring, and collaboration to achieve faster, more reliable so...
Read more

How to Set Up a MEAN Stack Development Environment

 The MEAN stack is a popular JavaScript-based technology stack for building modern web applications. It includes MongoDB, Express.js, Angular, and Node.js—together forming a powerful full-stack development environment. Whether you're a beginner or switching from another stack, setting up the MEAN stack is straightforward if you follow the right steps. Here’s a complete guide to get you started. 1. Install Node.js and npm Node.js is the runtime that allows you to run JavaScript on the server side. npm (Node Package Manager) comes bundled with Node.js and is used to install project dependencies. Visit https://nodejs.org Download the latest LTS version for your OS Install and verify: bash Copy Edit node -v npm -v 2. Install MongoDB MongoDB is the NoSQL database used in the MEAN stack. You can either install it locally or use a cloud-based service like MongoDB Atlas. Visit https://www.mongodb.com/try/download/community Follow the installer steps Start MongoDB service: bash Copy Edit mo...
Read more

Regression Analysis in Python

Regression analysis is one of the most widely used statistical techniques in data science and machine learning. It helps us understand relationships between variables and make predictions. In this blog, we’ll walk through the basics of regression analysis using Python and its popular libraries. 🔍 What is Regression Analysis? Regression analysis is a predictive modeling technique used to examine the relationship between a dependent (target) variable and one or more independent (predictor) variables. The most common type is linear regression, which assumes a linear relationship between variables. For example, predicting house prices based on area, location, and number of bedrooms is a regression problem. 🛠 Libraries Required Before we start, install the required Python libraries: pip install numpy pandas matplotlib seaborn scikit-learn Now, let's import them: import numpy as np import pandas as pd import matplotlib.pyplot as plt import seaborn as sns from sklearn.linear_model impor...
Read more