Hosting a Static Website for Pennies a Month

For years I have been running a few very low traffic websites on various platforms. The first versions of these were run on a VM running LAMP that was costing me about $25.00 a month. About 3 years ago, I thought I could do better on cost and performance in EC2. So I bought a reserved t1.micro EC2 instance and a reserved t1.micro RDS instance both on a 3 year term. This allowed me to pay about $3.50 per machine per month. With the initial outlay to purchase the reserved instances figured in, I was paying about $15.00 per month to run my websites. That seemed reasonable.

Then Drupal 8 came out. I was still on Drupal 6 and I was looking to upgrade to the latest. The more I looked into it the more issues I found. There were a bunch of plugins that I had been using that were no longer being maintained and so I was going to have to either dispence with the functionality they provided or find replacements. The data migration task alone was worrysome and for what benefit? I was not updating these sites very often. I had turned of commenting for the most part. What did I need a dynamicly generated site for?

That’s when I discovered Hugo. This tool is terrific. It can take a large collection of documents and generate a static site for you in seconds. I started thinking that all I needed was a static site so I was going to get rid of the RDS and just serve it up with apache on my EC2 instance. But then I started thinking that there was no point to using apache when S3 provides static site hosting already. Just name your bucket the same as your domain name, turn on website hosting, and point your DNS at the endpoint. On top of that, you can setup CloudFront to distribute your content across the globe so your site loads quickly everywhere.

So I set out to port my sites from Drupal to Hugo/S3/Route53/CloudFront. I had always done something slightly unusual with my domain names since I detest the “www” prefix that most websites use. I had setup my apache to redirect www.foo.com to foo.com and I have several domains that are aliases for other domains. For instance I have a beer related blog called bigfatbrewer.com but I also have bigeffingbrewer.com, and bigfuckingbrewer.com. Both of which need to redirect to bigfatbrewer.com. So I needed to have a way of redirecting multiple domains to a main domain and a way to serve the static content so that CloudFront can access it. The solutions to these use cases are provided by S3 and Route53.

So here is a diagram of what I came up with:

Everything starts with Route53. When the browser looks up the DNS name it hits Route53’s DNS servers and gets back a set of IPs to access the domain. Since we are pointing the domain’s root A record at a CloudFront distribution, Route53 will return IP addresses that are appropriate for talking to the CouldFront edge servers nearest the browser’s physical location. CloudFront then uses DNS to look up the “origin” which I cleverly call “origin.hostname.com”. This Route53 entry points at an S3 bucket by the same name. This S3 bucket will contain all the static content for the website and be setup to serve as a static website. For redirecting the “www” subdomain to our main domain, the Route53 entry is pointed at another bucket named “www.hostname.com”. This bucket uses the features but instead of seting up for serving up content within the bucket, it is setup to redirect all requests to “hostname.com”.

Step By Step:

In the following steps I will refer to your base domain name as hostname.com but you should replace this with whatever your actual domain name is.

1. First create a bucket named “origin.hostname.com”.

   1. You will need to setup the static website hosting section as shown:

      

   2. Next change the permissions section to allow “Everyone” to list the contents of your site.

      

   3. Next select “Add Bucket Policy” and setup the bucket policy like this:

      

2. Next create a bucket named “www.hostname.com” and set the “Static Website Hosting” section in the properties like so:

   

3. Create a CloudFront distribution for your bucket:

   1. Select “Get Started” under “Web”

      

   2. Fill in the “Origin Settings” like so:

      

   3. Fill in the “Default Cache Behavior” Section like so:

      

   4. Fill in the “Distribution Settings” Section like so:

      

   5. Finally, press the “Create Distribution” button at the bottom.

4. Create a Route53 DNS records for your origin, www and root domain

   1. Root Domain:

      

   2. Origin:

      

   3. WWW:

      

Costs

Hosting a website that does not get a lot of traffic should not cost 15$ a month. That’s what I have been paying to run a t1.micro EC2 instance and a t1.micro RDS instance for the past 3 years. I bought a reserved instance for each ran Drupal on the EC2 instance and the RDS instance ran Mysql 5.5. It was great and a heck of a lot cheaper then I had been paying with a LAMP VM at another provider (25$/month). On that system I ran 9 websites most of which were just parked domains. There were 3 websites that actually had real content and a small amount of traffic. Now I pay about $0.55 a month per domain. $0.50 of that is the Route53 charge per zone.

According to the AWS Cost Caclulator hosting a website in this manner would only cost about $3.10 when it gets about 1,000,000 hits a month.