TubeScope is a modern web application built with React and Vite that allows users to explore and analyze YouTube channel content through an intuitive interface. By simply entering a channel ID, users can view videos, metadata, and other insights presented in a clean, responsive design. The platform integrates with the YouTube Data API to fetch real-time content, while a dedicated backend ensures smooth communication and scalability. Additionally, TubeScope features an AI Assistant Bot that helps users navigate the platform, answer queries, and provide guided support, making the overall experience smarter and more interactive.
🌐 Live Project: TubeScope on Vercel
- Search YouTube channels by Channel ID.
- Display channel videos with pagination.
- Fetch detailed channel information using the YouTube Data API.
- Responsive design with a modern, clean UI.
- Frontend hosted on Vercel.
- Backend hosted on Vercel as serverless functions.
Before running the project locally, ensure you have:
- Node.js v16 or higher
- npm or yarn
- A valid YouTube Data API key from Google Cloud Console
git clone https://github.com/your-username/tube-scope.git
cd tube-scopecd backend
npm installCreate a .env file inside the backend folder and add:
API_KEY=your_youtube_api_key
PORT=5000Run the backend locally:
npm run dev➡️ Backend will be running at: http://localhost:5000
cd frontend
npm installCreate a .env file inside the frontend folder and add:
VITE_BACKEND_URL=http://localhost:5000Run the frontend locally:
npm run dev➡️ Frontend will be running at: http://localhost:5173
Update the frontend .env file with your deployed backend URL:
VITE_BACKEND_URL=https://your-backend.vercel.app
Contributions are welcome! To contribute:
- Fork the repository
- Create a new branch (
git checkout -b feature-name) - Commit your changes (
git commit -m 'Add new feature') - Push to your branch (
git push origin feature-name) - Submit a Pull Request 🎉
This project is licensed under the MIT License.