FrameFlow is an end-to-end video streaming and library management platform. It combines a high-performance NestJS 12 backend (using PostgreSQL, Prisma 7, and FFmpeg) with a Next.js 16 App Router client built using Atomic Design principles and Tailwind CSS v4.
Range-Request Video Streaming
Supports high-efficiency video streaming with HTTP 206 Range requests, ETag caching, and Last-Modified header validation.
Automated Metadata & FFmpeg Engine
Scans local storage directories, probes video duration, and dynamically extracts or caches thumbnails at custom seek times using FFmpeg.
RBAC & Interactive API Docs
JWT-based security flow with role-based access control separating admin management endpoints from public player routes, documented via Swagger/OpenAPI.
Atomic Frontend Architecture
Client-rendered Next.js 16 application structured around Atomic Design with custom dark-themed Tailwind CSS v4 components and typed REST clients.
- NestJS 12 modular architecture with explicit Controller-Service-DTO separation and global exception filtering.
- PostgreSQL 16 relational database integration via Prisma 7 ORM using @prisma/adapter-pg driver adapters.
- Next.js 16 App Router frontend using React 19, zero-SSR client fetching, and strict TypeScript types.
- Containerized environment managed via Docker Compose running API services alongside isolated PostgreSQL instances.
FrameFlow splits concerns cleanly between a pure JSON/media streaming REST API backend and a client-side rendered Next.js application. Administrative operations are locked behind JWT authentication, while streaming endpoints support range headers for seamless video seeking.
- NestJS 12Backend
- Next.js 16Frontend
- Prisma 7ORM
- HTTP 206Streaming
- Integrating Prisma 7 driver adapters (@prisma/adapter-pg) provides superior connection pooling control with native pg.Pool instances.
- Isolating heavy media processing tasks (like FFmpeg thumbnail extraction) prevents CPU bottlenecks during video streaming.