// TOM WARSOP

Hosting a Static Website in AWS S3

2024/05/24
Tags: Website Hosting AWS S3 Route 53

Introduction

A cheap and hassle free method for hosting a static website (one where the content doesn't change) uses S3 in AWS. The following goes over the steps for deploying such a website to S3.

In the following steps, replace mysite.com with your actual website name.

It's also assumed in this tutorial that you have already acquired the domain via Route 53 (another AWS service).

Create the S3 Buckets

  1. Create two buckets: mysite.com and www.mysite.com leaving all default values
  2. Upload website files to the mysite.com bucket

Enable Static Website Hosting

  1. Select the mysite.com bucket
  2. Select "Properties"
  3. Under "Static website hosting" click "Edit"
  4. "Enable" static website hosting
  5. Under "Index document" enter the filename of the index document, e.g. index.html
  6. "Save changes"

Allow Public Access

  1. Select the mysite.com bucket
  2. Select "Permissions"
  3. Under "Block public access (bucket settings)" choose "Edit"
  4. Clear the ticket "Block all public access"
  5. "Save changes"

Attach Public Read Access Policy

  1. Select the mysite.com bucket
  2. Select "Permissions"
  3. Under "Bucket Policy" choose "Edit"
  4. Paste the following in:
                                    
    {
        "Version": "2012-10-17",
        "Statement": [
            {
                "Sid": "PublicReadGetObject",
                "Effect": "Allow",
                "Principal": "*",
                "Action": [
                    "s3:GetObject"
                ],
                "Resource": [
                    "arn:aws:s3:::mysite.com/*"
                ]
            }
        ]
    }
                                    
                                
  5. "Save changes"

Test the Website Works

  1. Select the mysite.com bucket
  2. Select "Properties"
  3. Under "Static website hosting" click the link under "Bucket website endpoint"
  4. The website should load

Subdomain Bucket Redirect

  1. Select the www.mysite.com bucket
  2. Select "Properties"
  3. Under "Static website hosting" choose "Edit"
  4. Check "Enable"
  5. Check "Redirect requests for an object"
  6. In "Host name" enter mysite.com
  7. Set "Protocol" to "http"
  8. "Save changes"

Create Alias Records for the Root Domain and Subdomain

  1. Open Route 53
  2. Choose "Hosted Zones"
  3. Select the mysite.com domain
  4. Choose "Create Record"
  5. Choose "Simple routing" (may need to select "Switch to wizard" first)
  6. Click "Next"
  7. Choose "Define simple record"
  8. In "Value/Route traffic to", choose "Alias to S3 website endpoint"
  9. Choose the Region
  10. Choose the S3 bucket - mysite.com
  11. Set "Evaluate target health" to "No"
  12. Click "Define simple record"

Repeat the above steps for the subdomain. This is the same except when defining the simple record enter www under "Record name" for the subdomain and choose the S3 bucket for www.mysite.com

The End

You should now be able to access your website by visiting either mysite.com or www.mysite.com