Binge It

Overview

Binge It is a Netflix-style movie browsing application built as a learning project to understand how large, data-driven frontends are structured. Rather than replicating all Netflix features, the project focuses on selectively implementing core patterns such as authentication, movie discovery, and global state management.

Screenshots

Previous

Next

• 1
• 2
• 3
• 4
• 5
• 6

Core Capabilities

• Streaming-style movie browsing interface
• User authentication with persistent sessions
• Categorized movie discovery using third-party APIs
• Global state management for shared application data

Frontend Architecture

The application is structured to support a large, multi-section UI with shared state and predictable data flow.

• UI built using React and Tailwind CSS
• Global state managed using Redux Toolkit
• Reusable components for common UI elements
• Multilingual language configuration managed through Redux

Authentication & Data Integration

Authentication and data fetching are handled using managed services and external APIs to keep the frontend focused on UI and state concerns.

• User authentication implemented with Firebase Email/Password
• User profile data stored and accessed via Firestore
• Movie data fetched from TMDB APIs
• Auto-playing trailer feature implemented using YouTube iframe embeds

Key Challenges & Learnings

• Scoping features intentionally to focus on architectural learning rather than full product parity
• Managing asynchronous API flows while keeping UI state predictable
• Structuring reusable components for a large, multi-section UI

Outcome

The project resulted in a feature-rich frontend application that demonstrates real-world UI patterns, scalable React architecture, and practical integration of authentication and third-party APIs.