CI / CD for a Static Website hosted on Amazon S3

In continuation to the blog post Self-hosting Secured Static Web Site using S3, Route 53, ACM, CloudFront, let's set up the continuous integration and continuous deployment using AWS CodePipeline to get the source from GitHub and deploy it to the static website (my personal site https://bhuvana.pro), hosted in the Amazon S3 bucket as using AWS CodePipeline

AWS Services Used

• Amazon S3
• AWS CodePipeline
• Identity & Access Management

Amazon S3

Amazon Simple Storage Service (Amazon S3) is storage for the internet and static website hosting functionality helps you to host a static website on S3 bucket without the need to provision and manage servers to meet the scale. Read here for more details on how to use S3.

AWS CodePipeline

AWS CodePipeline is a fully managed continuous delivery service that helps you automate your release pipelines for fast and reliable application and infrastructure updates. CodePipeline automates the build, test, and deploy phases of your release process every time there is a code change, based on the release model you define. Click here to read more.

CodePipeline Components

Pipeline - A pipeline is a workflow construct that describes how software changes go through a release process. You define the workflow with a sequence of stages and actions.

Stage - A stage is a group of one or more actions. A pipeline can have two or more stages.

Action - An action is a task performed on a revision. Pipeline actions occur in a specified order, in serial or in parallel, as determined in the configuration of the stage.

Transition - The stages in a pipeline are connected by transitions, and are represented by arrows in the AWS CodePipeline console. Revisions that successfully complete the actions in a stage will be automatically sent on to the next stage as indicated by the transition arrow. Transitions can be disabled or enabled between stages.

Identity and Access Management

AWS Identity and Access Management (IAM) is a web service that helps you securely control access to AWS resources. You use IAM to control who is authenticated (signed in) and authorized (has permissions) to use resources. Click here to read more

Create & Configure Pipeline

You will see a two-stage pipeline to setup automated deployment for every commit into GitHub to the static website hosted on Amazon S3.
The Pipeline setup is a five-step process as detailed below

Step 1: Pipeline

• Sign in to the AWS Management Console and open the CodePipeline console at http://console.aws.amazon.com/codesuite/codepipeline/home
• Create a new Pipeline with the following settings. Leaving the New Service Role as default will create a new service role and assign required permissions

Step 2: Source

Choose GitHub (Version 2) as source provider, connection string, repository name, and the branch.
Enable the change detection option by checking Start the pipeline on source code change so that your pipeline starts automatically when a change occurs in the source code. Leave the Output artifact format to CodePipeline default.

 The GitHub (Version 1) action is not recommended since it uses OAuth apps to access your GitHub repository. Instead, choose the GitHub (Version 2) action to access your repository by creating a connection. Connections use GitHub Apps to manage authentication and can be shared with other resources.

Connection String:

In order to connect to GitHub, click Connect to GitHub, enter the connection name, select the GitHub App, if it is already configured else click Install a new app to authenticate against your GitHub account.

Step 3: Build

The build stage is not required, since we are going to deploy a static website to the Amazon S3 bucket and no code compilation involved

Step 4: Deploy

Choose Amazon S3 as deploy provider with the region where your S3 bucket hosting the static website is created, the bucket name, and check Extract file before deploy in order to deploy the artifact before deployment (you may ignore Deployment path & Additional configuration as default).

Step 5: Review

When all the configuration is done, preview to verify your changes and create the pipeline

Pipeline Output

As soon as the pipeline is created, the first execution is initiated. Subsecuted deployments will be triggered whenever a change is committed to the integrated branch or when you explicitly click Release Change button. Your resulting pipeline will look as follows when the deployment is successful and will show the commit id and comment added for commit.

Can I disable a Pipeline?

You can disable a transition from one state to another (in our case from source to deploy) but cannot disable or deactivate a pipeline.

AWS Code Pipeline Pricing

• You pay only for what you use. AWS CodePipeline costs $1.00 per active pipeline* per month.
• An active pipeline is a pipeline that has existed for more than 30 days and has at least one code change that runs through it during the month. There is no charge for pipelines that have no new code changes running through them during the month. An active pipeline is not prorated for partial months.
• As part of the AWS Free Tier, AWS CodePipeline offers new and existing customers one free active pipeline each month.
• You may incur additional charges for storing and accessing your pipeline artifacts in Amazon S3 and for triggering actions from other AWS and third-party services that you connect to your pipeline.

So in our example, I would expect a $1 bill per month if there are changes committed to my GitHub repo.