Member-only story
Build and Deploy a Jekyll Website
Create a static website with Jekyll and automatically deploy it to AWS S3 using CircleCI
Overview
In this post, I will explain the high-level architecture used to build my website using Jekyll and deploy it automatically using CircleCI to AWS S3.
Aside from storing images or files, S3 can also host static websites that are made up of HTML, CSS, and JavaScript.
Amazon gives you a 5GB free tier storage in S3, meaning there is no cost to host this solution. You will only pay for the Route 53 domain if you want your site to use a specific URL.
Jekyll
Jekyll is a simple, blog-aware, static-site generator, perfect for personal, project, or organization sites. Think of it as a file-based CMS, without all the complexity.
Jekyll takes your content, renders markdown and liquid templates, and spits out a complete, static website. Jekyll is the engine behind GitHub Pages, which you can use to host sites right from your GitHub repositories.
CircleCI
“CircleCI’s continuous integration and delivery platform helps software teams rapidly release code with confidence by automating the build, test, and deploy process.
CircleCI offers a platform that lets teams ramp quickly, scale easily, and build confidently every day.” — From https://circleci.com/about/
High-Level View
Jekyll is used to build the website and generate static content. Git is used to commit the code to GitHub (if you don’t know the difference between Git and GitHub, check out a future post on this).
GitHub sends a request (webhook) to CircleCI that will extract the code, build, run tests, and deploy to AWS S3 staging environment. Once the code has been tested and verified, manual approval is done on CircleCI that will start the build process and deploy it to the production environment.
