https://github.com/bj1209/youtube-clone-redux
YouTube clone with ReactJs - react functional hooks, YouTube-API, Redux and much more...
https://github.com/bj1209/youtube-clone-redux
axios firebase react redux youtube-api
Last synced: about 1 month ago
JSON representation
YouTube clone with ReactJs - react functional hooks, YouTube-API, Redux and much more...
- Host: GitHub
- URL: https://github.com/bj1209/youtube-clone-redux
- Owner: BJ1209
- Created: 2021-03-01T11:05:21.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2021-05-08T19:22:24.000Z (almost 4 years ago)
- Last Synced: 2025-01-24T18:35:09.440Z (3 months ago)
- Topics: axios, firebase, react, redux, youtube-api
- Language: JavaScript
- Homepage: https://clone-redux-bjs.web.app/
- Size: 5.12 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Using
ReactJs, Sass, Firebase and YouTube API
Fully Responsive
## Packages Used:
- react - Used as UI Library.
- redux - Used for the state management in the app.
- firebase - Used for the deployment.
- react-router-rom - Used as a routing library.
- material-ui - Used as icon library.
- axios - Used as Fetching library.
- numeral - Used for the easy number conversions.
- moment - Used for the time-ago functionality.
- react-loading-skeleton - Used as loading components.
- react-lazy-load-image-component - Used for the Lazy load images.
## API:
Many features can be added to this project as it is not absolute. You can follow the *[documentation](https://developers.google.com/youtube/v3/docs)* for more data end-points.
I have used some end-points like fetching:
1. most-popular-videos
2. video details
3. channel details
4. channel videos
5. user's subscriptions and playlists
6. search query
## API Key:
Create a new project *[here](https://console.cloud.google.com/)* and get the API key from dashboard/credential panel and paste in the *axios.js* in the *src/utils* folder.
## Preview of the Project:
1. Home-Screen
2. Watch-Screen
3. Channel-Screen
4. Search-Screen
## Installation and set-up
1. Install all the dependencies
```
npm install
```
2. Paste the YouTube API_KEY in the ***src/utils/axios.js*** file
3. Start the development server
```
npm start
```
## Production Build
1. Generate the production build
```
npm run build
```
```
If you like the work then don't forget to hit that ⭐ button to show some appreciation & love
for this project as your token of love does wonders.
```