See how real systems
actually work
Interactive flows that run live backend services. Watch each step execute in real time, with real timestamps and real results.
Now live
Image Optimization Pipeline
Upload an image and watch it travel through object storage, a message queue, a background worker that resizes and converts to WebP, a database write, and a live SSE notification back to your browser.
More flows are in the works. Each one covers a backend pattern that comes up repeatedly in production systems, running on real infrastructure.
What this flow teaches
Five backend patterns that show up in almost every production system. Each one is running live when you trigger the flow.
Presigned URLs
Files upload directly from the browser to object storage. The API server never touches the bytes, keeping memory usage flat regardless of file size.
Message Queue
The API enqueues a job instead of processing inline. This decouples HTTP response time from processing time and gives you free retry logic on failure.
Background Worker
A separate process picks up the job and does the heavy work: downloading the original, resizing to three sizes, converting to WebP via sharp.
Server-Sent Events
The worker pushes step updates to the API via webhook. The API fans them out to the browser over a persistent SSE stream, no polling required.
Metadata in PostgreSQL
File variants live in object storage. Dimensions, sizes, and timing go into PostgreSQL. Keeping data separate from files makes queries fast and cheap.