I wanted to set up a blog that scales, is free and takes minimal effort from me to maintain. These days, there are multiple offerings that can be combined to achieve this. But, one of my requirements was also to be able to deploy my new posts and changes easily.
I wanted a set up where, once I make any changes, they go live immediately with little to no intervention on my part. I did not want to use medium or some other platform at the moment, because of various reasons that may or may not be applicable to everyone like flexibility on design and content, etc.
I finally ended up with following requirements for my blog:
- Scalability
- Security
- Fast load time
- Continuous Deployment
- Little to no maintenance cost
The solution was to generate a static website (HTML/CSS/JS), put that on Google Cloud Storage bucket and hook it up with bitbucket and CircleCI for continuous deployment. This set up achieved everything that I wanted from my website. There are a few alternatives to this, you can swap Google Cloud with AWS S3 + CloudFront, Bitbucket with GitHub, CircleCI with Bitbucket Pipelines or one of the many continuous deployment solutions available today. Touching on security a little bit, the set up is as secure as Google Cloud Bucket authentication and their infrastructure for Cloud Storage and other services I am using.
Static website generator: I picked Hugo (https://gohugo.io/) for this. It is a static website generator, open source, written in golang, has huge community support and many themes to pick from while starting out. It uses markdown for formatting and is very customizable. It was a good fit for my use case as I wanted a statically generated blog. Having developed some softwares in golang, templating was also familiar to me in case I wanted to implement any customizations.
Hosting: My choice of hosting of any static content right now, is AWS S3 + Cloudfront or Google Cloud Storage, which behaves like a CDN (Content Delivery Network) according to the Google Cloud documentation today. AWS can cost a few cents per month, while Google Cloud is practically free (https://cloud.google.com/storage/pricing), unless the website gets a lot of traffic.
Continuous deployment: Once the static website was generated, I put it up on bitbucket.org, which offers free git hosting for multiple private repos and can be linked to multiple continuous integration and continuous deployment (CI/CD) vendors. For continuous deployment, I picked CircleCI. They offer one container build, 1500 min/month in their free plan (https://circleci.com/pricing/) which was more than enough for me. Bitbucket pipelines is an alternate option for continuous deployment, but their free plan includes only 50 min/month of build time, which is substantially less than what CircleCI offers.
Tying this all together: My current setup has this website’s code stored in a bitbucket.org git repo. When I make a change and push a git commit, CircleCI automatically rebuilds my website with the latest content and uploads it to Google Cloud Storage bucket.
If you would like a similar set up, here are the steps:
Hugo (optional if you are designing your own HTML or using another static website generator):
- hugo quickstart: https://gohugo.io/getting-started/quick-start/
- run ‘hugo server’
- ‘public’ folder is the one that should be copied
Google Cloud:
- Sign up for Google Cloud
- Navigate to cloud storage console browser (https://console.cloud.google.com/storage/browser)
- Follow the instructions to make a public bucket (https://cloud.google.com/storage/docs/hosting-static-website)
Bitbucket:
- Create a new Bitbucket repo (bitbucket.org)
- Push the master branch to Bitbucket
CircleCI
- Sign up for CircleCI with Bitbucket (http://circleci.com/)
- Add a .circle/config.yml in root folder in project
- Start building the project
Git Repo with a sample config.yml: https://github.com/pagnihotry/static_website_circelci