50 lines
1.7 KiB
Markdown
50 lines
1.7 KiB
Markdown
# Netflix Clone
|
|
|
|
- Demo: <https://netflix-clone-ebon-nu.vercel.app/>
|
|
|
|
This project is a simplified front end clone of Netflix. It was created with React and CSS (Grid and Flexbox). It uses [The MovieDB Api](https://www.themoviedb.org/documentation/api) to search for movies and display details. Feel free to contribute!
|
|
|
|
### TODO's
|
|
|
|
- [ ] Implement Not Found page styles
|
|
- [ ] Implement navigation header links functionality
|
|
- [ ] Update modal to current styling
|
|
- [ ] Update carousel to current styling
|
|
- [ ] Create movie page
|
|
- [ ] Create user account page
|
|
- [x] Migrate to Typescript
|
|
- [ ] Implement dynamic code splitting with dynamic imports
|
|
- [x] Setup storybook
|
|
- [ ] Implement internationalization with react-i18next
|
|
- [ ] Exclude storybook files from test coverage
|
|
|
|
### Tools used
|
|
|
|
- Webpack v5
|
|
- Axios
|
|
- Redux & React
|
|
- Sass (grid & flexbox)
|
|
- Media queries
|
|
- Swiper JS
|
|
|
|
### Runing Project Locally
|
|
|
|
- Install dependencies: run `npm install` in root project
|
|
- Get API key from [here](https://www.themoviedb.org/documentation/api)
|
|
- Create .env file in root project and add: `API_KEY=YOUR_API_KEY_HERE`
|
|
- Run project: `npm run dev`
|
|
|
|
### User Stories
|
|
|
|
- User can search for movies and TV shows on TMDb
|
|
- User can the see upcoming and trending movies. Data updates weekly
|
|
- User can click on a movie and a modal should pop up. It should display the title, release date, overview, and runtime.
|
|
- The webpage adapts to any screen size.
|
|
|
|
### Video Walktrough
|
|
|
|
|
|
|
|
Please feel free to create a pull request and submit any issues!
|
|
Currently looking for backend developers. If you would to contribute to support a backend, reach out, all ideas are welcomed!
|