Popcornly started as a simple question: could I build something I would actually use? I watch a lot of movies and shows, and I was tired of jumping between three different apps just to figure out what was worth watching. So I picked The Movie Database (TMDB) as a data source and started building.
The first real decision was how to structure the browsing experience. TMDB exposes separate endpoints for popular, top-rated, now-playing, and upcoming titles, and it was tempting to just fetch all four on every page load. Instead I split the home view into independently loaded sections, so a slow response from one list doesn't block the rest of the page from rendering. With the App Router, that meant leaning on nested layouts and Suspense boundaries rather than one big client-side fetch waterfall.
Caching came next. TMDB's catalogs don't change minute to minute, so there's no reason to hit the API on every request. I used Next.js's built-in fetch caching with a revalidation window measured in hours, not seconds, which cut response times dramatically for anything that isn't user-specific.
The watchlist
The part that actually took the most thought was the watchlist. It needs to feel instant — clicking "add to watchlist" shouldn't wait on a round trip before the UI updates — but it also needs to survive a page refresh and sync if you're signed in on another device. I ended up with an optimistic-update pattern: the UI flips immediately, the request goes out in the background, and if it fails, the change quietly rolls back with a toast explaining why.
It's still very much in progress — search is functional but not fast enough yet, and I want a proper command palette instead of a plain search bar. But it's the first side project I've built that I open on my own time, which feels like the actual test of whether it was worth building.
