AWS-CodePipeline-and-CodeDeploy CI/CD

AWS CodeDeploy and CodePipeline enable seamless Continuous Integration, Continuous Delivery, and Continuous Deployment (CI/CD). Each change or commit to a GitHub repository triggers automatic updates to the corresponding instances, ensuring they accurately reflect the current state of the repository. This automation streamlines the development process, improving both efficiency and effectiveness.

Architectural Diagram

Step 1: Create 2 IAM roles: CodeDeploy EC2 Role AND CodeDeploy Role

Step 2: Setup EC2 instance

Create an EC2 instance in a public subnet. Configure the instance with the EC2 CodeDeploy Role instance profile and edit the EC2's security group to allow Port 80 from anywhere.

Install the NGINX webserver. Use commands:

sudo yum update
sudo yum install nginx
sudo systemctl start nginx
sudo systemctl enable nginx

# Check status:
sudo systemctl status nginx

Install the CodeDeploy Agent using commands:

sudo yum install -y ruby wget
wget https://aws-codedeploy-us-east-1.s3.amazonaws.com/latest/install
chmod +x ./install
sudo ./install auto

# Check status:
sudo service codedeploy-agent status

Verify functionality by accessing the instance IP. You should see a default NGINX webpage.

Step 3: Create CodeDeploy Application

Head to CodeDeploy > Applications > Create Application

Step 4: Create Pipeline

Connect to Github repository. Paste in your repo name if it does not pop up on the selection menu. > No filter > Skip build stage > Select CodeDeploy for as the deploy provider and select the CodeDeploy Application created from Step 3. > Create pipeline.

Step 5: Create appspec.yml file and upload files

Upload files. This example repository will contain index.html, style.css, and avatarmaker.png.

To change the contents of the webpage and include necessary resources, create appspec.yml file in the GitHub respository with the following configuration:

version: 0.0
os: linux
files:
 - source: /index.html
   destination: /usr/share/nginx/html
 - source: /style.css
   destination: /usr/share/nginx/html
 - source: /avatarmaker.png
   destination: /usr/share/nginx/html
hooks:
 BeforeInstall:
   - location: scripts/before_install.sh
     timeout: 300
     runas: root
 AfterInstall:
   - location: scripts/after_install.sh
     timeout: 300 
     runas: root

Create a Scripts folder with files after_install.sh and before_install.sh.

Within the before_install.sh include:

#!/bin/bash

# Stop Nginx service
service nginx stop

# Remove existing webpage files
rm -rf /usr/share/nginx/html/*

Within the after_install.sh file include:

#!/bin/bash

# Copy updated webpage files to Nginx document root
cp -r /path/to/updated/html/files/* /usr/share/nginx/html/

# Restart Nginx service
service nginx start

Step 6: Verify Functionality

Refresh the webpage. If everything is properly configured, you will be able to see the new webpage you've added! Any changes made to the GitHub repository will be updated automatically to the instance as well.

Finish! Congratulations you've setup and configured CodeDeploy and CodePipeline CI/CD!

Notes

• Make sure to install the CodeDeploy agent on EC2 instance.
• Change destination parameter in the appspec.yml file based on the OS/distributon + scripts.
• Delete and recreate scripts files in proper order (before 1st, after 2nd) if script error occurs.
• Connect/Install a new app when using a new repository.
• Make sure EC2 instance and CodeDeploy Application has proper IAM permissions.