Host a static website on Amazon S3
Published: 2024-04-07 11:29:41

**Step 1**

- Login to the AWS Console
- Navigate to the S3 and click Create bucket


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5iv1qsvwawg7su5vd79u.png)



**Step 2**

- Give your bucket a unique name
- Choose a region
- Select the ACLs disabled (recommended)
- Turn off block all public access (Note: this is not a good practice, but for this tutorial, we will turn it off
- Disable bucket versioning ( we don't need it for now)
- Enable the server-side encryption and choose the Amazon S3-managed keys (SSE-S3) encryption type
- Leave everything as default and click Create Bucket.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/23hhtinz68amzv4gn10s.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w150opg3ftobqpzoyq10.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v8lhsvxqfqr8zpikvws9.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4owwxtlzzv08bj9qa86f.png)


**Step 3**

- Now that our bucket has been created



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5lxfqw91yhxnzfrtaqxq.png)


- Click on the bucket we just created.
- Let's upload our website file to the bucket


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/czchvltk8fpj16j82t5d.png)



Now that our website file has been uploaded successfully. Let's make a few setting

**Step 4**

- Click on the properties tab and scroll down
- At the Static website hosting option, click edit to change the settings


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z38gfvhhpl67xorenoq3.png)


- Enable the static website hosting
- Select host a static website as the hosting type
- Input "Index.html" to specify the home or default page of the website.
- Input "error.html" if you have an error page or leave it (It's optional) and save changes.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qa2nrfgwmd77h294coxb.png)



**Step 5**

- Click the permission tab, we need to change some settings to enable our website to be accessed publicly
- Scroll to the bucket policy and click edit


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hwbv74v1yhzxhda85llq.png)



Now let's copy the blow policy and paste it into our text box and replace the bucket name with our own


```
{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicRead",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:GetObject",
                "s3:GetObjectVersion"
            ],
            "Resource": "arn:aws:s3:::bucket-web-app00/*"
        }
    ]
}

```

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kw5p261skf4klse1nhsw.png)


Click on save. Our bucket is now public and can be accessed by everyone


**Step 6**

- Let's go back to the properties tab
- Navigate to the static website hosting option
- Copy the URL or click on the link to access our website


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/97n00vrxnytrxspsun5h.png)



Viola! Our website is up and running


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lpqaoq9609lrer2dhf8t.png)



Congratulations! We have just successfully hosted our static website on AWS S3.