By what method to Host a Modest Static Website on AWS S3

Related Courses

Hosting a Modest Static Website on AWS S3

Introduction

Having a personal website for sharing pictures, videos, or information with family and friends is a great idea. While platforms like Facebook and LinkedIn offer sharing options, a personal static website provides greater control and customization. In this article, we will learn how to host a static website using AWS S3.

Naresh I Technologies is a leading computer training institute in Hyderabad and ranks among the top five computer training institutes in India. We provide comprehensive AWS training for all AWS certifications.

Methods for Creating a Website with AWS

AWS offers multiple ways to create and host a website based on your needs:

AWS Lightsail

  • Ideal for simple websites using platforms like WordPress, Moodle, and Joomla.

  • Simplifies website deployment without requiring in-depth AWS knowledge.

AWS Amplify

  • Best suited for Single Page Applications (SPA).

  • Provides dynamic user interactions without frequent page reloads.

AWS S3 (Focus of This Article)

  • Used for simple static website hosting (audio, video, images, and HTML pages).

  • Offers a serverless hosting model where AWS manages resource scaling automatically.

Staging Virtual Servers (AWS EC2)

  • Used for launching virtual servers and manually configuring necessary software.

  • Best suited for organizations with complex infrastructure and high traffic.

  • Requires expertise in AWS services like EC2, Route 53, RDS, and EBS.

Each method has trade-offs between flexibility and ease of use. AWS Lightsail is the easiest but offers limited customization, while EC2 provides maximum flexibility but requires advanced knowledge. AWS S3 is the simplest way to host a static website with minimal setup effort.

Hosting a Static Website on AWS S3

S3 (Simple Storage Service) is one of AWS’s oldest services. It is primarily used for:

  • Storing database backups

  • Media storage (videos, images, documents)

  • Big Data Analytics

  • Object storage with an easy-to-use bucket and folder structure

S3 eliminates the need for capacity planning, as it automatically scales based on demand. It offers different storage classes optimized for varying access frequencies, managed via S3 lifecycle policies. AWS CloudFront (CDN) can also be used for faster content delivery.

AWS S3 Free Tier

  • 5GB storage free for the first year.

  • 20,000 GET requests & 2,000 PUT requests per month.

  • Pay-as-you-go pricing model beyond the free tier.

Now, let's walk through the process of creating and hosting a static website using AWS S3.

Step-by-Step Guide: Hosting a Static Website on AWS S3

Step 1: Create an S3 Bucket

  1. Open the S3 Management Console.

  2. Click on Create Bucket.

  3. Enter a unique Bucket Name.

  4. Choose an AWS Region.

  5. Click Create to finalize bucket creation.

Step 2: Grant Public Access to the S3 Bucket

  1. By default, all buckets are private.

  2. To make the website publicly accessible:

    • Navigate to the Permissions tab.

    • Click Edit Public Access Settings.

    • Uncheck "Block all public access" and save the changes.

    • Confirm the changes when prompted.

  3. Add a Bucket Policy to explicitly allow public access:

 
{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "PublicReadGetObject",
      "Effect": "Allow",
      "Principal": "*",
      "Action": "s3:GetObject",
      "Resource": "arn:aws:s3:::your-bucket-name/*"
    }
  ]
}
 
  1. Replace your-bucket-name with the actual bucket name.

  2. Click Save.

Step 3: Enable Static Website Hosting

  1. Go to the Properties tab.

  2. Scroll to Static Website Hosting.

  3. Click Edit and enable website hosting.

  4. Enter:

    • Index document: index.html

    • Error document: error.html

  5. Save the changes.

Step 4: Upload Website Files

  1. Navigate to the Overview tab.

  2. Click UploadAdd Files.

  3. Select index.html and error.html.

  4. Click Upload to store the files in S3.

Step 5: Access the Website

  1. Copy the Website Endpoint URL from the Static Website Hosting section.

  2. Paste the URL in a browser to access your website.

  3. If required, use AWS Route 53 to assign a user-friendly domain name.

Conclusion

Congratulations! ? You have successfully hosted a static website using AWS S3. This method provides an affordable and scalable solution without requiring server management.

Naresh I Technologies is a premier computer training institute offering training in AWS and various other technologies. Our AWS training covers all AWS certifications through online, classroom, and corporate training sessions.