Skip to content

Commit 6992ae2

Browse files
hashpandaclaude
andcommitted
docs: 添加英文 README 并增加中英文切换链接
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1 parent 6ede841 commit 6992ae2

2 files changed

Lines changed: 163 additions & 0 deletions

File tree

README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,9 @@
33
<p align="center">
44
<strong>从零构建企业级 AI Agent CLI — 逐课拆解 Claude Code 源码架构</strong>
55
</p>
6+
<p align="center">
7+
<a href="./README.md">中文</a> · <a href="./README_en.md">English</a>
8+
</p>
69
<p align="center">
710
🌐 <a href="https://build.funagent.app">官网</a> · 📖 <a href="./CONTRIBUTING.md">贡献指南</a> · 🐛 <a href="https://github.com/funAgent/build-claude-code-cli/issues">反馈问题</a>
811
</p>

README_en.md

Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
<p align="center">
2+
<h1 align="center">Build Claude Code</h1>
3+
<p align="center">
4+
<strong>Build an Enterprise-Grade AI Agent CLI from Scratch — A Lesson-by-Lesson Deconstruction of Claude Code's Architecture</strong>
5+
</p>
6+
<p align="center">
7+
<a href="./README.md">中文</a> · <a href="./README_en.md">English</a>
8+
</p>
9+
<p align="center">
10+
🌐 <a href="https://build.funagent.app">Website</a> · 📖 <a href="./CONTRIBUTING.md">Contributing</a> · 🐛 <a href="https://github.com/funAgent/build-claude-code-cli/issues">Issues</a>
11+
</p>
12+
</p>
13+
14+
<p align="center">
15+
<a href="https://github.com/funAgent/build-claude-code-cli/stargazers"><img src="https://img.shields.io/github/stars/funAgent/build-claude-code-cli?style=flat&color=FFD700" alt="GitHub Stars" /></a>
16+
<a href="https://github.com/funAgent/build-claude-code-cli/network/members"><img src="https://img.shields.io/github/forks/funAgent/build-claude-code-cli?style=flat" alt="GitHub Forks" /></a>
17+
<a href="https://github.com/funAgent/build-claude-code-cli/commits"><img src="https://img.shields.io/github/last-commit/funAgent/build-claude-code-cli" alt="Last Commit" /></a>
18+
<a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="MIT License" /></a>
19+
<img src="https://img.shields.io/badge/lessons-49-brightgreen.svg" alt="49 Lessons" />
20+
<img src="https://img.shields.io/badge/TypeScript-100%25-3178C6.svg" alt="TypeScript" />
21+
<img src="https://img.shields.io/badge/Next.js-16-000.svg" alt="Next.js 16" />
22+
</p>
23+
24+
---
25+
26+
## Disclaimer
27+
28+
This project is for **educational purposes only**. The content is based on publicly available technical analyses of Claude Code and inspired by the [learn-claude-code](https://github.com/shareAI-lab/learn-claude-code) project. All lesson code is independently written for teaching demonstration and is not intended for production use.
29+
30+
> "Claude Code" is a trademark of Anthropic. This project is not affiliated with or endorsed by Anthropic.
31+
32+
## What is this?
33+
34+
![Website Homepage](.github/screenshot.jpg)
35+
36+
49 progressive lessons that teach you to build a fully-featured AI Agent CLI — architecturally aligned with [Claude Code](https://github.com/anthropics/claude-code) — starting from `npm init`.
37+
38+
**The core pattern is just one while loop:**
39+
40+
```typescript
41+
while (true) {
42+
response = await client.messages.create({ messages, tools })
43+
if (response.stop_reason !== "tool_use") break
44+
for (const toolCall of response.content) {
45+
result = await executeTool(toolCall.name, toolCall.input)
46+
messages.push(result)
47+
}
48+
}
49+
```
50+
51+
Each lesson produces a self-contained, runnable project snapshot. From the first API call to the final telemetry system, you'll end up with a complete, distributable AI Agent CLI.
52+
53+
## Quick Start
54+
55+
```bash
56+
# Clone the repo
57+
git clone https://github.com/funAgent/build-claude-code-cli.git
58+
cd build-claude-code-cli
59+
60+
# Run any lesson
61+
cd agents/s03-agent-loop
62+
npm install
63+
cp .env.example .env # then add your API key
64+
npm run dev
65+
66+
# Launch the tutorial website
67+
cd web
68+
npm install
69+
npm run dev
70+
# Visit http://localhost:3000
71+
```
72+
73+
**Prerequisites:** Node.js >= 18 · npm >= 9 · Git
74+
75+
## Curriculum
76+
77+
Start learning at [build.funagent.app](https://build.funagent.app/)
78+
79+
| # | Phase | Lessons | Key Capabilities |
80+
|---|-------|---------|-----------------|
81+
| 0 | Foundations | s00 – s02 | API calls, CLI scaffolding, child process management |
82+
| 1 | Minimal Agent | s03 – s07 | Agent loop, message management, error handling, config, cost tracking |
83+
| 2 | Tool System | s08 – s12 | Tool abstraction, file read/write, editing, search, tool registry |
84+
| 3 | Terminal UI | s13 – s16 | Ink components, message list, input box, full REPL |
85+
| 4 | Prompt Engineering | s17 – s19 | System prompts, CLAUDE.md rules, prompt caching |
86+
| 5 | Streaming & Performance | s20 – s23 | Stream parsing, token streaming, parallel tools, startup optimization |
87+
| 6 | Context Management | s24 – s26 | Conversation compaction, multi-layer strategies, large output handling |
88+
| 7 | Agent Intelligence | s27 – s31 | Planning (TodoWrite), sub-agents, skill system, task management |
89+
| 8 | Security & Permissions | s32 – s34 | Rule engine, permission UI, sub-agent permission inheritance |
90+
| 9 | Extension Ecosystem | s35 – s38 | MCP protocol, session persistence, plugin system |
91+
| 10 | Multi-Agent | s39 – s43 | Agent definitions, coordinator, team collaboration, communication protocols, worktree isolation |
92+
| 11 | Production-Ready | s44 – s48 | Graceful recovery, feature flags, packaging & distribution, native capabilities, telemetry & diagnostics |
93+
94+
## Project Structure
95+
96+
```
97+
build-claude-code-cli/
98+
├── agents/ # 49 TypeScript lessons (each independently runnable)
99+
│ ├── s00-api-basics/
100+
│ ├── s01-cli-scaffold/
101+
│ ├── ...
102+
│ └── s48-telemetry-diagnostics/
103+
├── docs/ # Tutorial documentation
104+
│ ├── zh/ # 中文 (49 articles)
105+
│ └── en/ # English
106+
├── web/ # Next.js tutorial website
107+
│ └── src/
108+
│ ├── app/ # Page routes
109+
│ ├── components/ # UI components (source viewer, diff, terminal player, etc.)
110+
│ ├── data/ # Scenarios, annotations, terminal recordings
111+
│ └── lib/ # Utilities, constants, i18n
112+
├── reference/ # Claude Code architecture reference notes
113+
├── PLAN.md # Detailed planning document
114+
├── TODO.md # Development progress tracking
115+
└── CONTRIBUTING.md # Contribution guide
116+
```
117+
118+
## Tutorial Website Features
119+
120+
- **Interactive Source Viewer** — Syntax highlighting + lesson-by-lesson diff comparison
121+
- **Terminal Recording Player** — Simulated real CLI interaction playback
122+
- **Architecture Overview** — Visual module relationships and layered structure
123+
- **Deep Annotations** — Architecture decisions mapped to Claude Code source code
124+
- **Progress Tracking** — Locally persisted completion status
125+
- **Bilingual Support** — Full Chinese/English toggle
126+
- **Dark Mode** — Automatically follows system preference
127+
128+
## Tech Stack
129+
130+
**Lesson Projects:** TypeScript · Node.js · Commander.js · React + Ink · Anthropic SDK · Zod · esbuild · MCP SDK
131+
132+
**Tutorial Website:** Next.js 16 · React 19 · Tailwind CSS v4 · Framer Motion · unified (Markdown rendering)
133+
134+
## Contributing
135+
136+
Contributions are welcome! See [CONTRIBUTING.md](./CONTRIBUTING.md) to learn how to:
137+
138+
- Improve existing lesson content
139+
- Add new knowledge and materials
140+
- Ensure consistency across lessons
141+
142+
## Contributors
143+
144+
<a href="https://github.com/funAgent/build-claude-code-cli/graphs/contributors">
145+
<img src="https://contrib.rocks/image?repo=funAgent/build-claude-code-cli" />
146+
</a>
147+
148+
## Star History
149+
150+
<a href="https://star-history.com/#funAgent/build-claude-code-cli&Date">
151+
<picture>
152+
<source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=funAgent/build-claude-code-cli&type=Date&theme=dark" />
153+
<source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=funAgent/build-claude-code-cli&type=Date" />
154+
<img alt="Star History Chart" src="https://api.star-history.com/svg?repos=funAgent/build-claude-code-cli&type=Date" />
155+
</picture>
156+
</a>
157+
158+
## License
159+
160+
[MIT](./LICENSE) © [funAgent](https://github.com/funAgent)

0 commit comments

Comments
 (0)