Configuring an Amazon S3 static website with a custom Namecheap domain
Nov 30, 2016
Setting up this blog took a fair bit of tinkering. I already had the domain I wanted registered on Namecheap (thanks, Black Friday), as well as the site’s static files. Hearing it would be cheap to host my site on a trendy cloud platform such as AWS, I tried to do so, but getting both the URL of the main website (crispycollision.com) as well as the www subdomain (www.crispycollision.com) to work was a pain.
Even Amazon’s official guide on how to set up the custom domain, the process was riddled with confusion and general trial-and-error. It took several days of frustration to figure out how to hook everything together. Odd error pages would pop up telling me that ‘//index.html’ was not a valid file (even though only /index.html existed), or I would just encounter a browser error.
The main issue with the documentation provided by Amazon is that it has you use its homegrown Route 53 DNS to route traffic to your website. This turns out to be a completely unnecessary layer of complexity and using the free DNS provided by Namecheap is entirely adequate.
Configuring Amazon S3
Follow steps 1 and 2 in the official guide, creating a bucket example.com with static hosting enabled for your content, but do not create a www.example.com bucket. Instead of handling redirects from the www subdomain using Amazon S3, which I found finicky and error-prone, we will do it using Namecheap DNS.
Configuring Namecheap DNS
Go to your Namecheap dashboard and click to manage the domain you want to use. Click on Advanced DNS. We need to configure only two records. First we will create a CNAME Record on the root (that is to say, using Host=”@”). The value should be the publicly-available generic URL to your website that Amazon provided you when you enabled static hosting, of the form (bucketname).s3-website-(region).amazonaws.com. The second record should be a URL redirect record from the www subdomain directly onto the domain of your website (not the one provided by Amazon).
After this, your records should resemble those above.
(It should be noted that directly attaching a CNAME record to your root domain has disadvantages, such as making it tricker to set email up on your domain. If this is your plan, you may be better served by attempting to follow Amazon’s guide and set up their Route 53 DNS services.)
The only remaining step is to wait. Part of the reason it took so long to configure this website was me impatiently modifying the domain’s records when things didn’t work immediately. In my case, it took literally a day until both crispycollision.com and www.crispycollision.com were working consistently across all platforms. So if you’ve followed the steps above, sit back, enjoy something else, sleep a bit and your website should be up by tomorrow.Back