Hosting a Static Website on S3 Bucket – AWS Lab Series

Hosting a static website on an Amazon S3 bucket is a simple and cost-effective way to create a reliable web presence. S3 is a cloud storage service provided by Amazon Web Services (AWS), and it allows you to store and retrieve files of any size. In this guide, we will walk you through the steps needed to host a static website on an S3 bucket.

Step 1: Create an S3 Bucket

The first step is to create an S3 bucket for your website. To do this, log in to your AWS Management Console and navigate to the S3 service. Click the “Create Bucket” button and give your bucket a unique name. Uncheck the option of Block all public access and acknowledge the warning of public access.

Allow Public Access
Allow Public Access

Choose the region that is closest to your target audience to reduce latency. In the “Properties” tab, enable “Static website hosting” and enter the name of your index file.

enable static site hosting
enable static site hosting

Step 2: Upload Your Website Files

Next, upload your website files to your S3 bucket. You can do this by either using the web interface provided by AWS or AWS CLI. When uploading your files, make sure to include your index file, as well as any other files and folders that are required for your website to function correctly. If you want to use sample files then please take the index.html and error.html from this GitHub site.

Step 3: Configure Permissions

By default, S3 buckets are private and inaccessible to the public. To allow access to your website, you need to configure the appropriate permissions. In the “Permissions” tab, click the “Bucket Policy” button and paste the following policy, replacing “example.com” with your own domain name:

{
"Version":"2012-10-17",
"Statement":[
{
"Sid":"PublicRead",
"Effect":"Allow",
"Principal": "*",
"Action":["s3:GetObject"],
"Resource":["arn:aws:s3:::example.com/*"]
}
]
}

This policy grants read-only access to all objects in your S3 bucket to anyone on the internet.

Step 4: Configure Your DNS

Finally, you need to configure your DNS settings to point your domain name to your S3 bucket. To do this, create a new “CNAME” record in your DNS provider’s control panel, and set the value to your S3 bucket’s endpoint URL, which can be found in the “Static website hosting” section of your S3 bucket’s properties.

And that’s it! Your static website is now hosted on an S3 bucket and is accessible to the world. By using S3, you can take advantage of AWS’s global infrastructure and pay only for the storage and bandwidth that you use, making it an excellent choice for small to medium-sized websites with moderate traffic.

If you dont have any domain name registered, you can use the one provided by aws. Go to properties of s3 bucket, scroll down to the bottom and in the Static Website Hosting portion and copy the Bucket website endpoint like the one shown in below screenshot:

s3 static website endpoint
S3 Static Website Endpoint

You can check out more useful articles on technology:

  1. Implementing DevOps? Here Are the Concepts and Tools You Should Consider
  2. From Manual to Automated: A Windows Server Admin’s Guide to DevOps
  3. Build A Dotnet Project In Jenkins

Leave a Comment