Hosting a Static Website on Amazon S3

In this blogpost, I'll be showing how to host a static website on the cloud using Amazon's S3 Storage service.

Step 1: Search for S3 in the search bar or just click on S3 in the "Recently Visited" block.

Step 2: Click on "Create a Bucket" 

In Amazon S3 terms, we store our stuff, whatever it might be, a webpage, an image .. everything is considered as an "object" and these objects get stored in "buckets". The "object" have their own "key" which is nothing but the unique Amazon S3 URL of the "object" itself.

Step 3: Now here, give a name for your S3 bucket and select your nearest region.

Step 4:  For this, just untick  "Block all public access" and tick that acknowledgement thing too.

Step 5: Once you've successfully created the S3 bucket. Click on the S3 bucket name and go to the Properties tab. Then, look for static website hosting  and then click on "Edit". Then click on "Save Changes". 

Step 6: Under Static Website Hosting settings, just follow the below pic. Then click on "Save Changes".

Step 7: Now once you've created, go to "Objects" tab. Then click on "Upload" to upload the static webpage you've created. You can use mine as a template too. 

Step 8: Once you've uploaded succcesfully, you need to edit the S3 Bucket permissions, so you can access the website from anywhere. To do that, go to Permissions tab. Under it, find "Bucket Policy" and click on "Edit."

Step 9 : In the Policy Editor, just paste in the JSON document that I've given below and just replace your Amazon S3 bucket name in place of the placeholder. Then click on "Save Changes".

{

    "Version": "2012-10-17",

    "Statement": [

        {

            "Sid": "PublicRead",

            "Effect": "Allow",

            "Principal": "*",

            "Action": [

                "s3:GetObject",

                "s3:GetObjectVersion"

            ],

            "Resource": "arn:aws:s3:::<your-bucket-name>/*"

        }

    ]

}

Step 10: Now you can access your website by going to the Properties > Static Website Hosting. Then copy the S3 Bucket URL, paste it and finally, you will be able to view your static webpage!