feat: build an AI agent from 0 to 1 -- 11 progressive sessions

- 11 sessions from basic agent loop to autonomous teams - Python MVP implementations for each session - Mental-model-first docs in en/zh/ja - Interactive web platform with step-through visualizations - Incremental architecture: each session adds one mechanism
2026-05-26 18:16:45 +08:00 · 2026-02-21 14:37:42 +08:00
commit c6a27ef1d7
156 changed files with 28059 additions and 0 deletions
--- a/web/src/i18n/messages/en.json
+++ b/web/src/i18n/messages/en.json
@@ -0,0 +1,74 @@
+{
+  "meta": { "title": "Learn Claude Code", "description": "Build an AI coding agent from scratch, one concept at a time" },
+  "nav": { "home": "Home", "timeline": "Timeline", "compare": "Compare", "layers": "Layers", "github": "GitHub" },
+  "home": { "hero_title": "Learn Claude Code", "hero_subtitle": "Build an AI coding agent from scratch, one concept at a time", "start": "Start Learning", "core_pattern": "The Core Pattern", "core_pattern_desc": "Every AI coding agent shares the same loop: call the model, execute tools, feed results back. Everything else is details.", "learning_path": "Learning Path", "learning_path_desc": "11 progressive sessions, from a simple loop to full autonomous teams", "layers_title": "Architectural Layers", "layers_desc": "Five orthogonal concerns that compose into a complete agent", "loc": "LOC", "learn_more": "Learn More", "versions_in_layer": "versions", "message_flow": "Message Growth", "message_flow_desc": "Watch the messages array grow as the agent loop executes" },
+  "version": { "loc": "lines of code", "tools": "tools", "new": "New", "prev": "Previous", "next": "Next", "view_source": "View Source", "view_diff": "View Diff", "design_decisions": "Design Decisions", "whats_new": "What's New", "tutorial": "Tutorial", "simulator": "Agent Loop Simulator", "execution_flow": "Execution Flow", "architecture": "Architecture", "concept_viz": "Concept Visualization", "alternatives": "Alternatives Considered", "tab_learn": "Learn", "tab_simulate": "Simulate", "tab_code": "Code", "tab_deep_dive": "Deep Dive" },
+  "sim": { "play": "Play", "pause": "Pause", "step": "Step", "reset": "Reset", "speed": "Speed", "step_of": "of" },
+  "timeline": { "title": "Learning Path", "subtitle": "s01 to s11: Progressive Agent Design", "layer_legend": "Layer Legend", "loc_growth": "LOC Growth", "learn_more": "Learn More" },
+  "layers": {
+    "title": "Architectural Layers",
+    "subtitle": "Five orthogonal concerns that compose into a complete agent",
+    "tools": "What the agent CAN do. The foundation: tools give the model capabilities to interact with the world.",
+    "planning": "How work is organized. From simple todo lists to dependency-aware task boards shared across agents.",
+    "memory": "Keeping context within limits. Compression strategies that let agents work infinitely without losing coherence.",
+    "concurrency": "Non-blocking execution. Background threads and notification buses for parallel work.",
+    "collaboration": "Multi-agent coordination. Teams, messaging, and autonomous teammates that think for themselves."
+  },
+  "compare": {
+    "title": "Compare Versions",
+    "subtitle": "See what changed between any two versions",
+    "select_a": "Version A",
+    "select_b": "Version B",
+    "loc_delta": "LOC Delta",
+    "lines": "lines",
+    "new_tools_in_b": "New Tools in B",
+    "new_classes_in_b": "New Classes in B",
+    "new_functions_in_b": "New Functions in B",
+    "tool_comparison": "Tool Comparison",
+    "only_in": "Only in",
+    "shared": "Shared",
+    "none": "None",
+    "source_diff": "Source Code Diff",
+    "empty_hint": "Select two versions above to compare them.",
+    "architecture": "Architecture"
+  },
+  "diff": {
+    "new_classes": "New Classes",
+    "new_tools": "New Tools",
+    "new_functions": "New Functions",
+    "loc_delta": "LOC Delta"
+  },
+  "sessions": {
+    "s01": "The Agent Loop",
+    "s02": "Tools",
+    "s03": "TodoWrite",
+    "s04": "Subagents",
+    "s05": "Skills",
+    "s06": "Compact",
+    "s07": "Tasks",
+    "s08": "Background Tasks",
+    "s09": "Agent Teams",
+    "s10": "Team Protocols",
+    "s11": "Autonomous Agents"
+  },
+  "layer_labels": {
+    "tools": "Tools & Execution",
+    "planning": "Planning & Coordination",
+    "memory": "Memory Management",
+    "concurrency": "Concurrency",
+    "collaboration": "Collaboration"
+  },
+  "viz": {
+    "s01": "The Agent While-Loop",
+    "s02": "Tool Dispatch Map",
+    "s03": "TodoWrite Nag System",
+    "s04": "Subagent Context Isolation",
+    "s05": "On-Demand Skill Loading",
+    "s06": "Three-Layer Context Compression",
+    "s07": "Task Dependency Graph",
+    "s08": "Background Task Lanes",
+    "s09": "Agent Team Mailboxes",
+    "s10": "FSM Team Protocols",
+    "s11": "Autonomous Agent Cycle"
+  }
+}
--- a/web/src/i18n/messages/ja.json
+++ b/web/src/i18n/messages/ja.json
@@ -0,0 +1,74 @@
+{
+  "meta": { "title": "Learn Claude Code", "description": "AIコーディングエージェントをゼロから構築、一つずつ概念を追加" },
+  "nav": { "home": "ホーム", "timeline": "学習パス", "compare": "バージョン比較", "layers": "アーキテクチャ層", "github": "GitHub" },
+  "home": { "hero_title": "Learn Claude Code", "hero_subtitle": "AIコーディングエージェントをゼロから構築、一つずつ概念を追加", "start": "学習を始める", "core_pattern": "コアパターン", "core_pattern_desc": "全てのAIコーディングエージェントは同じループを共有：モデルを呼び出し、ツールを実行し、結果をフィードバック。他は全て詳細。", "learning_path": "学習パス", "learning_path_desc": "11の段階的セッション、シンプルなループから完全自律チームまで", "layers_title": "アーキテクチャ層", "layers_desc": "5つの直交する関心事が完全なエージェントを構成", "loc": "行", "learn_more": "詳細を見る", "versions_in_layer": "バージョン", "message_flow": "メッセージの増加", "message_flow_desc": "エージェントループ実行時のメッセージ配列の成長を観察" },
+  "version": { "loc": "行のコード", "tools": "ツール", "new": "新規", "prev": "前のバージョン", "next": "次のバージョン", "view_source": "ソースを見る", "view_diff": "差分を見る", "design_decisions": "設計判断", "whats_new": "新機能", "tutorial": "チュートリアル", "simulator": "エージェントループシミュレーター", "execution_flow": "実行フロー", "architecture": "アーキテクチャ", "concept_viz": "コンセプト可視化", "alternatives": "検討された代替案", "tab_learn": "学習", "tab_simulate": "シミュレーション", "tab_code": "ソースコード", "tab_deep_dive": "詳細分析" },
+  "sim": { "play": "再生", "pause": "一時停止", "step": "ステップ", "reset": "リセット", "speed": "速度", "step_of": "/" },
+  "timeline": { "title": "学習パス", "subtitle": "s01からs11へ：段階的エージェント設計", "layer_legend": "レイヤー凡例", "loc_growth": "コード量の推移", "learn_more": "詳細を見る" },
+  "layers": {
+    "title": "アーキテクチャ層",
+    "subtitle": "5つの直交する関心事が完全なエージェントを構成",
+    "tools": "エージェントができること。基盤：ツールがモデルに外部世界と対話する能力を与える。",
+    "planning": "作業の組織化。シンプルなToDoリストからエージェント間で共有される依存関係対応タスクボードまで。",
+    "memory": "コンテキスト制限内での記憶保持。圧縮戦略によりエージェントが一貫性を失わずに無限に作業可能。",
+    "concurrency": "ノンブロッキング実行。バックグラウンドスレッドと通知バスによる並列作業。",
+    "collaboration": "マルチエージェント連携。チーム、メッセージング、自律的に考えるチームメイト。"
+  },
+  "compare": {
+    "title": "バージョン比較",
+    "subtitle": "任意の2つのバージョン間の変更を確認",
+    "select_a": "バージョンA",
+    "select_b": "バージョンB",
+    "loc_delta": "コード量の差分",
+    "lines": "行",
+    "new_tools_in_b": "Bの新規ツール",
+    "new_classes_in_b": "Bの新規クラス",
+    "new_functions_in_b": "Bの新規関数",
+    "tool_comparison": "ツール比較",
+    "only_in": "のみ",
+    "shared": "共通",
+    "none": "なし",
+    "source_diff": "ソースコード差分",
+    "empty_hint": "上で2つのバージョンを選択して比較してください。",
+    "architecture": "アーキテクチャ"
+  },
+  "diff": {
+    "new_classes": "新規クラス",
+    "new_tools": "新規ツール",
+    "new_functions": "新規関数",
+    "loc_delta": "コード量の差分"
+  },
+  "sessions": {
+    "s01": "エージェントループ",
+    "s02": "ツール",
+    "s03": "TodoWrite",
+    "s04": "サブエージェント",
+    "s05": "スキル",
+    "s06": "コンテキスト圧縮",
+    "s07": "タスクシステム",
+    "s08": "バックグラウンドタスク",
+    "s09": "エージェントチーム",
+    "s10": "チームプロトコル",
+    "s11": "自律エージェント"
+  },
+  "layer_labels": {
+    "tools": "ツールと実行",
+    "planning": "計画と調整",
+    "memory": "メモリ管理",
+    "concurrency": "並行処理",
+    "collaboration": "コラボレーション"
+  },
+  "viz": {
+    "s01": "エージェント Whileループ",
+    "s02": "ツールディスパッチマップ",
+    "s03": "TodoWrite リマインドシステム",
+    "s04": "サブエージェント コンテキスト分離",
+    "s05": "オンデマンド スキルローディング",
+    "s06": "3層コンテキスト圧縮",
+    "s07": "タスク依存関係グラフ",
+    "s08": "バックグラウンドタスクレーン",
+    "s09": "エージェントチーム メールボックス",
+    "s10": "FSM チームプロトコル",
+    "s11": "自律エージェントサイクル"
+  }
+}
--- a/web/src/i18n/messages/zh.json
+++ b/web/src/i18n/messages/zh.json
@@ -0,0 +1,74 @@
+{
+  "meta": { "title": "Learn Claude Code", "description": "从零构建 AI 编程 Agent，每次只加一个概念" },
+  "nav": { "home": "首页", "timeline": "学习路径", "compare": "版本对比", "layers": "架构层", "github": "GitHub" },
+  "home": { "hero_title": "Learn Claude Code", "hero_subtitle": "从零构建 AI 编程 Agent，每次只加一个概念", "start": "开始学习", "core_pattern": "核心模式", "core_pattern_desc": "所有 AI 编程 Agent 共享同一个循环：调用模型、执行工具、回传结果。其他都是细节。", "learning_path": "学习路径", "learning_path_desc": "11 个渐进式课程，从简单循环到完整自主团队", "layers_title": "架构层次", "layers_desc": "五个正交关注点组合成完整的 Agent", "loc": "行", "learn_more": "了解更多", "versions_in_layer": "个版本", "message_flow": "消息增长", "message_flow_desc": "观察 Agent 循环执行时消息数组的增长" },
+  "version": { "loc": "行代码", "tools": "个工具", "new": "新增", "prev": "上一版", "next": "下一版", "view_source": "查看源码", "view_diff": "查看变更", "design_decisions": "设计决策", "whats_new": "新增内容", "tutorial": "教程", "simulator": "Agent 循环模拟器", "execution_flow": "执行流程", "architecture": "架构", "concept_viz": "概念可视化", "alternatives": "替代方案", "tab_learn": "学习", "tab_simulate": "模拟", "tab_code": "源码", "tab_deep_dive": "深入探索" },
+  "sim": { "play": "播放", "pause": "暂停", "step": "单步", "reset": "重置", "speed": "速度", "step_of": "/" },
+  "timeline": { "title": "学习路径", "subtitle": "s01 到 s11：渐进式 Agent 设计", "layer_legend": "层次图例", "loc_growth": "代码量增长", "learn_more": "了解更多" },
+  "layers": {
+    "title": "架构层次",
+    "subtitle": "五个正交关注点组合成完整的 Agent",
+    "tools": "Agent 能做什么。基础层：工具赋予模型与外部世界交互的能力。",
+    "planning": "如何组织工作。从简单的待办列表到跨 Agent 共享的依赖感知任务板。",
+    "memory": "在上下文限制内保持记忆。压缩策略让 Agent 可以无限工作而不失去连贯性。",
+    "concurrency": "非阻塞执行。后台线程和通知总线实现并行工作。",
+    "collaboration": "多 Agent 协作。团队、消息传递和能独立思考的自主队友。"
+  },
+  "compare": {
+    "title": "版本对比",
+    "subtitle": "查看任意两个版本之间的变化",
+    "select_a": "版本 A",
+    "select_b": "版本 B",
+    "loc_delta": "代码量差异",
+    "lines": "行",
+    "new_tools_in_b": "B 中新增工具",
+    "new_classes_in_b": "B 中新增类",
+    "new_functions_in_b": "B 中新增函数",
+    "tool_comparison": "工具对比",
+    "only_in": "仅在",
+    "shared": "共有",
+    "none": "无",
+    "source_diff": "源码差异",
+    "empty_hint": "请在上方选择两个版本进行对比。",
+    "architecture": "架构"
+  },
+  "diff": {
+    "new_classes": "新增类",
+    "new_tools": "新增工具",
+    "new_functions": "新增函数",
+    "loc_delta": "代码量差异"
+  },
+  "sessions": {
+    "s01": "Agent 循环",
+    "s02": "工具",
+    "s03": "TodoWrite",
+    "s04": "子 Agent",
+    "s05": "技能",
+    "s06": "上下文压缩",
+    "s07": "任务系统",
+    "s08": "后台任务",
+    "s09": "Agent 团队",
+    "s10": "团队协议",
+    "s11": "自主 Agent"
+  },
+  "layer_labels": {
+    "tools": "工具与执行",
+    "planning": "规划与协调",
+    "memory": "内存管理",
+    "concurrency": "并发",
+    "collaboration": "协作"
+  },
+  "viz": {
+    "s01": "Agent While 循环",
+    "s02": "工具分发映射",
+    "s03": "TodoWrite 提醒系统",
+    "s04": "子 Agent 上下文隔离",
+    "s05": "按需技能加载",
+    "s06": "三层上下文压缩",
+    "s07": "任务依赖图",
+    "s08": "后台任务通道",
+    "s09": "Agent 团队邮箱",
+    "s10": "FSM 团队协议",
+    "s11": "自主 Agent 循环"
+  }
+}