Deploying a Static Website to AWS S3 using Jenkins

Hi Folks ! In this post we will be going to Deploying a Static Website to AWS S3 using Jenkins.There is a another options like Github action you can use that also but in this blog we will see using Jenkins in a very few steps.

To deploy a static webpage there are few pre-requisites which you should have basic understanding about.I will explaining everything step by step so any one can follow through:

• Basic Knowledge of AWS S3
• Jenkins Pipeline Basics

What is AWS S3?

Amazon S3 is a program that’s built to store, protect, and retrieve data from “buckets” at any time from anywhere on any device.Organizations of any size in any industry can use this service. Use cases include websites, mobile apps, archiving, data backups and restorations, IoT devices, enterprise application storage, and providing the underlying storage layer for your data lake.

Jenkins Pipeline

Jenkins pipeline is a collection of events or jobs which are interlink with one another in a sequence.It is a combination of plugins that support the integration and implementation of continuous delivery pipelines using Jenkins.

The definition of a Jenkins Pipeline is written into a text file called as Jenkinsfile which in turn can be committed to a project’s source control repository.

Creating a S3 Bucket for deploying a static webpage

Before creating a bucket there are few steps you have to perform:

• Create an IAM user and allow access to your S3 bucket.

If you don’t know how to create IAM user click on below link you will be able to create IAM user after reading that blog.

https://blog.knoldus.com/how-to-create-an-iam-user-in-your-aws-account/

Setting up the S3 bucket to host the static website files is a pre-requisite step before we go into setting up the pipelines.

• Login to the AWS Account and Navigate to S3 service page
• Create a new bucket which will be used to store the files.
• Name the bucket make sure name of bucket is globally unique.
• Select a region that makes sense for your site.
• Click ‘Create Bucket’

• Once the bucket is created, click on the bucket name to navigate to the bucket. Click on the Properties tab. On the Properties tab, click on the Static Web Hosting option.
• Enable Static website hosting from the options,. You will likely specify index.html as the index document (and error doc perhaps).

• Make sure the Access Control list on the bucket provides Public read access too.

At this point, you can place the files in your S3 bucket either via the s3 console, or your method of choice.I this blog I am using Jenkins pipeline to deploy .

Creating a Jenkins Job

Next we will need to create a Jenkins Pipeline .The pipeline will perform the task to upload the static files to S3.The Jenkisfile can be find in the Github repo. The Jenkinsfile is very simple and just consist of one stage.

To be able to upload to S3, you need to save your credentials in environment variables on your Jenkins:

AWS_DEFAULT_REGION=<region of bucket>

AWS_ACCESS_KEY_ID=<aws id>

AWS_SECRET_ACCESS_KEY=<your secret access key>

To do that, just go to Jenkins – Manage Jenkins – Configure System – Global properties – Environment variables.

Jenkinsfile Looks like this:

pipeline {
    agent any
pipeline {
    agent any
    stages {
        stage('deploy') {
            steps {
              sh "aws configure set region $AWS_DEFAULT_REGION" 
              sh "aws configure set aws_access_key_id $AWS_ACCESS_KEY_ID"  
              sh "aws configure set aws_secret_access_key $AWS_SECRET_ACCESS_KEY"
              sh "aws s3 cp Code/index.html s3://my-static-bucket-jenkins"
            }
        }
    }
}

You can find code in my Github repo link is here:

https://github.com/ahmadjubair33/static-webhosting-s3/

Since we will be using a Jenkinsfile that was push to a repository. We’ll use the Source Control Manager as the source of our pipeline script. So, Click on Pipeline tab and change the Definition to Pipeline script from SCM. Specify the following in their respective fields

SCM: Git
Repository URL: https://github.com/ahmadjubair33/static-webhosting-s3/
Branch Specifier: */master
Script Path: Jenkinsfile:

Let’s build the pipeline to test that it works. It should upload the files to the S3 bucket.

Therefore when you navigate to the website URL copied earlier or to the domain which was setup for this, it should show the index webpage.

Conclusion

So, with that we have successfully deployed a Jenkins pipeline to deploy the static website to S3.If you found this article helpful, leave some claps 👏 and share to help others see it. 🙂