Configure a Static website using S3

Create an S3 bucket.

Upload some static files which contain a sample website.

Configure S3 as a host to serve those files as a site.

Step1 : Create an S3 Bucket

image

To host the website, a prerequisite is to have a domain and for this, we have to pick a name. In our case, we pick a name from freenom.com and you have to name your bucket as of your domain name

Here, i have created a bucket named as shruti2.tk as I had the domain as shruti2.tk

Step2 : Upload some static files which contain a sample website - Upload the html file named as index.html in your bucket and all Related image and stuff in the named folder.

Note - While uploading make sure to enable the public access mode

Step 3 : Configure S3 as a host to serve those files as a site - Go into the Properties -> static web hosting -> Enable

Next, go into the bucket permissions -> Bucket policy -> put the code of Grant Read Only Permission to anonymous user into the bucket policy

image

Step3 : Open the Route53 Services of AWS -> DNS Management -> Create a hosted Zone of same as the domain name

Now, we will request for the certificate from ACM, go to the console and search for ACM and request a public SSL/TLS certifificate and to validate it, create a record of the certificate in route 53, and it will get issued.

image

After that, go to the Cloudfront and paste the s3 link in the domain name and enable the option "Redirect to https from http" and in the CNAME, add your domain name, where you want it to get verified.

image

and now wait for few minutes and search for your URL in the browser

Finally check your URL on browser , it is showing the lock(e.g. shruti2.tk)

image

image

Certificate is issued by amazon

Note - when we have to host the static website using s3 with cloudformation and we dont want to make the bucket public, then we have to use this

image

https://aws.amazon.com/premiumsupport/knowledge-center/cloudfront-serve-static-website/
https://aws.amazon.com/premiumsupport/knowledge-center/cloudfront-serve-static-website/
https://aws.plainenglish.io/hosting-a-static-website-with-s3-cloudfront-7450ba2a203f