Streamwave is a video streaming web app akin to YouTube, leveraging the power of React. Viewers can explore a vast library of content, enjoy high-quality streaming, and interact through comments, likes, and subscriptions. The application boasts an intuitive user interface, responsive design, and robust video playback capabilities, delivering an engaging and immersive video-sharing experience.
![](https://private-user-images.githubusercontent.com/81709725/275588329-e72cf4f2-1030-408c-89df-1f7a532a5e80.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjExODkyNjQsIm5iZiI6MTcyMTE4ODk2NCwicGF0aCI6Ii84MTcwOTcyNS8yNzU1ODgzMjktZTcyY2Y0ZjItMTAzMC00MDhjLTg5ZGYtMWY3YTUzMmE1ZTgwLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MTclMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzE3VDA0MDI0NFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWVmMmFiN2IwYjU0NTcwY2UzNDYzMzA5NmJhZTgyZjliNmZkNzNhNTczMDk5NWM2MTczN2U5NjU0Yzk5NDAwYmImWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.-l9By4imMpYg4ecvzeY1UAE7hJwKWZAb33DaT-LkfuY)
- Embedded YouTube API: Seamlessly integrated YouTube's API for real-time content updates and an immersive user experience.
- Dynamic Routing with React Router: Enabled smooth and seamless navigation without page reloads using
react-router-dom
. - Efficient State Management with Redux: Utilized Redux and Redux Toolkit for synchronized data and UI interactions.
- Enhanced UX with Debouncing: Implemented a 200ms debounce for lag-free, lightning-fast interactions.
- Optimized Caching: Employed clever caching strategies for faster search results and suggestions.
- Sleek Design with Tailwind CSS: A visually stunning, modern design created with Tailwind CSS.
- Real-time Chat with API Polling: Engage in real-time conversations without refreshing the page.
- Nested Comment System: Join organized, interactive discussions seamlessly.
- Efficient Live Chat: Auto-deleting messages after 20 entries to keep the chat streamlined and optimized.
- Streamlined Navigation: Easily explore video categories via the left navigation bar.
- Full Video Playback Controls: Enjoy video playback with comprehensive controls similar to YouTube.
- Smart Suggestions: Receive curated video suggestions while watching content.
- Seamless Offline Experience: Stay informed with a user-friendly UI notifying you of internet connection interruptions.
- Automatic Redirection: Effortlessly return to your content once the internet connection is restored.
- Universal Compatibility: Experience our fully responsive design, ensuring compatibility across all devices.
- Shimmering UI: It employs the Shimmer UI effect for subtle yet captivating content loading animations, enhancing user experience and visual appeal.
- Adaptive Theme Modes: Offers both Light and Dark mode options that automatically match your browser's theme preference, with a toggle for personalized viewing.
You need to install the dependencies:
npm install
In the project directory, you can run:
npm run dev