Amazon EC2 Tutorial : Hosting Mean Stack Application

Amazon EC2 Tutorial : Hosting Mean Stack Application

   January 05, 2020       Codez Tech

---

Amazon EC2 is one of the most used and most fundamental services in AWS, so it makes sense to start there when you are new to the platform. But the first question is: what is EC2 in AWS?

Amazon EC2 — Hosting a MEAN Stack Application

The below topics are covered in this blog -

1) What is EC2 in AWS?
2) The MEAN stack CRUD application
3) Architecture of the application
4) Installing MongoDB on an EC2 instance
5) Hosting the MEAN stack with PM2

1. What is EC2 in AWS?

To keep it simple:

1. EC2 is basically a virtual machine with its own CPU, RAM, and storage.
2. It lets you choose a platform — Windows, Linux, Ubuntu, and so on — when you launch the machine in the cloud.
3. Each virtual machine is called an instance, and you can start, stop, or terminate it whenever you like.

2. AWS EC2 MEAN Stack Application Screens

Here are a few screens from the MEAN stack CRUD application we are going to host on AWS EC2.

Insert

MEAN Stack CRUD Application — Insert

Update

MEAN Stack CRUD Application — Update

Delete

MEAN Stack CRUD Application — Delete

3. Architecture of the MEAN Stack Application

The diagram below shows the architecture we are setting up across two AWS instances. The frontend uses Angular, and every user interaction — create, read, update, delete — goes through Node.js.

MEAN Stack Application Architecture

Node.js acts as the mediator that talks to the MongoDB database and returns data to the frontend. We use two instances — one for the frontend and one for the backend.

MEAN stack frontend project:

git clone https://bitbucket.org/atique12/mongocrud_application_frnt_end.git

MEAN stack backend project:

git clone https://bitbucket.org/atique12/mongocrud_application_back_end.git

If you want to learn more about the MEAN stack, see my related blog post: MEAN Stack Angular CRUD Application.

4. Installing MongoDB on an AWS EC2 Instance

If you haven't registered on AWS yet, do that first. Then launch an Ubuntu instance, download the PEM key, and open your terminal:

ssh -i yourkey.pem ubuntu@your_ec2_public_ip

Once you are logged in, install MongoDB. Reference links:

MongoDB — Install MongoDB Community Edition
GUI client — Robo 3T (formerly Robomongo)

Reference repository for this tutorial:

git clone https://bitbucket.org/atique1224/aws-ec2-tutorial.git

5. Hosting the MEAN Stack with PM2

On the second Ubuntu instance, install Node.js, NVM, the Angular CLI, and PM2, then clone the code onto the instance.

Install Node.js

sudo apt update
curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash -
sudo apt-get install -y nodejs

Install NVM (to switch Node.js versions)

wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash
source ~/.profile
nvm ls-remote

Install the Angular CLI

sudo npm install -g @angular/cli

Install PM2 (to keep the app running)

sudo npm install -g pm2

Clone both projects

git clone https://bitbucket.org/atique12/mongocrud_application_frnt_end.git
git clone https://bitbucket.org/atique12/mongocrud_application_back_end.git

Point the code at your instances. By default the projects use localhost. You need to replace that with your EC2 public IPs:

• Backend — in db.js, set the MongoDB instance's public IP; in index.js, set the backend instance's public IP.
• Frontend — in src/app/shared/person.services.ts, change localhost to the backend instance's public IP:

vi src/app/shared/person.services.ts

One important note: pointing the frontend at a raw EC2 public IP hardcodes an address that changes every time the instance restarts, unless you attach an Elastic IP. For anything beyond a demo, put the backend behind a stable hostname or load balancer rather than baking the IP into your source.

6. Video Walkthrough

More videos in this series:

---

About the Author
Atique Ahmed — Principal AI Architect. 7x Microsoft MVP and Guinness World Record holder for Programming Excellence. Founder of Codez Tech.
Portfolio  |  LinkedIn  |  GitHub