Amazon S3 Static Website
Jul 16, 2015
Static websites are a collection of HTML, Javascript, and CSS files that are (usually) generated from markdown. Static websites are highly cacheable since nothing on the pages change until you add new content. There is no need for a MySQL database or the use of PHP.
I have elected to use Hexo simply because of how easy it is to use. It allows you to write your posts in markdown and it generates static content for you to upload to S3, Rackspace, or to host on a normal VPS.
In order to host your static website on S3, you will need to generate two buckets and add a CNAME record. I am using CloudFlare as my DNS provider because they will cache the entire site and reduce bandwidth costs.
I will use example.com
as an example.
S3
-
Login to the AWS Management Panel and go to the S3 page.
-
Create a new bucket named
example.com
. -
Right click on the new bucket and go to
Properties
. -
A panel will appear on the right. Go to
Static Website Hosting
. -
Choose
Enable website hosting
and set yourIndex Document
toindex.html
.This first bucket is where you will upload your static website to. The next one is for redirecting only.
-
Create another bucket named
www.example.com
. -
Again, right click and go to
Properties
. -
This time you will redirect to another bucket.
Redirect all requests to another name
.Enter
example.com
. You will not upload any files to this bucket.
CloudFlare
-
Login to CloudFlare and go to your site DNS entries.
-
Delete all
A
records andCNAME
records forexample.com
andwww.example.com
. -
Add a new
CNAME
record for@
and point it to yourexample.com
hostname that was shown in AWS. -
Add another
CNAME
record forwww
and point it to your redirect bucket.
Upload content to your example.com
bucket and you’re done!