🌐 Live Demo | 🐞 Report Bug | ✨ Request Feature
LearnStream is an AI-powered educational platform that transforms passive video watching into an interactive learning experience. Paste any YouTube URL and get an instant transcript, AI-generated summary, and auto-graded quiz — no distractions, no ads.
- Tech Stack: React 19, Tailwind CSS, Node.js, Express, MongoDB, Google Gemini AI
- Live Site: https://learnstream.netlify.app
| Home Page | Feed |
|---|---|
![]() |
|
| Transform videos into knowledge instantly | Discover and track your learning journey |
In the age of endless content, retention is the real challenge. Students and professionals watch hours of tutorials but often struggle to recall key concepts or test their understanding.
LearnStream solves this by:
- Removing Distractions: No sidebar recommendations or ads.
- Active Recall: AI-generated quizzes force you to test your knowledge immediately.
- Quick Review: Summaries and transcripts allow for rapid revision without re-watching.
If you support this mission, leaving a ⭐ helps others discover the project!
| Feature | Description |
|---|---|
| AI Transcripts | Fetched via youtube_transcript_api — works reliably |
| Smart Summaries | AI-generated summaries with full markdown rendering |
| Interactive Quizzes | Auto-generated 5-question quizzes to test retention |
| Distraction Free | Clean player interface focused on learning |
| Progress Tracking | Track watched videos, quiz scores, and learning streaks |
| Playlist Support | Import entire YouTube playlists |
| Secure Auth | Google OAuth & Local Authentication |
| Responsive Design | Works seamlessly on desktop and mobile |
| Rate Limited API | Per-IP & per-user limits protect backend from abuse |
This project is a Monorepo with a React frontend and an Express backend.
- Framework: React 19 (Vite)
- Styling: Tailwind CSS v4, Framer Motion
- Icons: Lucide React
- State/Routing: React Router v7, Context API
- SEO: React Helmet Async
- Runtime: Node.js
- Framework: Express.js
- Database: MongoDB (Mongoose)
- AI Engine: Google Gemini API (multi-model cascade with fallback)
- Authentication: Passport.js (Google OAuth)
- Transcript Engine:
youtube_transcript_api(Python ≥1.2.4) + Invidious fallback - Concurrency: In-memory semaphore, request queue, in-flight deduplication, LRU cache
Follow these steps to run LearnStream locally.
- Node.js (v18+)
- Python 3.9+ with
youtube_transcript_apiinstalled - MongoDB (Local or Atlas URI)
- Google Gemini API Key
- Google OAuth credentials
-
Clone the repository
git clone https://github.com/Saheb142003/LearnStream.git cd LearnStream -
Install Python dependency (required for transcript fetching)
pip install youtube-transcript-api
-
Install Node dependencies
# Frontend cd frontend && npm install # Backend cd ../server && npm install
-
Environment Setup — create
server/.env:PORT=5000 CLIENT_URL=http://localhost:5173 MONGO_URI=your_mongodb_connection_string GOOGLE_CLIENT_ID=your_google_client_id GOOGLE_CLIENT_SECRET=your_google_client_secret SESSION_SECRET=your_session_secret GEMINI_API_KEY_SUMMARY=your_gemini_api_key GEMINI_API_KEY_QUIZ=your_gemini_api_key YOUTUBE_API_KEY=your_youtube_data_api_key # Optional tuning (safe defaults apply without these) TRANSCRIPT_CONCURRENCY=3 TRANSCRIPT_QUEUE_DEPTH=20 TRANSCRIPT_TIMEOUT_MS=30000
-
Run the application — open two terminals:
# Terminal 1 — Backend cd server && npm start # Terminal 2 — Frontend cd frontend && npm start
-
Open http://localhost:5173 in your browser.
LearnStream is licensed under the MIT License — free to use for personal and educational purposes. See LICENSE for details.
- Lead Developer: Md Sahebuddin Ansari (@Saheb142003) — Full Stack Developer
Contributions are welcome! Feel free to open an issue or submit a pull request.
- Website: https://learnstream.netlify.app
- GitHub: https://github.com/Saheb142003
- LinkedIn: https://www.linkedin.com/in/saheb142003
- Email: saheb142003@gmail.com
