K-Flix 🎬

A movie discovery and watchlist management app built with React 19 and Vite, powered by the TMDB API.

React Vite Tailwind CSS

• Browse trending movies updated daily from TMDB
• Search by keyword with advanced filters — genre, year, rating, language
• Full movie detail pages with overview, genres, and ratings
• User registration and login with protected routes
• Add movies to favourites and manage personal watchlists
• Share watchlists with other users
• Responsive design — mobile and desktop

Home Hero banner with trending movies

Search Keyword search with genre, year, rating, and language filters

Movie Details Full detail page with overview, genres, and ratings

Favourites Personal favourites list

Watchlists Create and manage watchlists — shareable with other users

Login User login with protected route handling

• Node.js v18+
• npm
• Free TMDB API key

git clone https://github.com/kchimbodza/kflix-react-app.git
cd kflix-react-app
npm install

Create a .env file in the root:

VITE_TMDB_API_KEY=your_tmdb_api_key
VITE_TMDB_BASE_URL=https://api.themoviedb.org/3
VITE_TMDB_IMAGE_URL=https://image.tmdb.org/t/p/w500

# Terminal 1 — start JSON Server (local backend)
npm run server
# Terminal 2 — start the app
npm start

Open http://localhost:5173

• JSON Server runs on port 3001 and must be started separately
• Passwords are stored in plain text in db.json — this is a development demo, not production-ready auth

MIT