Skip to main content
Skip to case study content
AAOsrc homepage — Resident Evil hero, search, and Trending This Week row
In productionFull Stack2026

AAOsrc

Movie browsing app for trending titles, search, and a personal watchlist

  • TanStack Start
  • React
  • TypeScript
  • Vite
  • Tailwind CSS
  • Supabase
  • TMDB
  • Vercel
Live productBack to Projects

Executive summary

AAOsrc is a movie browsing app. The homepage opens on a featured title, then rows for trending, popular, top rated, upcoming, and genre picks, with search and a signed-in watchlist.

Business problem

A movie catalog is hard to scan when search, title detail, and a personal list live in different places.

Project goals

  • Open on a featured title and scannable movie rows
  • Let people search titles and open a detail page
  • Save a watchlist for a signed-in account

Solution

A TanStack Start application that loads a home feed, search, and movie pages, with Supabase auth and a watchlist. It is deployed at aaosrc.vercel.app.

My role

  • Home feed, search, and movie detail routes
  • Sign-in and watchlist flow
  • Production deployment

System architecture

  1. 01

    Stage 01

    TanStack Start on Vite, with file routes for home, search, movie detail, login, and watchlist.

  2. 02

    Stage 02

    The home loader fetches a TMDB feed.

  3. 03

    Stage 03

    Supabase handles auth.

  4. 04

    Stage 04

    Tailwind CSS and Radix-style UI primitives cover the interface.

  5. 05

    Stage 05

    The app is deployed on Vercel.

Technology stack

  • TanStack Start
  • React
  • TypeScript
  • Vite
  • Tailwind CSS
  • Supabase
  • TMDB
  • Vercel

Key features

  • 01

    Featured hero with play, more info, and add-to-list actions

  • 02

    Rows for trending, popular, top rated, upcoming, and genre picks

  • 03

    Title search

  • 04

    Movie detail page

  • 05

    Sign-in and a personal list

Engineering challenges

  • Keeping the home feed, search, and watchlist on one consistent catalog
  • Loading poster art and title data without blocking the first screen

Results & business impact

Business value

  • 01

    Gives a live media product people can browse, search, and save from

  • AAOsrc homepage — Resident Evil hero, search, and Trending This Week row

Next step

Interested in building a similar solution?

Let's discuss your product, automation, or platform goals.

Let's discuss your project

Related case studies

  • Henry L. Andrews, Jr. homepage — board-ready executive hero with portrait and credentials
    Full StackShipped

    Henry L. Andrews, Jr. Executive Portfolio

    A production executive portfolio for Henry L. Andrews, Jr. — founding Managing Director and CFO of Verus Research and retired U.S. Air Force Colonel. The site organizes command, corporate leadership, board service, and civic work for recruiters, directors, and partners.

    • Next.js
    • React
    • TypeScript
    • Tailwind CSS
    • Radix UI
    Live siteView on GitHub
  • Operation Blackout opening screen — Begin Mission and Mission Archive
    Full StackOngoing

    Operation Blackout

    Operation Blackout is a live tactical story. The opening screen starts a mission or opens an archive, and the public repository documents the larger squad-tactics design.

    • TypeScript
    • Vercel
    Live experienceView on GitHub