πΏ A TMDB client built with Next.js 14
Welcome to the "movies" web app! This app allows you to search for movies, TV shows, or people by title and view their details, including overview, release date, and average rating. You can also watch movie trailers and browse popular movies, top-rated movies, upcoming movies, and now playing movies.
- Search for movies, TV shows, or people by title
- View movie details, including overview, release date, and average rating
- Watch movie trailers
- Browse popular movies, top-rated movies, upcoming movies, and now playing movies
- Discover movies and TV shows with filters (genre, year, rating, etc.)
- View cast and crew information
- Responsive design optimized for mobile, tablet, and desktop devices
- Dark/Light theme support
- Framework: Next.js 14 (App Router, Server Components)
- Language: TypeScript
- Styling: Tailwind CSS
- UI Components: shadcn/ui (Radix + Tailwind)
- API: The Movie Database (TMDB)
- Node.js 18+
- TMDB API Key (Get one here)
- Clone the repository:
git clone https://github.com/oktay/movies.git
cd movies- Install dependencies:
npm install- Create
.env.localand add your TMDB API key:
TMDB_KEY=your-api-key- Start the development server:
npm run dev- Open http://localhost:3000 in your browser.
- ARCHITECTURE.md - Project structure, app router patterns, data flow
- CONVENTIONS.md - Code style, component patterns, naming conventions
βββ app/ # Next.js App Router
β βββ (home)/ # Home page
β βββ (lists)/ # List pages (popular, trending, discover)
β βββ (detail)/ # Detail pages (movie, tv, people)
βββ components/ # React components
β βββ ui/ # shadcn/ui primitives
β βββ media/ # Shared media components
β βββ movie/ # Movie-specific components
β βββ tv/ # TV-specific components
βββ tmdb/ # TMDB API integration
β βββ api/ # API functions
β βββ models/ # TypeScript types
βββ hooks/ # Custom React hooks
βββ lib/ # Utility functions
βββ config/ # Site configuration
This product uses the TMDB API but is not endorsed or certified by TMDB.
Contributions are welcome! Please read the CONVENTIONS.md before submitting a PR.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License. See the LICENSE file for more information.