Skip to content
CodeDNAGet started

Learn to code from real apps

Finally understand how your app works.

CodeDNA turns real code — including the app your AI built for you — into short animated stories, hands-on challenges and a clear picture of what’s built.

Try a sample appLearn my own app
  • No account needed
  • Code is read, never run
  • Progress stays in your browser

How it works

Four steps for every feature

Each lesson follows one real flow through the code, from the first click to what you see at the end.

  1. Step 01

    Watch

    Data travels from a button to the server, the database and back, one plain sentence per step.

  2. Step 02

    Understand

    Short cards explain each idea using lines from the real code.

  3. Step 03

    Try

    Predict, order the steps, spot the bug and fill the gap, all built from that code.

  4. Step 04

    Recap

    See what you learned, keep your streak and move on to the next part of the app.

What you get

Understand it, then check it’s right

Start by learning how the app works. When you need more, see how much of the brief is built and where it could break.

  • Every feature becomes a lesson

    CodeDNA traces each flow in the code — click, request, check, save, answer — and turns it into an animated story with the real lines beside it.

  • A map of the whole app

    Parts, pages and the main flows, so a newcomer sees how it is put together before reading a file.

  • Requirements coverage

    Drop in an SRS or client brief and see how much is built, what is partly there and what is still missing.

  • Quality checks

    Unhandled requests, unchecked sends and real edge cases from the code’s own conditions, as a checklist.

  • Private by design

    Code is only read, never run. No account, and your progress stays in your browser.

Get started

Three ways in

Learn your own project, any public GitHub repo, or a ready-made starter.

Recommended

Learn my app

Run this in your project folder. Your code is read on your computer and never leaves it.

npx codedna

Not on npm yet — from the CodeDNA folder run pnpm codedna path/to/your-app.

Learn from a GitHub repo

Paste a public repository and learn from real, working code.

Public repos only. The code is downloaded and read, never run.

What works, and the limits

What works

  • Full lessons: Next.js apps that use the App Router, in JavaScript or TypeScript.
  • Other JavaScript or TypeScript projects are read, but may give few or no lessons.
  • Not read yet: PHP, Python, Ruby, Go, Java and other languages, and Vue or Svelte files.

What is read

  • Public repos only, at the latest commit on the default branch. Work you haven’t pushed isn’t there.
  • Only .js, .jsx, .ts and .tsx files, plus package.json, tsconfig and READMEs. Folders like node_modules, dist and build are skipped.
  • Up to 1,000 code files, 2 MB per file and 50 MB in total. The download and the analysis each have 60 seconds.

Limits

  • Up to 5 imports every 10 minutes. Importing the same repo again within 10 minutes reuses the first result.
  • GitHub limits how often this server may ask for code. If it’s reached, try again later.
  • Repos that hold many separate apps (like course repos) can give repeated or noisy lessons.

Pick a starter repo

Small, real apps with lessons ready to go. The fastest way to see how CodeDNA works.

Browse starter repos

Explore

Starter repos

Real apps with lessons ready to go.

Loading starter repos…

See your app from the inside.

Five minutes with a sample app shows you everything CodeDNA can do.

Try a sample appLearn my own app