muckitymuck
Posted on October 15, 2021
So we are creating a static website with the following features:
-Hosted on AWS S3 bucket
-routed through Cloudfront
-SSL certs through ACM
and as a real kicker:
-Domain acquired on GoDaddy(not Route53)
First and foremost, let's fix the GoDaddy issue as managing DNS on 2 separate services is unwieldly.
Log into GoDaddy, go to Domains, and Manage All.
Find your domain and go into it. Scroll down to Additional Settings -> Manage DNS.
Now in a separate tab, go to your AWS account and into Route53. Create a Hosted Zone by the same name as the Domain on GoDaddy.
Once you finish that wizard step, make note of the NS Type records it makes for you:
Go back to your GoDaddy account and scroll down to the Nameservers section. Click on Change:
Change over to I'll Use My own nameservers and add in at least 2 server FQDN from AWS Route53:
After it goes through you should see this. Do Not Panic.
This just means that your DNS is being managed at AWS and because the resources are hosted there as well, this simplifies things.
Now we need to have content for the website.
Helpful:
https://medium.com/tensult/aws-hosting-static-website-on-s3-using-a-custom-domain-cd2782758b2c
Make two S3 buckets. One will be named after the naked domain name and the other will be the www.
The configs for this are to TURN OFF the Blocks for Public Access and to add the Bucket Policy similar to:
{
"Version":"2012-10-17",
"Statement":[{
"Sid":"PublicReadGetObject",
"Effect":"Allow",
"Principal": "*",
"Action":["s3:GetObject"],
"Resource":["arn:aws:s3:::example.com/*"]
}]
}
Also, Enable Static Website Hosting. On the naked domain S3 bucket, change the Hosting Type to Redirect requests for an object.
Add the Host Name to the www web address:
BUCKETNAME.s3-website-us-east-1.amazonaws.com
That should make them public facing and routing to the wwwbucket.
For 403 errors:
https://stackoverflow.com/questions/56244709/static-web-hosting-on-aws-s3-giving-me-403-permission-denied
Next, we need to make Cloudfront Distribution to help serve up the SSL.
This time around, I made two Distributions for the two S3 buckets. Make the Origin Names to the same as the buckets, respectively to the Origin Domains of the buckets. And add the Alternative domain Names under General to the naked domain and wwwdomain as well.
If you open the Distribution link (dxxxxxx.cloudfront.net), you should get an SSL protected site. If you get errors, sometimes you have to wait or fix the configs.
The Just Wait error:
https://stackoverflow.com/questions/42251745/aws-cloudfront-access-denied-to-s3-bucket/42285049
Now that those are running we need to make some certs.
Head over to ACM and request 1 cert for each distribution. You can probably do this with a single cert but it worked with 1 each so give it a try with a single if you care to.
You will need to make a CNAME record in Route53 for the certs you made. It will be everything before the domain name on the Name field and the everything for the value. The Certificates should turn to Successful after this is completed.
Head back to Cloudfront and find your respective Distributions. Go under Settings and update Custom SSL certificates to the certificates you made previously.
If all goes well, this should be working.
A very convoluted way to get a website up and running. Honestly an instance or a docker image is easier to setup. But the cost is near Zero except for the cost of the domain. And because you purchased that on GoDaddy the price should be down a ways.
Happy Building.
Posted on October 15, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.