Skip to content
Alex Monro

Flixi

Overview

A movie database where users browse popular films, search by genre, and read ratings. Built with React and the TMDB API. Covers REST API integration, reusable component architecture, and responsive design across screen sizes.

Tech Stack

ReactCSSTMDB API

Process

  • Started with a high-fidelity wireframe, then prototyped the full interactions in Adobe XD.
  • Split the work across the team by section and used React Router for navigation between views.
  • Built reusable card components to keep the layout consistent across endpoints.
  • Fleshed out the API integration across multiple endpoints, verified the data was fetching correctly, and deployed to live.

What I Learned

  • Reusable components only stay reusable if you design them against the data shape early. Card components built for one endpoint broke when a different endpoint returned different fields.
  • REST APIs rarely return exactly what you need. Working across multiple TMDB endpoints meant normalizing inconsistent data before it touched the UI.
  • React Router changes how you think about state. Deciding what lives in the URL versus component state is a real architectural choice, not just a navigation detail.
  • Prototyping in XD before writing code meant the team had shared agreement on interactions before anyone touched a component.