Introdution

Finally! I get to talk about how I built this website and publicized using AWS S3, ACM, Cloudfront, and Route 53. YAY
Since there are quite a lot of guides out there for creating a website using AWS services to deploy a website, in this page, I would like to talk about issues that I faced during the deployment of my web server. Hope you find this post useful. Lets get started.

AWS S3 Bucket Naming

YOUR BUCKET NAMING SHOULD BE THE WEBSITE DOMAIN NAME.

Apparently, according to this Stackoverflow forum, that is how Amazon designed it. At first, I didn't set my bucket name to my domain name, so I had to recreate the bucket in order to make it work.

Images Not Loading

When I first deployed my webserver, I had a problem that some images from the website were not loading. I had no idea why because when I open my web server locally, the images were loading fine. At last, I found out that S3 is case sensitive and Windows is not. I found out that the file extensions of some image files were in CAPS, and that was the reason why some images were not loading.

Certificate Creation

After you purchase your domain and confirmed that you website is accessible publicly but without encryption (HTTPS), you will be first creating a certificate for your website through Amazon Certificate Manager. However, if you decide to both allow using yourdomain.com and www.yourdomain.com to access your website, you will have to register both domains when creating your certificate.

DNS records

After creating certificate using ACM, creating records for the certificate in Route 53, and creating your distribution using AWS CloudFront, you will have to create DNS records in order to map your URL to your CloudFront distribution. In order to allow both yourdomain.com and www.yourdomain.com access to your website using HTTPS, you simply have to create two DNS records routing the traffic to the CloudFront distribution that you created. Again, your CloudFront distribution, not your auto-populated S3 bucket address.

Updating Your Website

After my website was successfully deployed, I made some changes to my HTML file and uploaded on S3 bucket. However, when I load my website, it did not reflect my update. This was because AWS CloudFront enables to cache the contents on the AWS edge locations near end-users to deliver the contents faster by avoiding access to origin. Enable to update the content on the edge locations, Invalidations have to be made whenever a content is updated.

When you face this issue, go to your CloudFront, create an invalidation with /* to create invalidation on all object paths.