Welcome to TubeFlix

Welcome to TubeFlix, an immersive video streaming platform meticulously crafted using React, Tailwind CSS, and the robust YouTube public API. With TubeFlix, dive into a seamless viewing experience that prioritizes user comfort and interaction. Engage with a wide array of video content streamlined through an intuitive interface, designed to keep you focused and entertained without any clutter.

Key Features 📋

• Advanced Video Browsing: Navigate through diverse video categories using the intuitive sidebar, designed for effortless exploration.
• Dynamic Search Capabilities: Quickly locate your desired videos with our responsive search functionality.
• Complete Playback Controls: Experience full control over your viewing, akin to YouTube's familiar interface.
• Intelligent Video Recommendations: Receive tailored video suggestions during playback to enhance your viewing experience.
• Robust Connection Handling: Receive elegant notifications about internet disruptions, with automatic recovery once connectivity is restored.
• Universal Device Compatibility: Enjoy a fully responsive design that adapts fluidly across different devices and screen sizes.
• Elegant Shimmer UI Effect: Experience the subtle, engaging loading animations that heighten visual appeal during content fetching.
• Adaptive Theme Modes: Automatically syncs with your browser's theme setting with an option to manually toggle between light and dark modes for a personalized experience.

Core Pages 📚

• Home Page: The central hub of TubeFlix, featuring a curated selection of trending and popular videos.
• Video Playback Page: Dedicated page for video viewing, equipped with enhanced user controls and related video suggestions.
• Search Results Page: Displays comprehensive search results, allowing you to choose the next video to watch.

Technologies and Libraries 🛠️

• ReactJS: Powers the dynamic interfaces of TubeFlix, ensuring a reactive, component-driven user experience.
• Tailwind CSS: Provides the utility-first CSS framework that allows for rapid UI development with minimal styling overhead.
• Additional Libraries: Includes react-router-dom for routing, axios for network requests, moment for date manipulations, react-icons for scalable icons, and react-player for robust video playback capabilities.

Getting Started 🚀

Here’s how to run TubeFlix on your local machine:

1. Clone the Repository:
   • Use git clone to download the TubeFlix repository to your local environment.
2. Install Dependencies:
   • Run npm install in your project directory to set up necessary libraries and frameworks.
3. API Key Configuration:
   • Navigate to the Rapid API website and search for the "YouTube" API.
   • Subscribe to the API, ensuring it is freemium and verified, and copy your unique API key.
4. Environment Setup:
   • Create a .env file in the root directory of your project.
   • Store your API key as REACT_APP_YOUTUBE_API_KEY=<your-api-key>.
5. Launch the Application:
   • Execute npm start to fire up the development server.
   • Open http://localhost:3000 in your web browser to access TubeFlix.

🌟 Support Us on GitHub — If you find TubeFlix useful, consider starring our repository to show your support!