$ git clone https://github.com/junaidshaikh-js/autotube.git
$ cd autotube
$ npm install
$ npm start
- Landing Page with trending videos.
- Explore Page which prominently displays all relevant videos. Also contains Filter feature to display videos based on category.
- Single Video Page - User can like video, add to watch Later, Add/Remove from Playlist with realtime updation. User can view video on dynamic embed player with information about the video prominently displayed at the bottom. User can also view related videos based on same cateogory on the right of embedded player. On playing the video, it will be added to User history.
- Playlist Page, consists of all User Playlists. User can browse various playlists, create new empty playlists, check out individual playlist and also delete both video from playlist and also entire playlist itself.
- Watch Later Page - User can view videos marked to watch later and also delete them.
- History Page - User can view previously watched videos and also clear entire history.
- Liked Videos Page - User can view and delete their liked videos.
- Authentication Pages - User can easily signup or login using their credentials, or even checkout the website using provided test credentials. User can also logout of their account.
- User is informed when handling any interactions that are done with the backend with appropriate toast messages
- React JS
- React Router v6
- React Context API + useReducer
- SCSS
- Backend setup using MockBee
- React Player for embedded player
- Netlify for Deployment
- Cloudinary for Hosting of Images
Checkout the live deployment here: AutoTube