AWS S3 is great for hosting highly available and reliable files. Users can use a web browser to access the files as if browsing a website if public access is enabled on your S3 bucket. A public S3 bucket, however, does not allow for the following:

  • Custom domain name
  • Custom error pages
  • Index document for root path
  • 301 redirects

AWS S3 bucket can be used to host highly scalable and available static websites by enabling Static Website Hosting option for the S3 bucket.

Steps to host static website on AWS S3:

  1. Create a public S3 bucket to host your website if you don't already have one.
  2. Go to S3 section in your AWS Console.
  3. Click on the S3 bucket that you want to host your static website.
  4. Click on the Upload button to start uploading static files to your S3 bucket.
  5. Click on Add files button to open the file dialog window.
  6. Select files to upload and and click on the Open button.

    Use [SHIFT] and [CTRL] button on the keyboard to select multiple files.

    At the very least, upload files to be used as the index document (default HTML file for the website), and error document (HTML file to display any errors to the visitor.)

  7. Click on Upload button at the bottom to begin uploading the selected files.
  8. Click Close to return to the bucket page.
  9. Click on the Properties tab.
  10. Scroll down to the Static website hosting section.
  11. Click on the Edit button.
  12. Click Enable on the radio select button.
  13. Use default option (Host a static website) in the Hosting type section.
  14. Specify the name of the Index document file.
  15. Specify the name of the Error document file.
  16. Enter redirection rules if there's any in the Redirection rules field and click on the Save changes button.

    Click on the Learn more link to get more information.

  17. Scroll down to the Static website hosting section.
  18. Click on the link in the Bucket website endpoint section.

    The file specified in the Index document section will be displayed.

  19. Access nonexistent file to simulate a file not found error.

    The file specified in the Error document section will be displayed.

Discuss the article:

Comment anonymously. Login not required.

Share!