![](https://private-user-images.githubusercontent.com/49924090/291067661-a05f5f06-427c-4ae3-9efe-e571c1f10a45.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ2MTA1MjEsIm5iZiI6MTcyNDYxMDIyMSwicGF0aCI6Ii80OTkyNDA5MC8yOTEwNjc2NjEtYTA1ZjVmMDYtNDI3Yy00YWUzLTllZmUtZTU3MWMxZjEwYTQ1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjUlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI1VDE4MjM0MVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWUwMWI1MzljM2E0MTIzYzRmYWY1M2U2MDkxOTNjYWY1OTZjMGE1YWJjZDM5ODZiMmE2ZjZmNDFmYWE5NGRmYWQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.JhbExOJcHNDjTiVk3-WUKJ6QrQpNWR0iql9tOxo68qM)
A Netflix clone built using the MERN stack (MongoDB, Express, React, Node.js). This project replicates the UI of the Netflix platform and includes features such as user authentication, filter movies and TV shows, and more.
![](https://private-user-images.githubusercontent.com/49924090/291067525-ba63ad42-6861-4504-ac84-e3bba02cf355.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ2MTA1MjEsIm5iZiI6MTcyNDYxMDIyMSwicGF0aCI6Ii80OTkyNDA5MC8yOTEwNjc1MjUtYmE2M2FkNDItNjg2MS00NTA0LWFjODQtZTNiYmEwMmNmMzU1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjUlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI1VDE4MjM0MVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWQ0ZDAzMWQ1MjNlOWVmODJjODYxMzJjOGYyMGMwMzMzZWJlZDQyNDNmNGJmMDY5OWQyZTE3YjgyYjI4NDZjZjEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.dUzuUitLBGBg0F0RWzwxRje4Cdgq4kn92rAtit4Bhvo)
Check out the live demo https://mern-netflix-clone-frontend.vercel.app
- User authentication (sign up, login)
- Browse movies
- View movie details including trailers
- Add movies to the watchlist
-
Frontend:
- React
- Redux for state management
- Axios for API requests
- React Router for navigation
- Styled-Components for styling
-
Backend:
- Node.js
- Express.js
- MongoDB for database
- Mongoose for ODM
-
Authentication:
- Firebase
-
Other:
- TMDB API for movie data
-
Clone the repository:
git clone https://github.com/Shaban-Eissa/MERN-Netflix-Clone.git
-
Change into the project directory:
cd MERN-Netflix-Clone
-
Install dependencies for both the server and client:
cd netflix-ui npm install cd netflix-backend npm install
-
Create a
.env
file in the netflix-backend directory and set the following variables:MONGODB_URI=your_mongodb_uri
Replace
your_mongodb_uri
with your MongoDB connection string. -
Create a
.env
file in the netflix-ui directory and set the following variables:REACT_APP_API_KEY = your_TMDB_api_key REACT_APP_TMDB_BASE_URL = https://api.themoviedb.org/3
Replace
your_TMDB_api_key
with your API key from your TMDB account. -
Run the server:
cd netflix-backend npm run dev
-
Run the client:
cd netflix-ui npm start
The application should now be running on http://localhost:3000.
Open your browser and go to http://localhost:3000. Sign up or log in to access the Netflix clone features. Explore and enjoy the Netflix-like experience!
Feel free to contribute to this project. Open an issue or submit a pull request to suggest improvements or add new features.