Build a Netflix-Style Website with S3, CloudFront & Lambda@Edge 🎬⚡

Ever dreamed of creating your own mini-Netflix? Good news: You don't need a million-dollar server room to do it.

In this guide, we’ll walk you through how to build a Netflix-style static video site using nothing but S3, CloudFront, and a sprinkle of Lambda@Edge. Whether you’re showing off your indie films, coding tutorials, or cat videos — this setup scales like a boss and costs pennies. 🐱💰

Let’s go!

---

🧠 Why Use S3 + CloudFront + Lambda@Edge?

Here's the recipe:

• S3: Store your videos, HTML, CSS, and JavaScript.

• CloudFront: Distribute your content globally with low latency.

• Lambda@Edge: Add logic right at the CDN edge (think: auth, redirects, personalization).

Think of S3 as your Netflix library, CloudFront as the worldwide streaming network, and Lambda@Edge as the brains adding interactivity at lightning speed.

---

🎬 What You’ll Build

• A sleek video gallery (HTML/CSS/JS)

• Video content hosted on S3

• CDN distribution via CloudFront

• Custom logic using Lambda@Edge (e.g., geo-based redirection or access control)

---

🧰 Prerequisites

• AWS account

• Basic understanding of HTML/JS/CSS

• Node.js & AWS CLI installed

---

🚀 Step-by-Step: Launch Your Streaming Site

1. Create and Upload to an S3 Bucket

• Create a new bucket: my-netflix-clone

• Enable static website hosting

• Upload your frontend files and videos

Sample index.html snippet:

<video width="640" height="360" controls>
  <source src="https://my-netflix-clone.s3.amazonaws.com/trailer.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

Don’t forget to set permissions:

{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "PublicReadGetObject",
      "Effect": "Allow",
      "Principal": "*",
      "Action": "s3:GetObject",
      "Resource": "arn:aws:s3:::my-netflix-clone/*"
    }
  ]
}

---

2. Set Up CloudFront Distribution

• Origin = Your S3 bucket

• Enable caching, gzip

• Restrict access to S3 using Origin Access Control

• Optional: Add a custom domain with SSL via ACM

Result: ⚡ Fast streaming globally, minimal latency.

---

3. Enhance with Lambda@Edge

Deploy a Lambda function in us-east-1 and associate it with CloudFront

Example: Redirect based on country

'use strict';

exports.handler = async (event) => {
  const request = event.Records[0].cf.request;
  const country = event.Records[0].cf.headers['cloudfront-viewer-country'][0].value;

  if (country === 'IN') {
    request.uri = '/india.html';
  }

  return request;
};

This lets you serve custom content based on location, headers, or even cookies!

---

🌍 Bonus: Add Authentication (Optional)

Use Amazon Cognito or Lambda@Edge to:

• Require login to access videos

• Protect premium content

Or use signed CloudFront URLs for time-limited access.

---

📦 Summary

This setup gives you a Netflix-like video platform that is fast, secure, scalable, and very affordable.

---

💬 Your Turn: What Would You Stream?

Would you use this to build a:

• Dev course platform?

• Indie film showcase?

• Internal company training portal?

👇 Share your ideas, questions, and results in the comments!

Smash that ❤️ if you learned something cool, and send this to a fellow creator who needs a streaming solution without the drama.

Let’s build the future of streaming — one bucket at a time. 🧡