# Hosting a Static Website on Amazon S3 – Step by Step Guide

In this guide, I’ll show you how to host a static website on Amazon S3. A static website is a website with fixed content like HTML, CSS, and images. There’s no backend server or database needed, so it’s simple, fast, and cost-effective.

## What is Amazon S3?

Amazon S3 (Simple Storage Service) is a cloud-based storage service provided by AWS that allows you to store and retrieve any amount of data at any time. It is highly durable, secure, and scalable, making it ideal for storing files such as images, videos, documents, or entire websites. S3 provides features like access control, versioning, and cost-efficient storage, allowing you to manage your data reliably without worrying about underlying infrastructure or server maintenance.

Hosting a static website on S3 is popular because it’s simple, serverless, and cost-effective. A static website consists of fixed content like HTML, CSS, and JavaScript files, which don’t require a backend server or database. By uploading these files to an S3 bucket and enabling static website hosting, S3 can serve your site directly to visitors. This approach provides high availability, automatic scalability, and a public URL for easy access, making it a perfect solution for portfolios, blogs, landing pages, and other simple web applications.

## **Objective**

The goal is to host a static website by:

* Creating an S3 bucket
    
* Uploading website files
    
* Enabling static website hosting
    
* Setting permissions so anyone can access your site
    

A static website is one with fixed content like HTML, CSS, and images. There’s no backend or database involved, so it’s fast, secure, and cost-effective.

## **What You Need**

* An **AWS account** with administrative access
    
* Basic **HTML/CSS/JS** files for your website
    
* **AWS CLI** (optional, if you want to use commands instead of the AWS console)
    

## **Step 1: Log in and Create an S3 Bucket**

1. Go to the **AWS Management Console** and log in using your IAM credentials.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758177154787/2777c528-cd80-42b9-8439-d980f62f410b.png align="center")
    
2. Choose a **region** closest to you. This helps your website load faster.
    
3. In the search bar at the top, type **S3** and click the **Create bucket** button.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758177218900/5fb9bd7c-9168-4faa-89c4-ddc550472929.png align="center")
    
4. Give your bucket a **unique name**. (Bucket names are global, so no two buckets anywhere in the world can have the same name.)
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758177378397/8ab762f0-e168-4799-87c6-f1501fe79298.png align="center")
    
5. Leave all other settings as default.
    
6. Click **Create bucket**.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758177396880/82993594-9880-4ac0-bbf9-c114cf2dc291.png align="center")
    

Now your empty S3 bucket is ready to store your website files.

## **Step 2: Upload Your Website Files**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758177880278/3f6fbaaa-17bc-4a06-815c-84ee814d1fb2.png align="center")

Your bucket is currently empty, so we need to add our website files. One way to upload our project to the bucket is by using the AWS Management Console, and another way is by using the AWS CLI. In this tutorial, we will use the AWS CLI to upload our files.

Steps:

1. Open your terminal or command prompt.
    
2. Navigate to your project folder:
    
    ```plaintext
    cd \Downloads\2117_infinite_loop
    ```
    
    List your files to make sure you are in the right folder:
    
    ```plaintext
    ls
    ```
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758177981793/7afa2452-eeea-4fb8-87c6-107a584c07ba.png align="left")
    
3. Upload files to S3 using:
    
    ```plaintext
    aws s3 sync . s3://pravinmishrademo01/
    ```
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758178467866/5356c7d0-c68d-455a-9055-b8972288d308.png align="center")
    
    After uploading, you should see all your files in the S3 bucket.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758178508248/4f1a7a51-e51f-42be-9750-adbc6b121899.png align="center")
    

## **Step 3: Enable Static Website Hosting**

1. Click on your bucket → Go to **Properties** tab.
    
2. Scroll down to **Static website hosting** and click **Edit**.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758178602697/4585297a-8e1c-4b20-b87c-d4545db1e442.png align="center")
    
3. Choose **Enable**.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758178613016/20e6b796-9751-4435-8f29-5a31e5068c4a.png align="center")
    

This allows S3 to serve your website files as a real website.

## **Step 4: Set Index and Error Documents**

1. **Index document:** This is your homepage (usually `index.html`). When someone visits your website URL, this page will load automatically.
    
2. **Error document:** This is shown when someone visits a page that doesn’t exist (like `404.html`). It helps guide visitors back to your site.
    
3. Enter `index.html` for the index document and leave the error document as default (or add `404.html` if you have one).
    
4. Click **Save changes**.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758178862735/8fbcb834-29ea-4de2-8285-a0ded71674bb.png align="center")
    

S3 will now give you a **website URL** that you can use to visit your site.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758178884201/e59c13aa-9e17-4ea5-996d-56104b965807.png align="center")

When you try to visit the site using the bucket website endpoint, it gives an error because we have not set the bucket policy for website access and have not disabled Block Public Access.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758179333828/9903a8fc-207b-4ac8-ab75-b547a96ff593.png align="center")

## **Step 5: Make Your Website Public**

By default, S3 blocks public access. Your site won’t be visible until you allow it.

1. Go to the **Permissions** tab in your bucket.
    
2. Click **Block Public Access** → **Edit** → Disable it → Save changes.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758179528240/c21cdab1-e790-4789-89a6-2efb1374ffc3.png align="center")
    
3. Add a **Bucket Policy** to allow everyone to read your files:
    
    * Go to **Permissions → Bucket Policy → Edit**.
        
    * Add this policy (replace `your-bucket-name` with your actual bucket name):
        
        ```plaintext
        {
          "Version": "2012-10-17",
          "Statement": [
            {
              "Sid": "PublicReadGetObject",
              "Effect": "Allow",
              "Principal": "*",
              "Action": "s3:GetObject",
              "Resource": [
                        "arn:aws:s3:::pravinmishrademo01/*"
               ]
            }
          ]
        }
        ```
        
4. Save the policy.
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758179547500/727d5bd0-fbd6-4771-a047-ff6aff6de1c0.png align="center")
    

Now your website is **live and publicly accessible** using the URL from static website hosting.

## **Step 6: Test Your Website**

* Copy the URL from the **Static Website Hosting** section in S3.
    
* Open it in a browser.
    
* Your static website should load perfectly.
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1758179627430/549194e2-62d4-4d80-b106-1928850efdd1.png align="center")

## **Conclusion**

Hosting a static website on AWS S3 is easy and beginner-friendly. You don’t need a server or database. By following these steps, you can make your website live and accessible to anyone. This is perfect for portfolios, blogs, landing pages, or documentation websites.