[How to] Add a custom domain & enable HTTPS to S3- Static Website

How to series

AWS Services: S3, CloudFront, Certificate Manager and Route 53

Static websites are a popular choice for hosting portfolio sites, blogs, and lightweight applications. With AWS, you can host your static website on S3 and secure it with HTTPS using CloudFront, Certificate Manager, and Route 53.

If you want to know the steps for how to Deploy a website using AWS S3, follow this blog [Link].

In this guide, we’ll walk you through the process of adding a custom domain and enabling HTTPS to your S3-hosted Website step by step.

---

Step 1: Configure a CloudFront Distribution

1. Navigate to CloudFront
   Go to CloudFront in the AWS Management Console.
2. Create a New Distribution
   – Choose the “Web” distribution type.
   – Under Origin Domain Name, select your S3 bucket.
   – Ensure the Origin Access Control (OAC) is configured for secured bucket access (optional but recommended).
3. Enable HTTPS
   – Under Default Cache Behavior, set Viewer Protocol Policy to Redirect HTTP to HTTPS.
4. Cache Settings
   – Set appropriate caching options depending on your use case.
   – For dynamic updates, reduce cache TTL.
5. Save the Distribution
   After configuration, deploy the distribution. It may take a few minutes to propagate.

---

Step 2: Request an SSL/TLS Certificate

1. Navigate to Certificate Manager
   Open Certificate Manager in the AWS Management Console.
2. Request a Public Certificate
   – Select Request a Certificate.
   – Add the domain name for your website (e.g., www.mysite.com).
   – Use DNS Validation for domain ownership verification.
3. Validate the Certificate
   – Add the validation CNAME record to your domain in Route 53 (or your DNS provider).
   – Wait for AWS to validate the certificate.
4. Once validated, your certificate status will change to Issued.

---

Step 3: Configure a Custom Domain in Route 53

1. Add a Hosted Zone
   – If you haven’t already, create a hosted zone in Route 53 for your domain.
   – Add your domain registrar’s nameservers to Route 53.
2. Point Your Domain to CloudFront
   – Create an A Record in the hosted zone.
   – Set the alias target to the CloudFront distribution.
3. Test Domain Resolution
   Use tools like nslookup or dig to confirm the DNS records are propagating correctly.

---

Step 4: Verify HTTPS Deployment

1. Access your website using your custom domain (e.g., https://www.mysite.com).
2. Ensure the HTTPS lock icon appears in the browser address bar.
3. Use tools like SSL Labs to verify the SSL configuration and security rating.

---

Conclusion

You can deploy a secure, scalable, cost-effective static website by leveraging AWS services like S3, CloudFront, Certificate Manager, and Route53. Whether you’re hosting a personal portfolio or a business site, this setup ensures optimal performance and security for your users.

Happy hosting! 🚀

---

A Note from the writer…

Welcome to my How-to Tech Blog Series, where I break down technical tasks into simple, actionable steps. Whether you’re coding in your favorite language, navigating the complexities of cloud technologies, or tackling day-to-day programming challenges, this series aims to provide clear and concise solutions. Stay tuned for quick guides that empower you to solve problems and enhance your skills!