🎬 Movie App

A Modern & Responsive Movie Discovery Platform built with React & Vite.

---

📖 About The Project

Movie App is a modern and fully responsive movie discovery platform built with React and Vite, powered by The Movie Database (TMDB) API.

The application allows users to discover trending movies, browse TV series and anime, search for their favorite titles, watch official trailers, explore recommendations, and save movies to their favorites.

The project focuses on delivering a clean, responsive, and smooth browsing experience while following modern React development practices and reusable component architecture.

---

🚀 Live Demo

🌐 Website

https://cinemax-devils.vercel.app/

---

✨ Features

• 🔥 Browse Trending Movies
• ⭐ Discover Top Rated Movies
• 🎬 Explore Popular Movies
• 📺 Browse TV Series
• 🎌 Explore Anime
• 🔍 Search Movies & TV Shows
• 📄 Detailed Movie Information
• 🎥 Watch Official Trailers
• 💡 Related & Recommended Movies
• ❤️ Add & Remove Favorites
• ⭐ Movie Ratings
• 📱 Fully Responsive Design
• ⚡ Fast & Smooth User Experience
• 🎨 Clean & Modern UI

---

🛠 Tech Stack

Front-End

• React
• Vite
• JavaScript (ES6+)

Styling

• Tailwind CSS
• CSS3
• AOS Animation

API

• TMDB API
• Axios

Routing

• React Router DOM

UI Libraries

• React Icons
• Font Awesome

Deployment

• Vercel

---

📸 Screenshots

🏠 Home	🔍 Search
🔥 Trending Movies	📺 TV Series
🎬 Movie Details	💡 Recommendations
❤️ Favorites

---

⚙️ Getting Started

Clone the repository

git clone https://github.com/Mohamedxismail/devil-s
.git

Navigate to the project folder

cd movie-app

Install dependencies

npm install

Create a .env file and add your TMDB API Key.

Example:

VITE_TMDB_API_KEY=YOUR_API_KEY

Run the development server

npm run dev

Open your browser

http://localhost:5173

---

📁 Project Structure

src
│
├── assets
├── components
├── pages
├── context
├── hooks
├── services
├── router
├── App.jsx
└── main.jsx

---

🎬 API

This project uses The Movie Database (TMDB) API to provide:

• 🔥 Trending Movies
• ⭐ Top Rated Movies
• 🎬 Popular Movies
• 📺 TV Series
• 🎌 Anime
• 🔍 Search
• 📄 Movie Details
• 🎥 Official Trailers
• 💡 Recommendations
• ⭐ Ratings

---

🚀 Deployment

The application is deployed on Vercel.

🌐 Live Website

https://cinemax-devils.vercel.app/

---

🚀 Future Improvements

The project can be extended with more advanced features in the future, including:

• 👤 User Authentication
• 📝 User Reviews & Comments
• 🎭 Cast & Crew Details
• 📺 Streaming Platform Availability
• 🌍 Multi-language Support (i18n)
• 🌙 Dark Mode
• 🎞 Watchlist
• 🔔 Personalized Movie Recommendations
• 📊 Movie Statistics Dashboard
• 📱 Progressive Web App (PWA)
• 🎥 Upcoming Movies Calendar
• 🤖 AI Movie Recommendations

---

📱 Responsive Design

The application is fully responsive and optimized for all devices:

• 💻 Desktop
• 💼 Laptop
• 📱 Tablet
• 📲 Mobile

---

📚 What I Learned

Developing Movie App helped me improve my skills in:

• Building React Applications with Vite
• Working with REST APIs
• Integrating TMDB API
• React Router DOM
• Axios
• State Management using Context API
• Reusable React Components
• Search Functionality
• Responsive Design with Tailwind CSS
• AOS Scroll Animations
• Favorites Management
• Error Handling & Loading States
• Clean Project Structure & Code Organization

---

👨‍💻 Author

Mohamed Ismail

Frontend Developer

🌐 GitHub

https://github.com/Mohamedxismail

💼 LinkedIn

https://www.linkedin.com/in/mohamed-ismail-81217a33b

🚀 Live Demo

https://cinemax-devils.vercel.app/

---

🤝 Contributing

Contributions, issues, and feature requests are welcome.

If you'd like to improve this project:

1. Fork the repository.
2. Create a new branch.
3. Commit your changes.
4. Open a Pull Request.

---

⭐ Support

If you like this project, don't forget to leave a ⭐ on GitHub.

Your support motivates me to build more awesome projects.

---

Made with ❤️ by Mohamed Ismail using React & Vite