Static Website Hosting with Amazon S3
Static Website Hosting with Amazon S3
Amazon S3 (Simple Storage Service) isn’t just for data storage. It also provides a powerful platform for hosting static websites.
What is a Static Website?
A static website contains web pages with fixed content. Each page on a static site is coded in HTML and displays the same information to every visitor. Unlike dynamic websites, which rely on backend scripts like PHP, Python, or Node.js, static sites are simpler and faster.
Why Choose S3 for Hosting?
- Scalability: Handles a high volume of traffic without the need for managing infrastructure.
- Cost-Effective: Pay only for the storage you use and the data transfer out to the internet.
- Durability: S3 guarantees 99.999999999% durability for objects stored.
- Ease of Use: Simple setup and management through the AWS Management Console or CLI.
Setting Up S3 for Static Website Hosting
Begin by logging into the AWS Management Console and navigating to the S3 service. Create a new bucket, which will serve as the root directory for your website.
Creating an S3 Bucket
- Open the AWS Management Console.
- Select the S3 service.
- Click “Create bucket.”
- Name your bucket (e.g., my-static-website-bucket).
- Select your preferred region.
- Configure other options if needed, then click Create bucket at the bottom.
Uploading Your Website Files
- Click on the bucket name you just created.
- Select “Upload.”
- Add your static website files (HTML, CSS, JS, images).
- Click Upload to transfer the files.
Configuring Bucket for Website Hosting
After uploading your files, configure the bucket as a static website host.
Enabling Static Website Hosting
- Go to the bucket properties.
- Select “Static website hosting.”
- Choose “Use this bucket to host a website.”
- Enter the index document name (e.g., index.html).
- Optional: Specify a custom error document (e.g., error.html).
- Save your changes.
Setting Bucket Policy for Public Access
To make your website publicly accessible, you need to set a bucket policy.
- Navigate to the “Permissions” tab of your bucket.
- Select “Bucket Policy.”
- Paste the following JSON policy:
{ Version: 2012-10-17, Statement: [ { Sid: PublicReadGetObject, Effect: Allow, Principal: *, Action: s3:GetObject, Resource: arn:aws:s3:::my-static-website-bucket/* } ] }
Replace my-static-website-bucket with your bucket name. Save the policy.
Accessing Your Static Website
Your website is now live. Access it using the S3 endpoint URL provided in the static website hosting settings (e.g., http://my-static-website-bucket.s3-website-us-east-1.amazonaws.com).
Custom Domain and HTTPS
Assign a custom domain for better branding. Use Route 53 or another DNS provider to route traffic to your S3 bucket.
Domain Setup Steps
- Verify domain registration with Route 53 or another registrar.
- Create an S3 bucket named exactly like your domain (e.g., www.mydomain.com).
- Enable static website hosting on this new bucket.
- Set up an alias or CNAME record in your DNS settings pointing to the S3 bucket endpoint.
Enabling HTTPS with CloudFront
Use CloudFront for secure and fast delivery.
- Go to the CloudFront console and create a new distribution.
- Select “Web” distribution.
- For the origin domain, enter your S3 bucket endpoint (e.g., bucket-name.s3.amazonaws.com).
- Configure other settings as needed.
- For “Alternate Domain Names (CNAMEs),” enter your custom domain.
- Attach an SSL certificate from ACM for HTTPS support.
- Complete the setup and deploy the distribution.
Update your DNS settings to point to the CloudFront distribution.
Maintaining Your Static Website
Regularly update content by uploading new files and managing bucket permissions. Automate deployments using CI/CD tools like GitHub Actions or AWS CodePipeline.
Common Use Cases
- Personal blogs
- Portfolio sites
- Documentation
- Marketing landing pages
Security Best Practices
Ensure only the necessary files are public. Use bucket policies and IAM roles to control access. Enable logging and monitoring to track usage and detect issues.