AWS Static Website Hosting over HTTPS

A step-by-step guide to deploying your frontend resources on AWS with CloudFront, S3, Route 53 and Amazon Certificate Manager

Image taken from Pixabay
Static Website Hosting Architecture Over HTTPS
npm run-script build
An example of a project’s build files in the project directory
Register for your desired domain at AWS Route 53
Ensure that you block all public access to the bucket
S3 bucket with build files
Enable S3 static website hosting
Download the DNS configuration
Example of Default Cache Behaviour Settings
Example of Distribution Settings in CloudFront
Ensure that your Default Root Object is correctly listed as index.html
{
"Version": "2008-10-17",
"Id": "PolicyForCloudFrontPrivateContent",
"Statement": [
{
"Sid": "1",
"Effect": "Allow",
"Principal": {
"AWS": "arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity originaccessidentity"
},
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::yourbucketname/*"
}
]
}
The part blurred in red is your CloudFront distribution endpoint
Creating an A record in Route 53
Creating a CNAME record in Route 53

Software Engineer, Technology Enthusiast, Optimistic Nihilist. Currently a student at Yale-NUS College, Singapore. Visit https://www.leonardtng.com/ for 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