How to Publish A Static Website “Securely” on AWS:

Introduction:

In this project we will see how we can deploy the static website securely on AWS by using AWS CloudFront because it allows us to deploy the static website using https to encrypt the communication between users and our website, furthermore it allow us to restrict direct public access to S3 bucket where our website is allowed so we do not need to allow public access to our S3.

CloudFront caches your website’s content in multiple edge locations around the world. When a user requests a web page or resource, CloudFront serves it from the nearest edge location. By delivering content from edge locations, CloudFront reduces the load on your S3 bucket, resulting in faster response times and reduced server load.

CloudFront provides detailed logs and metrics, helping you gain insights into your website’s performance and visitor behavior.

Lets start the hands on!

First we will create a hosted zone in route53. I will name hosted zone as my domain name.

I will name it as my purchased domain name on godaddy:

Now copy the nameserver record of route 53 hosted zone, we will use these names in purchased godaddy domain,we’ll be using Amazon Route 53 for DNS management while keeping our domain registered with GoDaddy. This setup allows you to take advantage of Route 53’s features and reliability for DNS while continuing to use GoDaddy as your domain registrar.

Add these on godady domain:

Now we will create s3 bucket for website storation:

We will remain public access block because we will allow it through cloud front.

Enable static website hosting in our bucket in properties section:

Now we will serve this s3 site using cloud front, create a new cloud front distribution:

Choose your bucket in distribution name:

Use legacy access identities to restrict the public access directly to S3 bucket:

Allow only https views of your content:

Allow Web application firewall to save your website from different attack metrics like DDOS etc:

Once you create the distribution you will observe a policy in s3 bucket which is craeted by cloud front distribution:

Now upload the website content on s3 bucket in object section:

Now go to general setting fo your distribution and define index.html file to default root object option so whenever user come with url / it will route to index.html file of your website:

Now test with the dns name of your distribution:

Our static website is reachable now without allowing any public access and https traffic only.

Now time to add ssl/tls certificate to our website so that it will enable encrypted communication between the user and the website, it also provides data integrity, for this go to ACM (amazon certificate manager) and generate certificate for our website:

Now we have to give prove that upper given domain is our own.

Open certificate and click on create record in route 53 and click on create record:

Now we can see the additional CNAME record in our route53 hosted zone:

Now wait for sometime until route 53 sends the signal to certificate manager to that our validation complete for this certificate:

Now again go to cloud front distribution and add your certificate there:

Now open your distribution on browser it will open with https and valid SSL certificate also:

We can also add alternate domain name in our distribution so that we can access our website easily:

Also add this domain as new A record in route53 hosted zone or as CNAME record at purchased godaddy domain, i will use go daddy:

Now time to test our website with this new domain name:

Finally we deployed our secure website successfully on AWS with WAF, ssl certificate and https traffic.