AWS Basics 1: How I hosted a static website on amazon S3

#aws #s3 #webdev

Introduction

Have you ever wondered how to host a static website on AWS? I certainly did! For a while, it felt daunting, and I kept putting it off. But when I finally decided to dive in, I was pleasantly surprised by how simple the process turned out to be. It was quite a journey, and I learned a lot along the way. I’d love to share my experience with you!

What You Need

An AWS account
About 20 minutes of your time

Let’s Start with What S3 Is

Amazon Simple Storage Service (S3) is a scalable cloud storage solution offered by AWS. It's designed to store and retrieve any amount of data from anywhere on the web. Here are some key features that make S3 an excellent choice for hosting static websites:

Scalability: S3 can handle any size of data, from a few bytes to terabytes, making it perfect for growing websites.
Durability and Availability: With a durability rate of 99.999999999% (11 nines), your data is safe and always accessible.
Cost-Effectiveness: You only pay for what you use, making it an economical option for hosting.
Static Website Hosting: S3 provides a straightforward way to host static websites without needing to manage servers.

In short, S3 is a reliable, efficient, and user-friendly option for anyone looking to host a static website.

Steps to Create Your S3 Bucket

Log in to the AWS Management Console.
Navigate to S3 and click "Create Bucket."
Configure Bucket Settings:
- Bucket Name: Choose a unique name for your bucket (this name must be globally unique across all of S3).
- Region: Select the AWS region where you want your bucket to be located. It’s best to choose a region closest to your target audience. (You can find this option in the top navbar.)
Set Permissions:
- Enable ACLs (for more fine-grained control over permissions in the S3 bucket).
- Uncheck "Block all public access" so that people can view your website.
Enable Bucket Versioning:

Think of it as similar to version control in GitHub.
Review and Create:
- Review your settings and click the Create bucket button. Your new bucket will be created!

Steps to upload your files

Upload your index.html file:

This file serves as the main entry point for your website.
Upload the folder containing all website assets:

Make sure to upload the folder that contains your CSS, JavaScript, images, and other assets. Note: Do not upload a zipped version, as S3 cannot unzip files.
Enable Static Website Hosting:

Go to the Properties section of your bucket and enable static web hosting and specify the default page of your website. This allows S3 to serve your website files directly.

Testing Your URL

Now, test the URL generated by S3. Did you encounter an error? If so, it’s likely because your bucket permissions need to be set to allow public access to your files.

Why the Error Occurs

By default, S3 buckets block public access for security reasons. It’s like having a beautifully displayed store window — everyone can see the store itself, but the products inside are locked away and inaccessible. To fix this, you need to change the permissions of your files to make them public. Once that’s done, visitors will be able to see and access your content as intended.