DEV Community

Lydia Ibuoye
Lydia Ibuoye

Posted on

1

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

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay