Hey folks! π
If you're planning to host a static website on AWS, you might be confused between S3 static hosting and AWS Amplify hosting. I was too! π
So I decided to try both and break down the differences β with examples β so anyone can understand.
Letβs go! π
π‘ What is a Static Website?
Before we dive inβ¦
A static website is just HTML, CSS, and JS files. No backend. Perfect for portfolios, blogs, documentation, or single-page apps like React/Vue.
βοΈ Option 1: Hosting on AWS S3
πͺ£ What is it?
AWS S3 (Simple Storage Service) is mainly for file storage, but you can enable static website hosting. Your HTML files live inside an S3 bucket, and S3 serves them as a website.
βοΈ How it works?
- Create an S3 bucket
- Upload your files
- Enable βStatic Website Hostingβ
- Make files public or connect CloudFront for HTTPS
- Done β
π§ͺ Example:
Letβs say I have a portfolio site built with HTML and CSS.
- Upload the files to S3
- Enable website hosting
- Open the public S3 URL
Thatβs it. Itβs live! π₯
β Pros:
- Super cheap
- Easy to set up for simple sites
- No build time
β Cons:
- No built-in CI/CD (but we can fix this with CodePipeline!)
- You manage public access, HTTPS, headers manually
β‘ Option 2: Hosting on AWS Amplify
π What is it?
Amplify Hosting is a fully managed hosting service from AWS β designed for modern web apps.
Itβs perfect if youβre using React, Vue, Angular, etc., and want Git-based deployments, HTTPS, previews, and more.
βοΈ How it works?
- Go to AWS Amplify Console
- Connect your GitHub repo
- It auto-detects your frontend framework
- Every Git push triggers build + deploy
π§ͺ Example:
My React app is in GitHub.
- Connect repo to Amplify
- Amplify runs npm install && npm run build
- It deploys to a global CDN
- Done!
β Pros:
- Auto CI/CD from Git
- SSL, custom domains, caching β all managed
- Easy preview of branches
β Cons:
- Slightly costlier than S3
- Less control over build process (compared to CodePipeline)
π Wait, Can We Do CI/CD with S3?
Yes! π‘
Even though S3 doesnβt have built-in CI/CD, you can use AWS CodePipeline.
Hereβs the flow
GitHub (or CodeCommit)
β
CodePipeline
β
(Optional) CodeBuild (e.g., for React build)
β
S3 (Deploy build folder)
This setup gives you full automation: push code β site auto-deploys.
Example buildspec.yml
version: 0.2
phases:
install:
commands:
- npm install
build:
commands:
- npm run build
artifacts:
base-directory: build
files:
- '**/*'
π S3 vs Amplify β Summary Table
Feature | S3 Static Hosting | AWS Amplify Hosting |
---|---|---|
CI/CD Support | β (Manual) or β via CodePipeline | β Built-in from Git |
SSL / HTTPS | β Manual via CloudFront | β Auto with free SSL |
Custom Domain | β Yes | β Yes |
Git Integration | β No | β Yes |
Cost | πΈ Very low | πΈ Slightly higher |
Best For | Simple websites | Modern web apps / React, Vue |
π¬ So, Which One Should You Use?
If you want... | Go with... |
---|---|
Simple HTML/CSS site | πͺ£ S3 |
Full automation with GitHub + React/Vue | β‘ Amplify |
Full control and custom CI/CD setup | πͺ£ S3 + CodePipeline |
π Final Thoughts
Both are great options! Pick what fits your project and team.
β
Want total control + cost savings β Use S3 + CodePipeline
β
Want speed + built-in CI/CD β Use Amplify Hosting
Hope this helped you understand the difference clearly! π
Top comments (0)