DEV Community

Lydia Ibuoye
Lydia Ibuoye

Posted on

HOSTING A STATIC WEBSITE ON AMAZON S3

Hosting a static website doesn’t have to be complicated or expensive. Amazon S3 (Simple Storage Service) provides a simple, scalable, and cost-effective way to host your website without needing a web server. In this guide, I’ll walk you through the steps to set up and host your static site on S3, making it accessible to users across the globe. Whether you're a developer or just getting started, you'll find S3 an easy solution for your hosting needs.

Image description

*Amazon S3 (Simple Storage Service)
*

Amazon S3 is a cloud-based storage service provided by AWS (Amazon Web Services) that allows you to store and retrieve any amount of data at any time. It’s designed for scalability, reliability, and ease of use, making it ideal for a variety of applications like data backup, archiving, and, as we'll cover here, hosting static websites. With S3, you pay only for the storage and data transfer you use, making it a flexible and cost-effective solution.

** Steps to Create an S3 Bucket:
**

  1. Log in to AWS Console and search for "S3". Image description
  2. Click “Create bucket” on the S3 dashboard.
  3. Enter Bucket Name and select a Region Image description
  4. Disable ACLs as recommended to control access of the files Image description
  5. Uncheck 'Block all public access' and check that you acknowledge what you have done Image description
  6. Review and Create the bucket. Image description

Your bucket is now ready for use!

Now that you have successfully created a bucket, let's look at the steps to uploading your static website on your S3 Bucket:

  1. Select the Bucket: Click the bucket name where you want to upload the file. Image description
  2. Click “Upload”: On the bucket’s page, click the "Upload" button. Image description
  3. Click “Add files” to choose a file from your computer. Image description Image description
  4. Review and Upload: Review settings and click “Upload” to add the file. Image description
  5. Navigate to "Properties" and scroll down to Static Website Hosting Image description
  6. Click "Edit" and then select "Enable" Image description
  7. Leave on "Host a Static Website"
  8. Enter the home page of your static file e.g. "Index.html", you can also upload an error page "Error.html" such as "404! This page doesn't exist which can be edited using tools like VS Code Image description
  9. Click on "Save changes" Image description

You can always access your website using this link
Image description

Congratulations on successfully hosting your website on Amazon S3

Image description

Top comments (0)