Looking at the devops solutions in AWS, I was searching for a project to try them out. This static website came to mind. The goal was to try AWS CodeCommit, CodeBuild and CodePipeline to automate the publishing of this static website.

Upload your site to AWS CodeCommit

Go to your blog folder and initialize git for source code management.

cd myblog
git init

For jekyll, I setup my .gitignore to exclude the following files.

_site
.sass-cache
.jekyll-metadata
.idea

Create a repo in AWS CodeCommit for your blog.

awscodecommit

Set your remote repository to the newly created repo and push your code there.

git remote add origin ssh://myblog/repo/path
git push origin master

Setup AWS CodeBuild to build your site

In AWS CodeBuild, create a build project and specify in the source provider the CodeCommit repository you previously created for your blog.

awscodebuildsrc

In the environment section, choose Ubuntu server and Ruby as the runtime builder. Remember that Jekyll build uses Ruby.

awscodebuildenv

In the Buildspec section, use the below buildspec.yml file and store it in the root folder of your code.

You can store it in other folders but make sure to tell CodeBuild where it is located.

version: 0.2

phases:
  install:
    commands:
      - echo "******** Install Bundles ********"
      - bundle install
  build:
    commands:
      - echo "******** Building Jekyll site ********"
      - JEKYLL_ENV=production bundle exec jekyll build
artifacts:
  base-directory: '_site'
  files:
    - '**/*'
  name: code.eidorian.com-$(date +%Y-%m-%d-%H%M%S)

A few things to note in this buildspec file:

  1. The bundle install command installs the gems specified in the Gemfile of your blog.
  2. The bundle exec jekyll build builds the blog site itself in the _site folder.
  3. The artifacts section tells CodeBuild the location of the artifacts and this will be used later by CodePipeline in the deployment.
  4. The base-directory and files ensures that the folder _site will be excluded in the artifacts and only its contents will be deployed.

Know more about the buildspec syntax from AWS documentation here.

Use AWS CodePipeline to orchestrate the build and publishing

Finally, create an AWS CodePipeline to trigger a build whenever you push your code to CodeCommit and deploy the site to your target S3.

awspipecreate

There are three stages to the pipeline - source, build and deploy.

Source

Specify in the source stage your CodeCommit repository and the branch to be built. This is the master branch by default. Also choose the recommended CloudWatch Events as the trigger for the build.

awspipecreate

Build

In the build stage, choose the CodeBuild project you just created.

awspipecreate

Deploy

Then in the deploy stage, choose the S3 bucket that is hosting your static website.

awspipecreate

Review your pipeline and create it.

Trigger the pipeline by pushing a code change in your blog or manually doing it via Release change.

awspipecreate