Logo

The Unbound Academy

Application Deployment Architectures

Hosting a Next.js App on AWS EC2

Nodejs
Nextjs
AWS
Nginx

Summary of Commands

Run the following commands on your EC2 instance:

sudo apt update && sudo apt upgrade -y
sudo apt install -y git curl nginx

Now, let's install Node.js (Nodejs 18.x LTS version) and npm:

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

Install PM2 globally:

sudo npm install -g pm2

Clone and Build:

git clone https://github.com/your-username/your-nextjs-project.git
cd your-nextjs-project 
npm install 
npm run build 
pm2 start npm --name "nextjs-app" -- start
pm2 save 
pm2 startup

Open Nginx Configuration:

sudo nano /etc/nginx/sites-available/default

Add the following code, Save and Exit:

server {
    listen 80;
    server_name your-domain.com;

    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}
sudo nginx -t 
sudo systemctl restart nginx

SSL (optional):

Install Certbot:

sudo apt install -y certbot python3-certbot-nginx
sudo certbot --nginx -d your-domain.com
sudo certbot renew --dry-run

Step 1: Launch and Set Up an EC2 Instance

  • Let's start by logging into the AWS Management Console.
  • Launch an EC2 instance with:
    • Ubuntu 22.04 or another preferred version.
    • A security group with HTTP, HTTPS, and SSH ports open (80, 443, 22).
  • We'll connect to our instance via SSH:
ssh -i path/to/your-key.pem ubuntu@your-ec2-public-ip

Step 2: Install Necessary Dependencies

Run the following commands on your EC2 instance:

sudo apt update && sudo apt upgrade -y
sudo apt install -y git curl nginx

Now, let's install Node.js (Nodejs 18.x LTS version) and npm:

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

Install PM2 globally:

sudo npm install -g pm2

Step 3: Clone Your Next.js Project from GitHub

Ensure your project is hosted on GitHub.

Clone the repository:

git clone https://github.com/your-username/your-nextjs-project.git
cd your-nextjs-project

Install dependencies:

npm install

Build your Next.js application:

npm run build

Start the application with PM2:

pm2 start npm --name "nextjs-app" -- start 
pm2 save 
pm2 startup

Step 4: Configure Nginx as a Reverse Proxy

Open the Nginx configuration file:

sudo nano /etc/nginx/sites-available/default

Replace the file content with the following (adjust the domain and IP accordingly):

server {
    listen 80;
    server_name your-domain.com;

    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

Test and restart Nginx:

sudo nginx -t 
sudo systemctl restart nginx

Step 5: (Optional) Set Up a Domain

  • Create an Elastic IP in the AWS Management Console and associate it with your EC2 instance.
    This ensures that your instance has a static public IP address.
  • Update your domain's DNS settings to point to your EC2 instance's Elastic IP.
  • Update the Nginx server_name directive with your domain name.

Step 6: (Optional) Secure with SSL (Let's Encrypt)

Install Certbot:

sudo apt install -y certbot python3-certbot-nginx

Obtain and configure an SSL certificate:

sudo certbot --nginx -d your-domain.com

Verify auto-renewal:

sudo certbot renew --dry-run