# How to Vibe Code Your Own Duolingo (and Stop Paying for It)

> The world's best way to learn a language

- Site: https://duolingo.com
- Category: Education
- Platforms: iOS app, Android app, Web app
- Verdict: **Solid side project** (68/100 vibecodeable)
- Estimated effort: 3-4 weeks of focused development

## Verdict

You can build a polished web-based subset of Duolingo with core lessons and streaks, but replicating the massive scale, proprietary content library, and native game engine takes weeks of focused effort.

Replicating Duolingo's core learning loop—a skill path, exercise renderer, streak counter, and heart system—is a rewarding full-stack web project. However, you will hit roadblocks designing a generalized exercise schema that handles everything from tile-matching to listening dictation, managing audio synthesis state across languages, and hooking up real-time LLM chat for roleplay without latency issues. For a personal-use clone, you can sidestep the massive multi-language catalog by building just one or two custom courses with a modular JSON question schema.

### What you can't replicate

- 40+ professionally curated, pedagogically sound language course curriculums
- Over 100 million active users driving competitive global leaderboards
- Proprietary machine learning models tuned on billions of learning interactions

## What it does

A digital education platform known for bite-sized, gamified language-learning lessons, interactive exercises, and intensive engagement loops.

### Core features

- Gamified skill tree path navigation with checkpoint nodes
- Interactive exercise engine (multiple choice, matching pairs, translation, listening)
- Daily streak tracking and timezone-safe grace periods
- Heart/mistake penalty system with timer regeneration
- Virtual currency (gems/lingots) and shop ecosystem
- Leaderboards and weekly competitive leagues
- AI roleplay conversation partner mode for conversational practice
- Text-to-speech audio playback for foreign language prompts

## The business

### Pricing

- Free: Free — Full access to courses with ads, limited hearts, and standard progression.
- Super Duolingo: $12.99/mo — Ad-free experience with unlimited hearts and practice features.
- Duolingo Max: $29.99/mo — AI-powered conversational tiers with Roleplay and Video Call features.

### Funding

$183.3M raised.
- Series A: $3.3M (2011)
- Series B: $15M (2012)
- Series C: $20M (2014)
- Series D: $45M (2015)
- Series E: $25M (2017)
- Series F: $30M (2019)
Investors: Union Square Ventures, New Enterprise Associates, Kleiner Perkins, CapitalG, Drive Capital

Founded 2011.
Team size: ~900+.

## The hard parts

- Building a flexible exercise renderer supporting dozens of unique question types and dynamic interaction states
- Orchestrating low-latency real-time AI conversational roleplay loops with natural speech models
- Designing a robust Scala/backend-style path generation engine that calculates spaced repetition schedules per user
- Creating fluid, buttery-smooth vector game loops, sound effects, and celebratory character animations across mobile and web

## How to vibe code Duolingo

### Prerequisites

- Node.js (free): Runtime environment for running Next.js and package tooling
- GitHub (free): Repository hosting and continuous deployment integration
- OpenAI API (Pay-as-you-go): Powers the AI roleplay and conversation partner features

### Recommended AI tools

- Claude Code: Terminal agent best suited for bootstrapping complex database schemas, exercise renderers, and game state logic end-to-end
- Cursor: Ideal for fine-tuning interactive exercise components and complex React UI state transitions

### Stack

- Frontend: Next.js with Tailwind CSS and Framer Motion for gamified animations
- Backend: Next.js App Router API Routes
- Database: Turso (SQLite at the edge for ultra-fast local-first user progress and lesson trees)
- Auth: better-auth
- Payments: None (Personal use clone)
- Other: OpenAI API for conversational roleplay, Web Speech API for multilingual text-to-speech pronunciation, PostHog for tracking learning metrics and session retention

### Hosting

- Vercel (Hosting the Next.js frontend and serverless API endpoints): $0/mo (Hobby Tier)
- Turso (Serverless SQLite database storing user lesson progress, streaks, and user stats): $0/mo (Free Tier)

### Build guide

1. **Project Scaffolding & Database Schema** — Initialize the Next.js project with Tailwind CSS, configure better-auth for user profiles, and set up Turso SQLite tables for courses, units, lessons, user progress, streaks, and heart counts.

```
Create a new Next.js project configured with TypeScript, Tailwind CSS, and better-auth. Set up a Turso database client using `@libsql/client` and write migration schemas for users, courses (id, title, code), units (id, course_id, order_index), lessons (id, unit_id, title, order_index), user_progress (user_id, lesson_id, completed, stars), and user_stats (user_id, hearts, streak_count, last_active_date, gems). Include seed scripts to insert a sample Spanish course with 2 units and 4 interactive lessons containing mixed exercise JSON payloads. Ensure the project structure is clean with dedicated folders for types, db, and components.
```

