About EchoStream
EchoStream is a production-grade media streaming platform built to demonstrate fullstack engineering across the entire stack — from React server components and adaptive bitrate video delivery, to containerised Node.js APIs and AWS cloud infrastructure. It is designed as a portfolio piece for senior engineering roles, showing real-world patterns rather than toy examples.
The platform streams audio and video content using HLS (HTTP Live Streaming), delivered through AWS CloudFront for global low-latency distribution. The custom player — built from scratch with hls.js — supports adaptive bitrate switching, quality selection, keyboard shortcuts, and graceful error handling, without relying on any third-party player UI.
Tech Stack
Architecture
┌─────────────────────────────────────────────────────┐
│ Client Browser │
└──────────────┬──────────────────┬───────────────────┘
│ │
▼ ▼
┌──────────────────┐ ┌──────────────────────────┐
│ AWS Amplify │ │ AWS App Runner │
│ (Next.js SSR) │ │ (Node.js/Express API) │
└──────────────────┘ └──────────────────────────┘
│
┌──────────────────┘
▼
┌──────────────────────────────────────┐
│ AWS CloudFront (CDN) │
│ .m3u8 TTL: 30s / .ts TTL: 86400s │
└──────────────────┬───────────────────┘
│
▼
┌──────────────────────────────────────┐
│ AWS S3 (echostream-media) │
│ /media/episodes/{id}/index.m3u8 │
│ /media/episodes/{id}/segment*.ts │
│ /thumbnails/{id}.jpg │
└──────────────────────────────────────┘What is HLS Streaming?
HTTP Live Streaming (HLS) breaks video and audio into small .ts segments (~6 seconds each), described by a .m3u8 manifest file. The player fetches the manifest, then downloads segments sequentially. Adaptive Bitrate (ABR) streaming embeds multiple quality variants in the manifest — the player automatically switches between them based on available bandwidth, ensuring smooth playback without buffering. CloudFront serves segments from edge locations close to the viewer, minimising latency.