GrabMedia — Instagram & YouTube Downloader
A full-stack media downloader — paste a public Instagram or YouTube link, preview it, pick a quality, and download. An Express backend proxies two separate RapidAPI providers so the API key never reaches the browser.
The Problem
Downloading public Instagram reels/posts/stories or YouTube videos usually means routing through ad-heavy third-party sites or browser extensions that ask for excessive permissions — there was no single, clean tool covering both platforms without watermarks or a login.
Architecture & Approach
Built a two-piece system: a vanilla JS frontend (auto dark/light by time of day, in-app video/carousel preview, toast feedback) and an Express backend that validates the pasted URL, calls the matching RapidAPI provider server-side, and normalizes Instagram's and YouTube's very different response shapes into one consistent `{platform, mediaType, downloads[]}` contract the frontend doesn't need to special-case. A `/api/proxy` route re-streams YouTube's googlevideo CDN response with the right headers (Range, Referer, Origin) so the browser can save it as a normal download instead of hitting CORS or 403s.
Engineering Challenges & Solutions
- Hiding the RapidAPI key from the client entirely — every request is proxied server-side, with helmet, a strict CORS origin allowlist, and two-tier rate limiting (100 req/15min global, 20/min on the download routes) protecting the key from abuse
- Reconciling two unrelated upstream response formats — Instagram's flat media array and YouTube's separate muxed/adaptive-format lists — into one normalized shape the frontend renders identically
- Streaming YouTube's video-only and audio-only adaptive formats through the proxy with the exact headers googlevideo.com expects, since a plain fetch from the browser gets blocked
Outcome & Results
A working full-stack downloader — frontend on Vercel, backend on Render — with rate-limited, key-protected API routes, in-app preview, and multi-quality download support for both platforms.
Lessons Learned
Building a proxy that streams someone else's video ended up teaching more about HTTP headers (Range, Content-Disposition, Content-Range) than about the download feature itself — most of the real debugging was in the plumbing, not the UI.
