The Problem: Passive Video Watching & The Illusion of Competence
Have you ever spent 2 hours watching an in-depth computer science lecture or machine learning tutorial on YouTube, feeling like you completely understood the material, only to realize the next morning that you can't recall the fundamental concepts?
Cognitive scientists call this the "Illusion of Explanatory Depth". Passive video watching produces steep memory decay according to the Hermann Ebbinghaus forgetting curve. Without deliberate, active retrieval within 48 hours, over 70% of the lecture content is lost.
To solve this for myself and fellow self-taught developers, I built YouTube to Quiz AIāa fast web application that turns any YouTube educational lecture into an interactive 5-question test with timestamped explanations, scoring, and Anki-compatible flashcard export in under 10 seconds.
š ļø The Tech Stack
I prioritized lightweight edge performance, lightning-fast TTFB (Time to First Byte), and deep SSR SEO:
- Frontend & SSR: Next.js 15 (App Router, Server Components for rich SSR educational knowledge base)
- Styling: Tailwind CSS with dark-mode first design
- AI Reasoning Engine: DeepSeek-V3 671B MoE for Bloom's Taxonomy question generation
- Transcript Parsing: Residential proxy worker pipeline via Supadata AI
- Database & Auth: Cloudflare D1 Serverless SQLite + Google Cloud OAuth 2.0
- Global Monetization: Waffo Pancake global payments
š” How it Works Under the Hood
1. Robust Subtitle Extraction with Fallback
Most developers rely on standard scrapers that quickly get IP-banned by YouTube. We route transcript requests through distributed residential proxy workers. If a video has subtitles disabled or regional restrictions, we built a zero-friction fallback allowing users to paste any lecture notes or transcript text directly.
2. Context-Grounded Prompt Engineering
To prevent hallucinated questions, the prompt strictly conditions DeepSeek-V3 to cite exact video timestamps for every correct answer:
const prompt = `
Analyze the following YouTube transcript. Extract 5 core conceptual questions.
For each question:
1. Provide 4 plausible options (1 correct, 3 distinct distractors).
2. Attach an educational explanation.
3. Reference the exact timestamp offset where this topic is taught in the video.
`;
š Live Demo & Feedback
The project is deployed on production with 20 free starting credits for every learner:
š Try YouTube to Quiz AI for Free
I'd love to hear your feedback on the active recall flow and what features you'd like to see next!
Top comments (1)
Making DeepSeek cite a timestamp for every correct answer is a smart constraint. Being able to jump back to the exact moment in the lecture is what turns a wrong answer into something useful instead of just annoying.
Since you asked about the flow, one note on the very first step: the YouTube URL box on the homepage has placeholder text but no label. Once someone starts typing, the hint is gone, and a screen reader announces it as an unnamed edit field, so the one input the whole product depends on has no name. A visually hidden
<label>or aria-label="YouTube video URL" sorts it out.I'm a Staff SDET, and I ran an automated QA pass over the site while reading this. It came back 97/100 (A), which is a strong result for a three-day build. The missing label was the one item it shows in full, with 5 other warnings behind it, nothing alarming.
Are most early users pasting a URL, or leaning on the transcript-paste fallback?