Skip to content

My Sunday Project — Static S3 Hosting

Posted on:June 4, 2018 at 12:50 PM (3 min read)

Before I start, I might as well address some of the acronyms here for people who may be unfamiliar with AWS Services, or some other internet concepts:


After having looked through a few examples of using S3 buckets to serve static content, I couldn’t help but wince at the fact that most of these tutorials were getting people to create public buckets. I decided to make it easy to set up a CDN.

While this may be a relatively easy way of hosting your front-end, I couldn’t help but feel that there could be an easier way of fronting your app with a CDN by default. So, I set up a little boilerplate repo and created two separate CloudFormation templates.

While the initial set up of everything takes roughly 20 minutes (you are caching your front-end on all kinds of edge locations around the world), deployments take roughly 5 seconds (depending on your internet connection).

I wanted to ensure that I could also lock down my S3 bucket resources to something like an Office or Home IP address, so I set up a separate template that also creates a Web Application Firewall (WAF) blocking by default, and only allowing traffic from a defined IP range.

While the set up of S3 + CloudFront (CDN) + WAF may sound relatively expensive, I found it would actually be quite cheap to run a site that you wouldn’t expect to get much traffic to. The nice thing about CloudFront is that you don’t necessarily pay per the amount of requests to your distribution, but the amount of data you transfer out. For a simple app, you’d be lucky to transfer anything close to 100GB/month (which costs $4.25USD).

Take a look at the repo and let me know if there’s anything that concerns you. I think I’ve set the README up to be relatively simple to follow.