case study · 1 min read
Netflix UI — rows, trailers and a lot of React
- Timeline
- Side project
- Role
- Solo — engineering
- Stack
- React
- TMDB API
- Firebase
Some overview
Learning React by rebuilding a familiar UI
Cloning an interface everyone knows is a great way to practise layout and data fetching — you always know what "right" looks like.
Getting to work
Rows, banners and trailers
- A hero banner that picks a random Netflix Original
- Horizontally scrolling genre rows fetched from TMDB with axios
- Click a poster to open its trailer (movie-trailer + react-youtube)
Every row is the same component — only the TMDB endpoint changes.
Under the hood
Stack
React with hooks, the TMDB API via axios, YouTube embeds for trailers, and Firebase Hosting for deploys.
