DEV Community

Cover image for Blue-Green Deployment of a Next.js App on EC2 Using AWS CodeDeploy

Blue-Green Deployment of a Next.js App on EC2 Using AWS CodeDeploy

In this blog, we'll walk through setting up a Blue-Green deployment strategy for a Next.js application hosted on Amazon EC2 instances.

With Blue-Green Deployment we can deploy application updates with zero-downtime and we will be using AWS services like EC2, Auto-Scaling, Load Balancing and Code Deploy.

Step 1: Setup AMI Image for Auto-Scaling

In AWS Auto Scaling, an Amazon Machine Image (AMI) acts as the blueprint for launching new EC2 instances. Setting up a custom AMI ensures that every instance in the Auto Scaling group launches with the exact configuration needed (OS, applications, libraries, security settings, etc.).

Steps:

  • Launch a Base EC2 Instance

Start an EC2 instance with a base AMI (like Amazon Linux or Ubuntu).

  • Customize the Instance

Install required software, configure settings, apply security patches, and set up your application.

Here, we need to make sure CodeDeploy agent is installed and running.

# Update packages
sudo apt-get update -y

# Install dependencies
sudo apt-get install ruby-full wget unzip -y

# Download and install the CodeDeploy agent
cd /home/ubuntu
wget https://aws-codedeploy-<region>.s3.amazonaws.com/latest/install
chmod +x ./install
sudo ./install auto

# Start and enable the agent
sudo systemctl start codedeploy-agent
sudo systemctl enable codedeploy-agent

# Verify status
sudo systemctl status codedeploy-agent

Enter fullscreen mode Exit fullscreen mode
  • Create the AMI

Step 2: Use the AMI to create a Launch Template

When creating a launch template or configuration for your Auto Scaling group, specify the custom AMI ID.

Creating a launch template

We do this to make sure all the instances that we will launch by Auto-scaling are identical, reliable and also ready to serve traffic immediately upon startup.

Step 3: Create a Load balancer

Create a load balancer after navigating to the EC2 dashboard. Select Internet-facing as the scheme. Add a listener on port 80(HTTP) or 443(HTTPS). Under Availability Zones, select your VPC and the subnets across at least two availability zones. Then , we need to configure a security group that allows inbound traffic on the listener port ( HTTP:80).

Create a new Target Group or select an existing one and select Instance or IP as the target type. Select an appropriate health check path. We need to point the app’s health check endpoint here.

Step 4: Set up Auto Scaling Group with the launch template

Navigate to Auto-Scaling Group in the dashboard and click Create Auto Scaling Group. Choose the appropriate VPC and subnets for our instances.

Select the launch template we created earlier.

Choose the launch template

Attach the internet-facing Application Load Balancer we created earlier to the auto scaling group.

Attach the load balancer to the Auto Scaling Group

Define the scaling capacity as required ;minimum: 2, desired: 2, and maximum: 3 instances. Finally, review all settings and click "Create Auto Scaling Group" to complete the setup.

Define the scaling parameters

We need to make sure our source code repository includes a valid appspec.yml file in the root directory. This file tells CodeDeploy how to deploy your application and when to run specific scripts during the deployment lifecycle.

version: 0.0
os: linux
files:
  - source: /
    destination: /home/ubuntu/app

hooks:
  BeforeInstall:
    - location: scripts/stop_server.sh
      timeout: 60
  AfterInstall:
    - location: scripts/install_dependencies.sh
      timeout: 120
  ApplicationStart:
    - location: scripts/start_server.sh
      timeout: 60

Enter fullscreen mode Exit fullscreen mode

Step 5: Create application and deployment group with CodeDeploy

Navigate to AWS CodeDeploy, go to Deploy > Applications, and click Create Application". After creating the application, proceed to create a Deployment Group by filling in all the required details such as service role, deployment type, and environment configuration. The deployment type should be set to Blue/Green.

Deployment Type

Select the Load Balancer we created earlier and attached to the auto-scaling group , then click Create Deployment Group to complete the setup.

Make sure to select the correct deployment settings as per requirement.

Deployment Settings

Make sure to select how long you want to keep the older instance running. It is relevant to completion of the code pipeline run. Here I have chosen to terminate the instances immediately.

Step 6: Integrate this CodeDeploy application to the CodePipeline

To integrate CodeDeploy with CodePipeline, navigate to AWS CodePipeline and create or edit an existing pipeline. In the Deploy stage, choose AWS CodeDeploy as the deployment provider. Select the previously created CodeDeploy application and deployment group. This will link our pipeline to the deployment process, allowing automated deployments to our EC2 instances whenever new changes are pushed from your source repository.

Step 7: Blue/Green Deployment

Now we can monitor our blue/green deployment process in the CodeDeploy console. Blue/Green deployments allow quick rollback if something fails.

In the first step, a replacement instance is provisioned.
Replacement Instance being created

In the second step, our application will be installed in the replacement instance launched.

Application being installed in the replacement instance

Then, the next step is blocking the traffic to the original instance and redirecting traffic to the new instance. We can track the progress of this in the CodeDeploy console.

Traffic being moved to the replacement instance

Finally, when the traffic is shifted to the replacement instance, the original instance is then terminated.

Deleting the original instance

By combining CodeDeploy Blue-Green deployment with EC2, Auto Scaling, Load Balancer and CodePipeline, we can achieve seamless, zero-downtime deployments for our Next.js application—ensuring high availability, easy rollbacks, and production-grade scalability on AWS.

Top comments (0)