🍿 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.