Create Static Website Using S3

Amazon Simple Storage Service (S3) provides a cost-effective and scalable solution for hosting static websites. Whether you're building a personal blog, portfolio, or a business website with minimal dynamic content, hosting on S3 can be efficient option.

first we will talk about the static websites in more details :

A static website :is a type of website that shows the same content to all users, and the information doesn't change based on user actions. It's made up of fixed HTML pages that remain constant until manually updated by a developer. Static sites are easy to build, load quickly, and are cost-effective to host. They're suitable for purposes like personal blogs, portfolios, and simple business websites that don't need frequent updates or dynamic features. Unlike dynamic sites, static websites have limited interactivity and don't require server-side processing, making them more straightforward in terms of development and potentially more secure.

After we talk about the static websites we will walk through the steps to host a static website on Amazon S3

Step 1: Create an S3 Bucket

• Log in to the AWS Management Console.

• Navigate to the S3 service.

• Click on the "Create bucket" button.

• Enter a unique and meaningful bucket name and choose the region.

• Uncheck the "Block all public access" option and acknowledge the warning.

• Click through the remaining settings, leaving them as default, and create the bucket.

Step 2: Upload Website Files to the Bucket

• Open the newly created bucket.

• Click on the "Upload" button.

• Select and upload all your website files.

• Once uploaded, select all files and make them public by clicking on the "Actions" button and choosing "Make public."

Step 3: Configure Bucket for Website Hosting

• In the bucket properties, go to the "Static website hosting" tab.

• Select the "Use this bucket to host a website" option.

• Enter the index and error document filenames (typically index.html for both).

Step 4: Set Bucket Policy for Public Access

• Still in the bucket properties, go to the "Permissions" tab.

• Click on "Bucket Policy" and add a policy that allows public access to your files. An example policy is provided below:
  

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

Step 5: Enable Static Website Hosting

• Go back to the "Static website hosting" tab.

• You will find the endpoint URL for your website. It will be in the format:http://static-website-on-s3-1553.s3-website-us-east-1.amazonaws.com/

Step 6: Test Your Static Website

• Open a web browser and navigate to the provided endpoint URL.

• Your static website should now be live and accessible.

Congratulations! You have successfully hosted a static website on Amazon S3. You could use AWS services to enhance your website further, such as using CloudFront for content delivery or integrating with other AWS services for additional functionality.

Note: Don't forget to cleanup your environment