Lessons Learned: Creating a Static Website in S3 (S3, Route 53)

One of the first cloud projects I decided to undertake was creating a static website with my own domain.

Getting a custom domain

I used the Route 53 service to register a personal domain in Route 53: mabdulkadir.com. Route 53 is both a domain registrar and DNS service – which will be important later on in this project (as it has the ability to manage records associated with a hosted zone.

Making the website in S3

S3 is an object storage service with virtually unlimited storage. The objects (“files”) can be uploaded into buckets, and among many features, buckets in S3 are able to be hosted as static websites, assuming that there is a file that can be displayed on the Internet. For my project, I decided to upload a simple “index.html” file with a few lines of text: “Welcome to my website Now hosted on Amazon S3!”. I created the bucket, uploaded the index.html file, and then turned on Static Website Hosting on the bucket, using the index.html file as the “index document”, which would become the default page for the website.

Giving the bucket the right access permissions

S3 Buckets by default are not accessible from Internet, and this is because of a bucket level setting called “Block all Public Access”. I unchecked this setting for my newly created bucket in order for it to be publicly accessible. However, there was another factor to consider: even though the bucket could now be accessed publicly, users would still need permissions in order to access the bucket files. For this, I used a resource policy in S3 called an S3 Bucket Policy, and changed it from the default policy to this:

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::mabdulkadir.com/*"
        }
    ]
}

This policy allows all principals to “get” (retrieve) any object within the bucket. This means that once a user accesses the bucket, they would be able to access the index document and view its contents as a web page in their browser, thus allowing users from the Internet to access our website.

Connecting the domain to the static website

Now that the website was working and permissions were granted, I then had to ensure that our website could be accessed through the custom domain name. Route 53 is also a DNS service, and one of its capabilities is being able to manage DNS records from within the service for the hosted zone associated with your domain. In order to route HTTP requests for our domain to our website, I created two Alias (A) records (one for mabdulkadir.com, and one from www.mabdulkadir.com) directing from the two domains to the S3 bucket endpoint.

Lessons Learned

This project helped me to solidify basic concepts of DNS, as well as being able to put my knowledge of Route 53 and S3 into practice, through the creation and management of domains and alias records, resource-based policies, and static website hosting within S3. While I’ve since used this domain for this website instead (which is another more complex cloud project that I’ll soon write about!), this project helped me to understand how these services interact with each other, and envision how these could potentially be used in real life use-cases.