A complete AI Agent learning site for LangChain and LangGraph. The project now includes bilingual English/Chinese pages for the homepage, navigation pages, summaries, and explained lessons, plus the original notebook-derived course pages. It is fully static and can be opened directly in a browser.
中文 / Switch to Chinese
一套完整的 AI Agent 学习网站，覆盖 LangChain 与 LangGraph。项目已支持中英双语：首页、导航页、模块总结页和讲解页都有英文镜像页面，同时保留原始 notebook 转换课程页。无需安装，浏览器直接打开即可学习。
- 想系统学习 LangChain / LangGraph 的用户
- 对 AI Agent 开发感兴趣的新手
- 具备入门级 Python 知识即可，无需 LangChain 或 LLM 开发经验
- 希望用中文理解概念、同时对照英文技术表达的学习者
- 理解 LangChain 中模型调用、Prompt、Tools、Memory、Runtime Context 与多 Agent 的核心用法
- 掌握 LangGraph 的状态图、节点、边、条件路由、Reducer、子图、并行化与 Map-Reduce 模式
- 构建带工具调用、记忆、人工审批、流式输出与中断恢复能力的 Agent 工作流
- 理解长期记忆、外部存储、RemoteGraph、Assistant 与部署并发策略等生产相关概念
- 能够对照官方英文课程和文档，独立阅读并扩展 LangChain / LangGraph 示例
站点内右下角有语言切换按钮，可在中文和英文页面之间切换。英文页面覆盖首页、导航页、模块总结页和讲解页；notebook 转换页暂不翻译。
LangChain Module 1 -> 2 -> 3 -> LangGraph Module 1 -> 2 -> 3 -> 4 -> 5 -> 6
建议先完成 LangChain 三个模块，打好工具调用、状态管理、多 Agent 的基础，再进入 LangGraph 学习图结构与生产部署。如果你已有 LangChain 基础，也可以直接从 LangGraph Module 1 开始。
本项目基于 LangChain Academy 的两门官方课程，对每一个 module 的每一个 Jupyter Notebook 逐一进行细致讲解：
| 课程 | 官方链接 | GitHub |
|---|---|---|
| Introduction to LangChain (Python) | academy.langchain.com | lca-lc-foundations |
| Intro to LangGraph | academy.langchain.com | langchain-academy |
LangChain Academy 的官方课程是英文的，对中文用户不够友好。这个项目把官方课程的核心内容重新整理，用中文深度讲解每一个概念，并为每个知识点提供对应的讲解页（Explained），帮助学习者真正理解背后的原理，而不只是照着代码跑一遍。
现在项目也提供英文镜像页，方便中英文对照学习、检索和分享。
本项目不是 LangChain 官方项目，也不替代官方课程。内容以学习、解释、梳理和补充为目的；课程设计、原始示例与相关商标归其各自权利方所有。
| 课程 | 内容 |
|---|---|
| 1.1 Foundational Models | 大语言模型基础、调用方式与选型 |
| 1.1 Prompting | Prompt 模板设计与最佳实践 |
| 1.2 Tools | 工具绑定与函数调用 |
| 1.2 Web Search | 集成搜索工具构建联网 Agent |
| 1.3 Memory | 对话记忆机制 |
| 1.4 Multimodal Messages | 多模态消息处理（图像、文本） |
| 1.5 Personal Chef | 综合实战：个人厨师 Agent |
| 课程 | 内容 |
|---|---|
| 2.1 MCP | Model Context Protocol 协议介绍 |
| 2.1 Travel Agent | 旅行规划 Agent 实战 |
| 2.2 Runtime Context | 运行时上下文传递 |
| 2.2 State | Agent 状态管理 |
| 2.3 Multi Agent | 多 Agent 协作架构 |
| 2.4 Wedding Planners | 综合实战：婚礼策划多 Agent |
| Bonus: RAG | 检索增强生成（RAG）实现 |
| Bonus: SQL | 自然语言转 SQL Agent |
| 课程 | 内容 |
|---|---|
| 3.2 Managing Messages | 消息历史管理与裁剪 |
| 3.3 Human in the Loop | 人工介入审批机制 |
| 3.4 Dynamic Models | 运行时动态切换模型 |
| 3.4 Dynamic Prompts | 运行时动态生成 Prompt |
| 3.4 Dynamic Tools | 运行时动态注入工具 |
| 3.5 Email Agent | 综合实战：邮件处理 Agent |
| 课程 | 内容 |
|---|---|
| 1-1 Simple Graph | 第一个 LangGraph 状态图 |
| 1-2 Chain | 节点链式调用 |
| 1-3 Router | 条件边与路由逻辑 |
| 1-4 Agent | 用 LangGraph 构建 ReAct Agent |
| 1-5 Agent Memory | 短期对话记忆 |
| 1-6 Deployment | LangGraph Server 本地部署 |
| 课程 | 内容 |
|---|---|
| 2-1 State Schema | TypedDict / Pydantic 状态模式定义 |
| 2-2 State Reducers | Reducer 合并策略 |
| 2-3 Multiple Schemas | 输入/输出/私有多状态模式 |
| 2-4 Trim & Filter Messages | 消息裁剪与过滤 |
| 2-5 Chatbot Summarization | 对话自动摘要 |
| 2-6 Chatbot External Memory | 外部持久化存储对话 |
| 课程 | 内容 |
|---|---|
| 3-1 Streaming & Interruption | 流式输出与中断机制 |
| 3-2 Breakpoints | 静态断点设置 |
| 3-3 Edit State & Human Feedback | 暂停后编辑图状态 |
| 3-4 Dynamic Breakpoints | 节点内动态触发中断 |
| 3-5 Time Travel | 历史状态回溯与分支重放 |
| 课程 | 内容 |
|---|---|
| 4-1 Parallelization | 扇出/扇入并行节点 |
| 4-2 Sub Graph | 子图组合与通信 |
| 4-3 Map Reduce | 动态并行的 Map-Reduce 模式 |
| 4-4 Research Assistant | 综合实战：并行研究助手 |
| 课程 | 内容 |
|---|---|
| 5-1 Memory Store | BaseStore 跨线程持久记忆 |
| 5-2 Memory Schema Profile | 用户画像记忆模式 |
| 5-3 Memory Schema Collection | 集合式记忆模式 |
| 5-4 Memory Agent | 自主管理记忆的 Agent |
| 课程 | 内容 |
|---|---|
| 6-1 Creating | 创建 LangGraph 部署实例 |
| 6-2 Connecting | 通过 RemoteGraph 连接远端图 |
| 6-3 Double Texting | 处理并发请求的双发消息策略 |
| 6-4 Assistant | 在部署环境中管理 Assistant |
| 类型 | 说明 |
|---|---|
| 课程页 | 原始 notebook 转换内容，含完整代码示例，适合跟着动手练习 |
| 讲解页（Explained） | 对应课程的深度讲解，剖析原理、解释设计决策，适合深入理解 |
| 模块总结 | 每个模块结束后的知识点汇总，适合复习 |
| 英文镜像页 | 首页、导航页、summary 与 explained 页的英文版本 |
页面统计：
| 类型 | 数量 |
|---|---|
| 原始中文/默认 HTML 页面 | 119 |
| 英文镜像页面 | 69 |
| HTML 页面合计 | 188 |
| 课程知识点 | 50 |
| 双语讲解页（Explained） | 50 |
| 双语模块总结页 | 7 |
无需安装任何依赖，纯静态 HTML：
git clone https://github.com/Tony1986111/learnlanggraph.git
cd learnlanggraph
# 方式一：直接用浏览器打开
open home.html
# 方式二：起一个本地静态服务（推荐，避免部分浏览器的跨域限制）
python3 -m http.server 8080
# 然后访问 http://localhost:8080/home.html英文首页：
http://localhost:8080/en/home.html
- 纯静态 HTML + CSS + JavaScript，零框架依赖
- 支持中英双语页面与语言切换按钮
- 支持深色 / 浅色主题切换
- 响应式布局，支持移动端阅读
- 部署于 Vercel，全球 CDN 加速
learnlanggraph/
├── home.html # 中文/默认学习总首页
├── en/ # 英文镜像页面
│ ├── home.html
│ ├── langChain/
│ └── langGraph/
├── langChain/
│ ├── index.html # LangChain 路径导航
│ ├── module-1/
│ ├── module-2/
│ └── module-3/
├── langGraph/
│ ├── index.html # LangGraph 路径导航
│ ├── module-1/
│ ├── module-2/
│ ├── module-3/
│ ├── module-4/
│ ├── module-5/
│ └── module-6/
├── i18n.js # 站点语言切换脚本
├── nav.css # 共享导航、主题与语言切换样式
├── translation_manifest.csv # 英文页面翻译清单
└── vercel.json # 部署配置
- LangChain Academy — 官方英文课程（本项目的内容来源）
- LangGraph 官方文档
- LangChain 官方文档
欢迎任何形式的贡献：
- 发现内容错误或表述不清：请提交 Issue，说明页面路径、问题描述和建议改法
- 改进讲解或翻译：欢迎 Fork 后提交 Pull Request，请尽量保持每个 PR 聚焦一个主题
- 补充新模块：如果官方课程更新了内容，欢迎按现有目录结构补充课程页、讲解页和模块导航
- 修复展示问题：包括链接失效、移动端阅读体验、主题切换、语言切换、错别字和排版问题
贡献前建议阅读 CONTRIBUTING.md。内容类修改请保持术语一致，代码示例尽量可运行，新增外部链接需要确认可以访问。
本项目的所有内容均基于 LangChain Academy 的官方课程。感谢 LangChain 团队设计并开源了这些高质量课程，让开发者社区能够系统地学习 LangChain 与 LangGraph 的核心理念与工程实践。
原始课程资料：
本项目代码与本站原创整理内容采用 MIT License 发布。
请注意：本项目基于 LangChain Academy 官方课程进行学习整理与讲解，原始课程、示例、品牌名称和相关素材的权利归其各自权利方所有。
- Learners who want a structured path through LangChain and LangGraph
- Beginners interested in AI Agent development
- Developers with basic Python knowledge; no prior LangChain or LLM application experience is required
- Readers who want Chinese explanations alongside English technical terminology and bilingual pages
- How LangChain handles model calls, prompts, tools, memory, runtime context, and multi-agent workflows
- How LangGraph models state graphs, nodes, edges, conditional routing, reducers, subgraphs, parallelization, and Map-Reduce
- How to build agent workflows with tool calling, memory, human approval, streaming output, interruption, and recovery
- Production-oriented concepts such as long-term memory, external stores, RemoteGraph, Assistants, and deployment concurrency strategies
- How to compare the lessons with the official English courses and documentation, then extend the examples independently
The site includes a language switcher in the bottom-right corner. English pages are available for the homepage, navigation pages, module summaries, and explained lesson pages. Notebook-derived course pages remain in their original form for now.
LangChain Module 1 -> 2 -> 3 -> LangGraph Module 1 -> 2 -> 3 -> 4 -> 5 -> 6
Start with the three LangChain modules to build a foundation in tool calling, state, and multi-agent patterns. Then move into LangGraph to learn graph structure, controllable execution, memory, and production deployment. If you already know LangChain, you can start directly from LangGraph Module 1.
This project is based on two official LangChain Academy courses. It reorganizes and explains every module and notebook in a learning-site format:
| Course | Official Link | GitHub |
|---|---|---|
| Introduction to LangChain (Python) | academy.langchain.com | lca-lc-foundations |
| Intro to LangGraph | academy.langchain.com | langchain-academy |
LangChain Academy provides high-quality official courses, but they are primarily in English. This project reorganizes the course material into a learner-friendly static site, with deep explanations for each lesson and bilingual pages for the main learning content.
The goal is not only to run the code, but to understand the design decisions behind each agent workflow: why state is shaped a certain way, why a reducer is needed, how tools are routed, when human intervention matters, and how deployment changes the architecture.
This is not an official LangChain project and does not replace the official courses. Course design, original examples, trademarks, and related materials belong to their respective owners.
| Lesson | Topic |
|---|---|
| 1.1 Foundational Models | LLM basics, model calls, and model selection |
| 1.1 Prompting | Prompt template design and best practices |
| 1.2 Tools | Tool binding and function calling |
| 1.2 Web Search | Building web-connected agents with search tools |
| 1.3 Memory | Conversation memory |
| 1.4 Multimodal Messages | Multimodal message handling for images and text |
| 1.5 Personal Chef | Capstone project: a personal chef agent |
| Lesson | Topic |
|---|---|
| 2.1 MCP | Introduction to the Model Context Protocol |
| 2.1 Travel Agent | Travel planning agent project |
| 2.2 Runtime Context | Passing runtime context |
| 2.2 State | Agent state management |
| 2.3 Multi Agent | Multi-agent collaboration patterns |
| 2.4 Wedding Planners | Capstone project: multi-agent wedding planners |
| Bonus: RAG | Retrieval-augmented generation |
| Bonus: SQL | Natural-language-to-SQL agent |
| Lesson | Topic |
|---|---|
| 3.2 Managing Messages | Managing and trimming message history |
| 3.3 Human in the Loop | Human approval and intervention |
| 3.4 Dynamic Models | Runtime model switching |
| 3.4 Dynamic Prompts | Runtime prompt generation |
| 3.4 Dynamic Tools | Runtime tool injection |
| 3.5 Email Agent | Capstone project: email-processing agent |
| Lesson | Topic |
|---|---|
| 1-1 Simple Graph | Your first LangGraph state graph |
| 1-2 Chain | Chaining graph nodes |
| 1-3 Router | Conditional edges and routing logic |
| 1-4 Agent | Building a ReAct agent with LangGraph |
| 1-5 Agent Memory | Short-term conversation memory |
| 1-6 Deployment | Local LangGraph Server deployment |
| Lesson | Topic |
|---|---|
| 2-1 State Schema | State schemas with TypedDict and Pydantic |
| 2-2 State Reducers | Reducer merge strategies |
| 2-3 Multiple Schemas | Input, output, and private state schemas |
| 2-4 Trim & Filter Messages | Message trimming and filtering |
| 2-5 Chatbot Summarization | Automatic conversation summarization |
| 2-6 Chatbot External Memory | External persistent conversation storage |
| Lesson | Topic |
|---|---|
| 3-1 Streaming & Interruption | Streaming output and interruption |
| 3-2 Breakpoints | Static breakpoints |
| 3-3 Edit State & Human Feedback | Editing graph state after pause |
| 3-4 Dynamic Breakpoints | Triggering dynamic interrupts inside nodes |
| 3-5 Time Travel | Replaying and branching from historical states |
| Lesson | Topic |
|---|---|
| 4-1 Parallelization | Fan-out / fan-in parallel nodes |
| 4-2 Sub Graph | Subgraph composition and communication |
| 4-3 Map Reduce | Dynamic parallelism with Map-Reduce |
| 4-4 Research Assistant | Capstone project: parallel research assistant |
| Lesson | Topic |
|---|---|
| 5-1 Memory Store | Cross-thread persistent memory with BaseStore |
| 5-2 Memory Schema Profile | Profile-based user memory |
| 5-3 Memory Schema Collection | Collection-based memory |
| 5-4 Memory Agent | An agent that manages its own memory |
| Lesson | Topic |
|---|---|
| 6-1 Creating | Creating a LangGraph deployment |
| 6-2 Connecting | Connecting to a remote graph with RemoteGraph |
| 6-3 Double Texting | Handling concurrent user messages |
| 6-4 Assistant | Managing Assistants in deployment environments |
| Type | Description |
|---|---|
| Course pages | Notebook-derived pages with complete code examples, useful for hands-on practice |
| Explained pages | Deep explanations for each lesson, covering concepts, code, and design decisions |
| Module summaries | End-of-module review pages |
| English mirror pages | English versions of the homepage, navigation pages, summaries, and explained pages |
Page counts:
| Type | Count |
|---|---|
| Original Chinese/default HTML pages | 119 |
| English mirror pages | 69 |
| Total HTML pages | 188 |
| Course lessons | 50 |
| Bilingual explained pages | 50 |
| Bilingual module summaries | 7 |
No build step or dependency installation is required:
git clone https://github.com/Tony1986111/learnlanggraph.git
cd learnlanggraph
# Option 1: open the default Chinese homepage directly
open home.html
# Option 2: run a local static server (recommended)
python3 -m http.server 8080
# Then visit http://localhost:8080/home.htmlEnglish homepage:
http://localhost:8080/en/home.html
- Static HTML + CSS + JavaScript, with no frontend framework
- Bilingual English/Chinese pages with a language switcher
- Dark/light theme support
- Responsive layouts for desktop and mobile reading
- Deployed on Vercel with global CDN delivery
learnlanggraph/
├── home.html # Default Chinese homepage
├── en/ # English mirror pages
│ ├── home.html
│ ├── langChain/
│ └── langGraph/
├── langChain/
│ ├── index.html # LangChain path navigation
│ ├── module-1/
│ ├── module-2/
│ └── module-3/
├── langGraph/
│ ├── index.html # LangGraph path navigation
│ ├── module-1/
│ ├── module-2/
│ ├── module-3/
│ ├── module-4/
│ ├── module-5/
│ └── module-6/
├── i18n.js # Site language switcher
├── nav.css # Shared navigation, theme, and language styles
├── translation_manifest.csv # English translation manifest
└── vercel.json # Deployment config
- LangChain Academy — the official course source for this project
- LangGraph documentation
- LangChain documentation
LangGraph, LangChain, AI Agent, LLM, RAG, MCP, multi-agent, human-in-the-loop, agent memory, bilingual tutorial, LangChain Academy
Suggested GitHub topics:
langgraph langchain ai-agent llm rag mcp multi-agent human-in-the-loop agent-memory bilingual-tutorial langchain-academy
Contributions are welcome:
- Content errors or unclear explanations: open an Issue with the page path, problem description, and suggested fix
- Explanation or translation improvements: fork the repo and submit a focused Pull Request
- New modules: if the official courses add new content, follow the existing directory structure for course pages, explained pages, and navigation pages
- Display fixes: broken links, mobile reading issues, theme switching, language switching, typos, and layout problems are all useful contributions
Please read CONTRIBUTING.md before contributing. Keep terminology consistent, keep code examples runnable where possible, and verify any new external links.
All learning content in this project is based on LangChain Academy courses. Thanks to the LangChain team for designing and publishing these high-quality courses for the developer community.
Original course material:
This project's code and original learning-site organization are released under the MIT License.
This project is a learning-oriented reorganization and explanation of LangChain Academy course material. Original courses, examples, brand names, and related assets belong to their respective owners.