AWS Builder Center

Builder Center

Hosting a Static Website on AWS with S3 and CloudFront (Without Breaking the Bank)

A straightforward, beginner-friendly guide to launching your first static website on AWS using Amazon S3 and CloudFront securely.

When we begin our journey with AWS, the advice we all get is to learn is by building. One of the most rewarding first projects is launching your own personal website or portfolio in the cloud.
In this guide, we will look at how to host a fast, secure static website using two core AWS services:
  1. Amazon S3 (Simple Storage Service): stores your web files.
  2. Amazon CloudFront: Distribute your content globally with low latency using a Content Delivery Network(CDN).

Step 1: Create an HTML file

Create a folder on your computer and name it. Now, create an index.html file inside it.
1
2
3
4
5
6
7
8
9
10
<!DOCTYPE html>
<html>
<head>
<title>My AWS Site</title>
</head>
<body>
<h1>Hey, my site is live on AWS! 🚀</h1>
<p>Served via S3 and CloudFront.</p>
</body>
</html>
Save it.

Step 2: Drop it into an S3 Bucket

Amazon S3 is basically a cloud hard drive.
  1. Go to the S3 console and hit Create bucket.
  2. Give it a name like my-aws-site-2026.
  3. Leave the default settings for now (Note: keep "Block public access" checked—we'll use CloudFront to serve the files safely so random people can't snoop directly into the bucket).
  4. Click Create.
  5. Click into your new bucket, hit Upload, and drag your index.html file right in.

Step 3: Put CloudFront in front of it

Instead of making your S3 bucket completely public (which is a security risk), we use CloudFront to securely fetch and serve your website globally.
  1. Open the CloudFront console and click Create distribution.
  2. Under Origin domain, click and select your S3 bucket.
  3. Under Origin access, choose Origin access control (OAC) and click the button to create it. This lets CloudFront securely talk to your bucket.
  4. Scroll down to Viewer protocol policy and select Redirect HTTP to HTTPS.
  5. Scroll down to Default root object and type: index.html
  6. Click Create distribution.
Tip: CloudFront will show a yellow warning banner at the top telling you to update your S3 bucket policy. Click the button it gives you to copy the policy, go to your S3 bucket's Permissions tab, paste it into the bucket policy editor, and save.

Step 4: Check if it works

CloudFront takes a couple of minutes to deploy your changes globally.
  1. Go back to your CloudFront distributions page.
  2. Look for the Distribution domain name (it looks like d111111abcdef8.cloudfront.net).
  3. Paste that link into a browser tab.
If you see your "Hey, my site is live on AWS!" text, you're done. You just deployed a production-grade web architecture on AWS for practically zero dollars.

Conclusion

And that's it! You've officially launched your first project on AWS. Keep building and sharing what you learn!
# amazon-s3# amazon-cloudfront# beginner-projects# aws-community# aws-community-builders
Any opinions in this article are those of the individual author and may not reflect the opinions of AWS.
Enjoyed reading this content? Let the author know!

Your likes, comments, shares, and saves help creators reach more builders.

Loading recommendations

Loading article