Hosting a Static Website on Amazon S3: A Step-by-Step Guide

Aditya Rawas - Jan 9 - - Dev Community

Introduction:

Amazon S3 provides an easy and cost-effective solution for hosting static websites with high availability and scalability. In this step-by-step guide, we'll walk through the process of hosting a static website on Amazon S3.

Step 1: Set Up an AWS Account

If you don't have an AWS account, sign up for one at AWS official website. Once you have an account, log in to the AWS Management Console.

Step 2: Create an S3 Bucket

  1. In the AWS Management Console, navigate to the S3 service.
  2. Click "Create bucket" and follow the prompts.
  3. Choose a globally unique name for your bucket (e.g., "your-website-bucket").
  4. Select a region for your bucket.
  5. Uncheck the "Block all public access" option if you intend to make your website publicly accessible.

Step 3: Upload Your Website Content

  1. Inside your newly created bucket, click "Upload."
  2. Add your static website files (HTML, CSS, JavaScript, etc.) to the bucket.
  3. Ensure that your main HTML file is named "index.html" as this will be the default landing page.

Step 4: Configure Bucket Properties for Website Hosting

  1. In your bucket, click on the "Properties" tab.
  2. Scroll down to the "Static website hosting" card.
  3. Click "Edit" and choose the "Use this bucket to host a website" option.
  4. Set the "Index document" to "index.html" or your preferred landing page.
  5. Optionally, set the "Error document" for custom error pages.

Step 5: Set Permissions

  1. Still in the bucket properties, navigate to the "Permissions" tab.
  2. Click on "Bucket Policy" and add a policy to make your bucket publicly accessible. An example policy allowing public read access to all objects looks like:

    {
        "Version": "2012-10-17",
        "Statement": [
            {
                "Effect": "Allow",
                "Principal": "*",
                "Action": "s3:GetObject",
                "Resource": "arn:aws:s3:::your-website-bucket/*"
            }
        ]
    }
    

    Replace "your-website-bucket" with your actual bucket name.

Step 6: Enable Website Hosting

  1. Go back to the "Properties" tab and click on the provided website endpoint link.
  2. Your website should now be accessible through the provided URL. Note that it may take a few minutes for changes to take effect.

Step 7: (Optional) Configure a Custom Domain

If you have a custom domain, you can configure it to point to your S3 bucket using AWS Route 53 or another domain registrar. Update your domain's DNS settings to include a CNAME record pointing to your S3 bucket's website endpoint.

Conclusion:

Congratulations! You've successfully hosted a static website on Amazon S3. This straightforward process, combined with S3's reliability and scalability, makes it an excellent choice for hosting static content in the cloud.

. . . . . . . . . . . . . . . . . . . . .
Terabox Video Player