2. **Skill Tree Path UI & Navigation** — Build the main learning home screen featuring a vertical serpentine skill tree path with clickable lesson nodes, status indicators (completed, active, locked), and top navigation showing streak, gems, and hearts.

```
Build the main dashboard home page in Next.js that renders a vertical serpentine skill tree path. Each node represents a lesson belonging to a unit. Style nodes with engaging gamified states: completed (gold/green checkmark), current active lesson (pulsing, bright icon), and locked (grayed out with a padlock). At the top of the screen, add a persistent stats bar displaying the user's current streak count, gem balance, and remaining hearts. Fetch course and user progress data dynamically from Turso. Ensure smooth responsive rendering on mobile and desktop viewports.
```

3. **Interactive Exercise Engine** — Develop a modular lesson session view supporting multiple exercise formats: multiple choice translation, matching pairs, word bank ordering, and listening comprehension.

```
Implement the interactive lesson session screen at `/learn/[lessonId]`. Create a modular exercise engine component that dynamically renders different question types based on JSON payloads stored in the database: 1) Multiple choice translation with visual options, 2) Word bank tap-to-order sentence construction, 3) Matching pairs grid for vocabulary, and 4) Listening prompt with audio playback using the browser's native Web Speech API. Track current question index, user answers, correct/incorrect states, and animate progress bars across the top. Include instant feedback modals with encouraging copy when answers are submitted.
```

4. **Heart Penalty System & Lesson Completion** — Implement the mistake tracking system where incorrect answers deduct hearts, trigger a game over modal if hearts reach zero, and update user progression and streaks upon successful lesson completion.

```
Add the heart penalty system and lesson completion flow to the exercise engine. Deduct one heart from the user's balance in the database whenever an incorrect answer is submitted. If hearts drop to zero, trigger a 'Out of Hearts' game-over modal blocking further progression until practice or refill. Upon successfully finishing all questions in a lesson, calculate earned XP and gems, update user_progress and user_stats in Turso (checking if the daily streak should increment based on date difference), and render a celebratory victory screen with confetti animations before redirecting back to the skill tree path.
```

5. **AI Roleplay Conversation Partner** — Integrate an AI-powered chat partner mode where users can practice conversational foreign language skills with characters through real-time text and audio prompts.

```
Build an AI roleplay practice feature accessible at `/practice/chat`. Create an interface featuring a cartoon character persona (e.g., Lily or Duo) with chat bubble UI. Connect a backend API route to the OpenAI API using structured system prompts instructing the model to converse in the target language at an elementary level while providing gentle English translations or corrections when requested. Integrate Web Speech API text-to-speech so users can listen to the character's voice responses and speech-to-text or typed input for user replies.
```

6. **Leaderboards & Polish** — Build weekly competitive league leaderboards, shop screen for spending virtual gems, and comprehensive error handling and UI polish.

```
Implement a weekly leaderboards system at `/leaderboard` that groups users into virtual leagues based on weekly XP earned, rendering ranked lists with medals for top positions. Create a shop page at `/shop` allowing users to spend earned gems on heart refills or streak freezes. Polish all UI components with Tailwind transitions, sound effect audio cues on correct/incorrect button clicks, and responsive layout testing across mobile browsers to ensure a delightful app-like feel.
```

### Cost vs paying

**Starting costs (one-time):**

- Custom domain (optional): $12/yr
- AI coding tool subscription: $20
- Total: ~$32 one-time

**Ongoing costs (monthly):**

- Vercel Hobby + Turso Free + OpenAI API usage: $2-5/mo
- Total: ~$3/mo

- Paying for the SaaS instead: $12.99/mo
- Build time: 25-35 hours
- AI tool credits: $20 (Claude Pro / Cursor)
- Break-even: Under 1 month of Super Duolingo subscription

## Sources

- [Rewriting Duolingo's Engine in Scala](https://blog.duolingo.com/rewriting-duolingos-engine-in-scala/)
- [How Duolingo Handles Millions of Learners on AWS](https://medium.com/duolingo-engineering)
- [Help Center: What is Duolingo Max?](https://support.duolingo.com/hc/en-us/articles/19323485600909-What-is-Duolingo-Max)
- [Wikipedia: Duolingo](https://en.wikipedia.org/wiki/Duolingo)