Netflix Clone in React JS 🎬

A polished, responsive Netflix-style streaming app built with React, Firebase, and the TMDB API. This project showcases modern frontend development, dynamic UI design, authentication flow, and a smooth movie browsing experience.

This project is also a strong portfolio piece for recruiters and hiring managers who want to see practical React skills, API integration, and user-focused UI implementation.

---

🌟 Why This Project Stands Out

• Built with React and Vite for a fast, modern frontend experience
• Includes user authentication with Firebase
• Integrates movie data from TMDB and supports trailer playback
• Designed with a Netflix-inspired layout that feels polished and realistic
• Demonstrates frontend skills that are valuable for junior to mid-level React roles

---

✨ Features

• 🎨 Netflix-inspired responsive UI
• 🔍 Browse movies and TV content by category
• 🎥 Trailer/player experience for selected content
• 🔐 Login and signup flow powered by Firebase
• 🧭 Smooth navigation with React Router
• 📱 Mobile-friendly layout for better usability

---

🛠️ Tech Stack

• Frontend: React.js, JavaScript, CSS
• Build Tool: Vite
• Routing: React Router DOM
• Authentication: Firebase
• API: TMDB API
• Notifications: React Toastify

---

📸 Screenshots

Home Page

Login Page

Signup Page

---

⚙️ Installation

Clone the repository:

git clone https://github.com/RaiMuhammadHaider/Netflix-Clone-in-React-JS.git
cd Netflix-Clone-in-React-JS
npm install
npm run dev

Then open your browser and visit:

http://localhost:5173

---

🧪 Available Scripts

npm run dev
npm run build
npm run preview
npm run lint

---

🤝 Contributing

Contributions are welcome and encouraged.

If you would like to contribute:

1. Fork the repository
2. Create a new branch:

   git checkout -b feature/your-feature-name

3. Make your changes
4. Commit your work:

   git commit -m "Add your feature"

5. Push to your branch:

   git push origin feature/your-feature-name

6. Open a Pull Request

Please keep changes clean, well-documented, and relevant to the project.

---

👨‍💻 About the Developer

Built by Rai Muhammad Haider

• Email: raimuhammadalihaider@gmail.com
• LinkedIn: https://www.linkedin.com/in/raimuahmmadhaider/
• Portfolio: https://raimhaider.vercel.app/home

I’m passionate about building modern, user-friendly frontend experiences and I’m actively looking for opportunities to grow as a React developer.

If you’re a recruiter, hiring manager, or collaborator, feel free to connect.

---

⭐ Project Goal

This project reflects my ability to turn a design concept into a functional, interactive web application using real-world tools and APIs. It is a strong example of frontend development, UI design, and practical implementation skills.