AWS S3 Static Website Hosting – Upload HTML and Image Files
Project Overview
In this project, we will:
Create an S3 bucket
Upload an HTML file
Upload an image file
Configure Static Website Hosting
Make the website publicly accessible
Access the website using the S3 Website URL
Step 1: Create an S3 Bucket
Login to AWS Console.
Search for S3.
Click Create bucket.
Enter a unique bucket name.
Example:
suguna-static-website
Select your preferred AWS Region.
Uncheck:
Block all public access
Acknowledge the warning.
- Click Create bucket.
Step 2: Create Website Files
index.html
Create a file named:
index.html
Add the following code:
<!DOCTYPE html>
<html>
<head>
<title>My First S3 Website</title>
</head>
<body>
<h1>Welcome to My AWS S3 Website</h1>
<p>This website is hosted using Amazon S3.</p>
<img src="aws-image.jpg" width="500">
</body>
</html>
Image File
Save any image as:
aws-image.jpg
Step 3: Upload Files to S3
Open your bucket.
Click Upload.
Select:
index.html
aws-image.jpg
Click Upload.
Step 4: Enable Static Website Hosting
Open bucket.
Go to:
Properties
- Scroll down to:
Static website hosting
Click Edit.
Enable:
Static website hosting
- Enter:
Index document:
index.html
- Save changes.
Step 5: Add Bucket Policy
Go to:
Permissions
Open:
Bucket Policy
Paste:
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "PublicReadGetObject",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::suguna-static-website/*"
}
]
}
Replace:
suguna-static-website
with your bucket name.
Save changes.
Step 6: Verify Object Permissions
Open:
index.html
and
aws-image.jpg
Ensure they are publicly accessible.
Step 7: Access Website URL
Go to:
Properties
Copy the:
Example:
http://suguna-static-website.s3-website-us-east-1.amazonaws.com
Open it in a browser.
Expected Output
Your webpage will display:
Welcome to My AWS S3 Website
This website is hosted using Amazon S3.
along with the uploaded image.
Architecture Diagram
User Browser
|
▼
Amazon S3 Bucket
|
├── index.html
└── aws-image.jpg
|
▼
Static Website Hosting URL
Interview Questions
What is Amazon S3?
Amazon S3 (Simple Storage Service) is an object storage service used to store and retrieve data from anywhere on the internet.
Why use S3 Static Website Hosting?
Low cost
Highly available
Easy deployment
No server management
What is a Bucket Policy?
A Bucket Policy is a JSON document used to grant or deny permissions to S3 resources.
What is Static Website Hosting?
A feature that allows S3 buckets to host HTML, CSS, JavaScript, and image files as a website.
Project Outcome
Successfully created an S3 bucket, uploaded HTML and image files, configured static website hosting, and accessed the website using a public URL. This demonstrates basic AWS S3 administration and web hosting skills.
