How to configure DNS using Route 53 for providing domain name to a static website?

For this blog post, I will be providing you detail process for configuring DNS using Route 53 for providing domain name for the static website.

What are the prerequisition before configuring DNS using route 53?

Before viewing this blog post, please make sure to host your website using Amazon S3. If you require guidance for hosting your static website, please go to the link which has been provided below:

Also, you should have your own domain name to execute the following steps. You can purchase your own domain from the link provided below:

https://www.namecheap.com

Procedure for configuring DNS using Route 53

Step 1: Sign In to the AWS Management Console. If you require guidance to Sign In to your AWS Management Console please view the link provided below.

https://www.linkedin.com/pulse/sign-your-aws-educate-account-hrishav-tandukar/

Image for post
Image for post

Step 2: Search for “Route 53” in Find services. After “Route 53” appears in drop down, Click on it.

Image for post
Image for post

Step 3: After you click on “Route 53” you are now redirected to the page as shown below. Here, in DNS management you need to click on “Create hosted zone”.

Image for post
Image for post

Step 4: Once you click on “Create hosted zone”, you are redirected to the following page. Now, click on “Create Hosted Zone”.

Image for post
Image for post

Step 5: Again, click on “Create Hosted Zone”.

Image for post
Image for post

Step 6: Now, in Create Hosted Zone provide the Domain name same as the bucket name i.e. positivestud.com. Then, click on “Create” button.

Image for post
Image for post

Step 7: After you have created Hosted Zones, click on “Create Record Set” in order to map our S3 bucket and Route 53 DNS.

Image for post
Image for post

Step 8: In Create Record Set, for now you can leave Name as empty, select “Yes” in Alias, and in Alias Target, search for your S3 bucket name.

Image for post
Image for post

Step 9: After you find your S3 bucket, select your S3 bucket in Alias Target.

Image for post
Image for post

Step 10: Now you can click on “Create” button.

Image for post
Image for post

Step 11: After clicking on “Create” button, now you are required to manage/configure your Nameserver.

Image for post
Image for post

Step 12: Open the website from which you have bought your domain name and select the domain name in which you are willing to present your static website.

Image for post
Image for post

Step 13: In NAMESERVERS, select “Custom DNS”.

Image for post
Image for post

Step 14: Now, go back to page where you had created Hosted Zones. Copy the Nameservers.

Image for post
Image for post

Step 15: Paste Nameservers in the website from which you had bought your Domain one by one as shown in the image below.

Image for post
Image for post

Step 16: After you have provided your NAMESERVERS, click on tick mark which has been indicated through a purple rectangle box in the image below.

Image for post
Image for post

Step 17: In your browser now, you can open your website through domain name.

Image for post
Image for post

Step 18: But the problem occurs in case if you provide www. before your domain name as shown in image below.

Image for post
Image for post

Step 19: Now, in order to solve this issue go back to AWS Management Console.

Image for post
Image for post

Step 20: Search for “Amazon S3” in Find Services and select “S3” after it appears in drop down list.

Image for post
Image for post

Step 21: Now, create a bucket and this time provide www. before the name of your bucket i.e. www.positivestud.com. Then, click on “Next” button.

Image for post
Image for post

Step 22: In Configure options, for now you are not required to make any changes. Hence, click on “Next” button.

Image for post
Image for post

Step 23: Now we need to Set permissions for our bucket. Here, you are required to uncheck “Block all public access” and check “I acknowledge that the current settings may result in this bucket and the objects within becoming public”. Then, click on “Next” button.

Image for post
Image for post

Step 24: Here, in Review tab you can view all the configurations that you have made and finally click on “Create bucket” button.

Image for post
Image for post

Step 25: Now, you can view the bucket which you have created.

Image for post
Image for post

Step 26: Select S3 bucket which you have recently created.

Image for post
Image for post

Step 27: Click on “Properties” as shown in image below.

Image for post
Image for post

Step 28: Now, you are redirected to the page as shown below. Click on “Static website hosting”.

Image for post
Image for post

Step 29: Here, select “Redirect requests” to send a redirecting request of www. to bucket without www. For example, redirecting request of www.positivestud.com to bucket of positivestud.com.

Image for post
Image for post

Step 30: Now, provide the name of the S3 bucket in which you had previously uploaded all the files of static website i.e. positivestud.com.

Image for post
Image for post

Step 31: In Protocol, enter “http” and click on “Save” button.

Image for post
Image for post

Step 32: Now, go back to AWS Management Console and search for “Route 53” in Find services. After “Route 53” appears in drop down, Click on it.

Image for post
Image for post

Step 33: Click on “Hosted zones” as shown in image below.

Image for post
Image for post

Step 34: After you click on Hosted zones, you are redirected to the page as shown in the image below. Here, click on Domain Name which had been previously created i.e. positivestud.com.

Image for post
Image for post

Step 35: After you have been redirected to the page as shown in the image below, click on “Create Record Set” button.

Image for post
Image for post

Step 36: In Create Record Set, provide Name as “www”, select Alias as “Yes” and in Alias Target, search for the S3 bucket which you have recently created.

Image for post
Image for post

Step 37: In Alias Target, select the S3 bucket which you have recently created. Then, click on “Create” button.

Image for post
Image for post

Step 38: Finally, you can now open your website even after providing www. before your domain name i.e. www.positivestud.com.

Image for post
Image for post

If you willing to learn more about AWS and require the resources to start journey of AWS, then you can visit our website. The link to our website is www.positivestud.com

Written by

Cloud Computing | Data Science | Mobile Application Development | Artificial Intelligence | Python Programming | Soft Skills | Many more…

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store