Skip to content
Revangga Brama Eka Putra
← Back to projects

Movie Finder

Movie and serial discovery on TMDb: dual-mode search, private watchlist with stats dashboard, command palette, installable PWA.

  • React
  • TypeScript
  • Vite
  • Tailwind CSS
  • PWA
  • Vitest
Movie Finder preview

Overview

Movie and serial discovery on TMDb: dual-mode search, private watchlist with stats dashboard, command palette, installable PWA.

Problem

Movie discovery is fragmented: search lives in one app, streaming availability in another, and watchlists are locked behind platform accounts. For Indonesian viewers, local content and language support are afterthoughts.

Solution

A TMDb-powered discovery app with dual-mode search (keyword and discover filters for genre, year, providers), a private watchlist that lives entirely in the browser, and streaming-provider links for Indonesia. No account, works offline.

Technology

  • React
  • TypeScript
  • Vite
  • Tailwind CSS
  • PWA
  • Vitest

Implementation

Client-only architecture: all fetch, parsing, and serialization logic lives in pure functions with components just rendering. Watchlist state persists to localStorage with JSON export/import. PWA via Workbox (app shell precache plus TMDb runtime cache) keeps it functional offline, and search state syncs to the URL so results are shareable. Two ADRs cover dual-mode search and streaming-provider integration.

Result

59 passing Vitest tests on pure functions, an installable PWA that keeps watchlists fully functional offline, and dual-mode search with multi-language ID/EN support. All in a dark-only cinema interface with zero backend cost.