This is a web application built using React.js, Tailwind CSS, React Router, and TypeScript. It utilizes the TMDB API to fetch movies and TV series data. The app provides various features such as searching, sorting, and viewing details of movies and TV series. It also includes a providers page that displays the top 50 providers for both movies and TV series.
- Home Page:
- Slider showcasing the top 5 popular movies
- Lists of top-rated movies and popular TV shows
- Details Page:
- Displays additional information about the selected movie/TV series
- Information includes name, overview, tagline, rating, runtime, release date, season number, status, cast, and a trailer
- Movies/TV Series Pages:
- Allows users to search for specific movies/TV series
- Provides sorting options such as top-rated, popular, etc.
- Providers Page:
- Shows the top 50 providers for both movies and TV series
- React
- React Router
- TypeScript
- Tailwind CSS
- TMDB API
- Node.js and npm should be installed on your machine.
- Clone the repository:
git clone https://github.com/0xOmarAdel/movie-maze.git - Navigate to the project directory:
cd movie-maze - Install dependencies:
npm install
To use the TMDB API, you need to obtain an API key from TMDB website. Once you have the key, create a .env file in the project root directory and add the following line:
VITE_API_KEY=your_api_key_here
Run the following command to start the development server:
npm run dev
Open your browser and visit http://localhost:3000 to access the app.
To access the deployed version of the app, visit Movie Maze App.