- Watch everything going on in the motorsport world in one place whether it be the science behind things or the story of drivers and teams.
- ReactJS
- Mantine UI component library
- Mockbee for backend
- React Router
Home Page:
- The home page consists of different categories, clicking them navigates the user to the video listing page with that category applied as a filter.
Video Listing (Explore)
- On this page, users can see all the videos and can watch the video by clicking on them.
Video details
- After a user clicks on any video in video listing page, it will navigate to this page, where user can:
- Watch the video
- Can like the video
- Add the video into watch later, playlist and can create a playlist
- Add video to watch later
- Create new playlist
Playlist Management
- On this page user can view all the playlists.
- On clicking on any one open's that playlist, where user get option to:
- Delete the playlist
- Remove video from playlist
Watch later
- Users can add any video into watch later if a video is already in watch later then the user can remove it.
Like video
- Users can like any video, if the video is already liked then the user can remove it from liked videos.
History
- Once the user watches the video it gets added to watch history. On the history page, the user can clear all history.
Authentication
- LightsOut Video also has login, signup and logout feature
- For Signup, form validation is done for all the fields.
- Clone the repository on your local machine with the command below in your terminal, and cd into the lightsout-video folder
https://github.com/hiteshverma27/lightsout-video.git
cd lightsout-video- Install dependencies (if you are using yarn then do with that)
npm install- Create a
.envfile at the root level of the directory (at the level ofpackage.json) and create a environment variable
REACT_APP_JWT_SECRET = <JWT_SECRET_KEY_OF_YOUR_CHOICE>
- Start the server🚀
npm start
