Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/abhishekrawe/netflix-clone

Netflix home page with react using TMDb and movie trailer API. Its a full-fledged react application that includes react features like hooks, asynchronous functional, reusable components, HTML & CSS the developed application is a look-alike of Netflix
https://github.com/abhishekrawe/netflix-clone

demo-gif heroku local-machine movietrailerapi netfl netflix netflix-clone netflix-clone-react netlify poster react tmdb tmdb-api trailer

Last synced: about 18 hours ago
JSON representation

Host: GitHub
URL: https://github.com/abhishekrawe/netflix-clone
Owner: abhishekrawe
Created: 2021-04-19T17:44:08.000Z (almost 4 years ago)
Default Branch: master
Last Pushed: 2021-05-13T08:38:17.000Z (over 3 years ago)
Last Synced: 2023-08-27T15:42:39.030Z (over 1 year ago)
Topics: demo-gif, heroku, local-machine, movietrailerapi, netfl, netflix, netflix-clone, netflix-clone-react, netlify, poster, react, tmdb, tmdb-api, trailer
Language: JavaScript
Homepage: https://netflix-rawe.netlify.app/
Size: 8.53 MB
Stars: 4
Watchers: 1
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# Netflix Clone :

- A complete responsive Netflix clone , where you click on the poster of movies this will show the trailer of that movies from youtube using Imbd movie API .
**_Netflix clone _** if I goona click a poster and play trailer you can go ahed and play a trailer .

## DEMO
![Demo-Gif](preview/vid2.png)
- Here you can see i can scroll thruogh like `netflix` and move the mouse cursor for scrolling.
- `Play trailer` , there a lots of trailer you can see on clicking on the poster over here.

## Working:

- Actully i get all the Data from the Third Party API, So when you will `refresh` you see the top Poster and the information will automatic change .

## Steps:

- Get `TMDB API ` key
- Create `react app`
- Get all the `MOVIES`
- Build the `rows`
- Build the `Banner`
- Build the Nav `bar`
- Add trailer `popups`
- Setup Backend hosting on `Heroku`.
- Setup Frontend Hosting on `Netlify`.

![Demo-Gif](preview/movie.png)
### Running on local Machine:

> Make sure you have the lastest version of NodeJS engine installed on your local Machine.

- Clone the repository to your local by pasting the below command in the terminal.

```bash
git clone https://github.com/abhishekrawe/Netflix-Clone
```

- Now, Open the folder in Visual Studio Code (or Text Editor). Then open the terminal and split that terminal into two parts as shown below:
![Terminal-Splitting](preview/start.png)
- On 1st Terminal, Change the directory to **ui/whiteboard-collab**

```bash
cd .\netflix-clone\ > cd src
```

- Then install the required dependencies to run the ReactJS web-application using following commands.

```bash
npm install
```

- Now, it's time to start the React web-app using the following commands.

```bash
npm start
```

- Now, your local server is started and running on port 3000.

![Demo-Gif](preview/vide1.png)