What is cloudfront and why are we using it?- Cloudfront is a CDN (content delivery service) service. A CDN is a geographically network of data centers. The purpose is to help “minimize the delays in loading web page content by reducing the physical distance between the server and the user. This helps users around the world view the same high-quality content without slow loading times” — Akamai
Please head to the Cloudfront service in the AWS Console
Click on “Create Distribution”
Click on Get Started
Origin Settings
Origin Domain Name: Click on the empty field to get a drop-down list. Paste the link from the S3 Static Web Hosting Section. Following format:
<BucketName>.s3-website.us-east-2.amazonaws.com
Leave others default
Default Cache Behavior Settings
Viewer Protocol Policy — Choose “Redirect HTTP to HTTPS”
Save your changes
This can take up around 15–30 minutes
After it is successfully deployed click on the Cloudfront link. Your website should appear
Route 53
Please head to Route 53 to configure our DNS settings
We will be using this service to route any requests come to domain to forward to your cloudfront distribution.
Please head over to hosted zones by clicking on the hamburger menu again on the left
You should see that a hosted zone is created for you
What is a hosted zone? - Think of hosted zone has a way to organize records. Right now I have a separate hosted zone for each domain. For each domain, we can set different records like A, CNAME, NS and more. More on what each record is, please look at this article from cloudflare.
Click on the newly created hosted zone for your domain
We are going to add an A record to forward requests to the CloudFront distribution when people type in your domain.
Click on create a record (orange button)
For record value, click on the “Alias” toggle button and choose “Alias to Cloudfront Distribution”
Paste the CloudFront domain name that was created during CloudFront distribution step.
Why do you need an ssl certificate? - “Without SSL, your site visitors and customers are at higher risk of being having their data stolen. Your site security is also at risk without encryption. It builds a secure environment for both visitors and site owners” — namecheap.com
Please head to AWS Certificate Manager. Make sure to be in the us-east-1 (Northern Virginia) for it to be accepted by CloudFront.
Click on get started “Provision Certificates”
Make sure “Request a public certificate” is highlighted, click on the “Request a certificate”
Add the domain name
Click Next
Choose DNS validation, selecting this will validate the certificate automatically
Click on Next
Click on Review
Click on Confirm and Request
Click on “Create a record in Route53”
Validating the domain should be completed within seconds if not a couple of minutes right after you create the record.
We are going to head back to Cloudfront distribution for one last configuration change
Highlight the distribution you recently created and click on “Distributed Settings”
Click on Edit
Alternate Domain Names (CNAMES) — type in your domain name. Example “saismyhero.com”
SSL Certificate: Click on “Custom SSL Certificate” and pick the certificate you created in the us-east-1 (n Virginia) for the same domain (You will get a drop-down)
We created a CloudFront distribution to serve your website in multiple edge locations globally for low latency
We used Route 53 to buy a domain, created a hosted zone and set up DNS records
We used AWS Certificate manager to request an SSL certificate to help encrypt your connection between client and host.
Next steps:
Make your Personal website stand out by adding the following — resume, blogs, pictures, awards, personal projects you worked on, links to your Github, Linkedin, or any other social media.
Bonus Project:
Try to implement a CI/CD solution to modify your website code in a repository and have it deployed to S3 automatically after you push to the main branch.
