Amazon S3 Static Website

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

  1. Login to the AWS Management Panel and go to the S3 page.

  2. Create a new bucket named example.com.

  3. Right click on the new bucket and go to Properties.

  4. A panel will appear on the right. Go to Static Website Hosting.

  5. Choose Enable website hosting and set your Index Document to index.html.

    This first bucket is where you will upload your static website to. The next one is for redirecting only.

  6. Create another bucket named www.example.com.

  7. Again, right click and go to Properties.

  8. 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

  1. Login to CloudFlare and go to your site DNS entries.

  2. Delete all A records and CNAME records for example.com and www.example.com.

  3. Add a new CNAME record for @ and point it to your example.com hostname that was shown in AWS.

  4. Add another CNAME record for www and point it to your redirect bucket.


Upload content to your example.com bucket and you’re done!

hexo Related
Comments