⭐ If this tutorial helps you understand AI Agents, star the repo — Goal: 10k stars!

---

https://github.com/user-attachments/assets/72102803-c56d-4b37-816f-f530a7ce9dc2

Why this exists

OpenHarness dropped and immediately blew up — the first open-source implementation of the AI Agent Harness pattern that powers Claude Code, Cursor, and the next generation of AI coding tools.

But ~11,700 lines of infrastructure code is a lot to digest. Concepts like Agent Loop, tool registries, permission tiers, and MCP aren't obvious from reading source alone.

So I built this the next day: 12 interactive chapters that break down every core concept with real-world analogies, animated diagrams, hands-on simulators, and quizzes — so you can actually understand what OpenHarness does before diving into the code.

No AI or programming experience required.

Features

📖 12 Chapters	From "What is an AI Agent" to "Multi-Agent Collaboration"
🎮 Interactive	Agent Loop animation, Tool Explorer, Permission Sandbox, Architecture Diagram
🧠 Quizzes	Embedded in every chapter with instant feedback
📊 Progress	Auto-tracks completed chapters
🌙 Dark Mode	Deep navy palette, easy on the eyes
📱 Responsive	Mobile, tablet, desktop

Curriculum

Harness = Tools + Knowledge + Observation + Action + Permissions

Phase A · Fundamentals

#	Chapter	Key Concepts
01	What is AI Agent	LLM vs Agent — from "talking" to "doing"
02	What is Harness	The Agent's equipment system
03	The Harness Equation	Tools + Knowledge + Observation + Action + Permissions

Phase B · Core Mechanisms

#	Chapter	Key Concepts
04	Agent Loop	Think → Act → Observe, the infinite loop
05	Tool System	43+ built-in tools, unified interface + registry pattern
06	Permission System	Three-tier security guardrails
07	Hook System	Lifecycle events, inject custom logic at critical moments

Phase C · Intelligence Layer

#	Chapter	Key Concepts
08	Skills	On-demand knowledge loading
09	Memory	Cross-session persistence, 4 memory types
10	MCP Integration	Standardized external world connection (like USB)

Phase D · Advanced

#	Chapter	Key Concepts
11	Multi-Agent	Parallel sub-agents, divide and conquer
12	Full Flow	Complete journey from user input to Agent response

Quick Start

git clone https://github.com/joyehuang/Learn-Open-Harness.git
cd Learn-Open-Harness
npm install
npm run dev

Open http://localhost:3000 and start learning.

Tech Stack

Tech	Purpose
Next.js 16	App Router, SSR
TypeScript 5	Type safety
Tailwind CSS v4	Styling
shadcn/ui	UI components
next-themes	Dark mode

Contributing

Contributions welcome!

• Fix content: PR to src/content/chapter-XX.ts
• Add chapters: Follow existing format in src/content/
• Improve interactive components: src/components/interactive/
• Translate: Help bring this to more languages

Each chapter is a TypeScript file with section blocks (text, analogy, code, quiz, key-concept, comparison, diagram) — easy to modify, zero barrier to contribute.

License

MIT

---