Skip to main content
Handhold is a desktop app for interactive programming courses. Each lesson is a narrated walkthrough where code, diagrams, and data structures animate in sync with spoken audio. Labs give you a real editor, real tests, and real services to build against.

​
What makes Handhold different

Most programming courses show you static code blocks and expect you to follow along. Handhold synchronizes narration with animated visualizations, so you see exactly what the instructor is explaining at the moment they explain it.

Narrated lessons

Every lesson is spoken aloud with text-to-speech. Code, diagrams, and data structures animate in sync with the narration.

Interactive labs

Write real code in a real editor. Run tests against real services like Postgres and Redis in containers.

Visual primitives

Code blocks with syntax highlighting and line-level animation. Data structures (arrays, trees, graphs) with layout and focus. Architecture diagrams with AWS icons.

Works offline

Everything runs locally. No network required after installation. TTS models, React runtime, and course content are bundled.

​
How it works

Lessons are Markdown files with an embedded DSL for triggers and animations. Each lesson walks through a concept step by step:
  1. Narration fires triggers — The spoken text contains commands like {{show: hash-fn}} that control what appears on screen
  2. Visualizations animate — Code blocks highlight specific lines, data structures focus on nodes, diagrams trace paths
  3. Labs reinforce concepts — After each lesson, you write code to apply what you learned
Courses alternate between bite-sized lessons (5-15 minutes) and focused labs (10-20 minutes). Each lab builds on previous ones when the content supports it.

​
Example lesson structure

Here’s how a lesson on hash maps might flow:
1

Show the problem

Linear search through an array of names takes O(n) time. The narration asks: how can we do better?
2

Introduce the hash function

Code animates on screen showing a function that converts strings to integers. Focus highlights the signature, then the loop, then the return value.
3

Map hash to array index

Split screen shows the hash function on the left and a visual array on the right. The narration traces a key through the hash function to its bucket.
4

Handle collisions

Data structure visualization shows linked chains at each array slot. The narration walks through collision resolution.
After the lesson, a lab asks you to implement hash map insertion with collision handling. Tests verify your code against edge cases.

​
What you can build with Handhold

Handhold is built for technical courses that benefit from visualization:
  • Algorithms and data structures — Hash maps, trees, graph traversal, sorting
  • Systems concepts — How databases index data, how Redis handles persistence, how DNS resolution works
  • Web development — React component lifecycle, state management, CSS layout algorithms
  • Language features — JavaScript closures, Rust ownership, Python decorators
Anything that involves code, data flow, or system architecture works well.

​
Built with open source

Handhold is built with Tauri 2 (Rust backend) and React 19 (frontend). Text-to-speech uses Kokoro. Syntax highlighting uses Shiki. Container orchestration supports both Podman and Docker. The project is licensed under AGPL-3.0 and developed in the open on GitHub.

​
Next steps

Install Handhold

One-command installer for macOS, Linux, and Windows

Quick start

Go from install to watching your first lesson in 5 minutes

Build docs developers (and LLMs) love

Get started for freeTalk to us