In this lab a static website hosted in S3 bucket will be distributed globally and securely with CloudFront. Then a custom domain will be pointing to that distribution.Lab 84
Services Covered
CloudFront
Certificate Manager
LightSail
Lab description
In this lab a static website hosted in S3 bucket will be distributed globally and securely with CloudFront. Then a custom domain will be pointing to that distribution. To do that the domain must have a Certificate associated to it because the CloudFront distribution will distribute the HTTPS version of that site.
- Create a static HTML + CSS + JS website
- Create a Certificate for a domain
- Create CloudFront distribution
- Point a custom domain to the CF distribution
- Changing CNAME records in DNS management
Lab date
08-10-2021
Prerequisites
- AWS account
- HTML website
- Registered domain (Route 53)
- LightSail (DNS management)
Lab steps
- Create a bucket and upload index.html and your other files like styles.css or app.js. There are two ways to proceed with this task. Either by granting the bucket public access and changing the buckets policy or by creating necessary setup in CloudFront in the next step I’ll continue with the second approach.
- Go to CloudFront and create a distribution. Choose your bucket, and under S3 bucket access choose Yes use OAI and create a OAI (Origin access identity) that will allow CloudFront to access the bucket. Then check in the option to update the bucket policy. Then fill in the Default root object with the index.html and create distribution. Now the website is distributed globally with CloudFront under a provided domain:
- I want this website to be a part of my LightSail server and to have a more human-friendly domain so I created a A record in my LightSail hosted zone for that page.
- In order to use that custom domain for my CloudFront distribution I needed to create a Certificate issued in Certificate Manager, validate that I can configure those domains in DNS configuration by adding CNAM records provided by CM:
- Now I could use the CloudFront domain as a destination for CNAME record in DNS records:
- Now visiting https://challenge.cloudofthings.net responds with the CloudFront cached website:
And how fast it is!