实战项目
动手做,学得快。
每个项目对应一个核心章节,从零搭建到完整可运行。 难度循序渐进,完成全部五个项目即可构建生产级 Agent 系统。
- 第 01 章 · LLM 基础认知
流式 AI 对话接口
用 Vercel AI SDK 构建一个流式响应的聊天 API,在 Next.js App Router 中接入 OpenAI / Anthropic,前端用 useChat hook 消费流式数据。
- POST /api/chat 路由,返回 ReadableStream
- 前端 useChat 消费流式响应
- Temperature 和 Max Tokens 参数控制
- 消息历史持久化到 localStorage
入门2-4 小时前往章节开始 →Next.jsVercel AI SDKstreamTextuseChat - 第 02 章 · JavaScript / TypeScript AI 工具链
结构化数据提取器
使用 generateObject + Zod Schema 从非结构化文本中提取结构化数据,构建一个简历解析器或产品信息提取工具。
- 定义 Zod Schema 约束输出结构
- generateObject 调用 LLM 并强制类型化输出
- 错误处理与 fallback 策略
- 批量处理多条输入的并发优化
入门3-5 小时前往章节开始 →Vercel AI SDKgenerateObjectZodTypeScript - 第 03 章 · Agent 核心概念
自主搜索 Agent
基于 Vercel AI SDK 的 maxSteps 构建一个能自主搜索网页、提取信息、汇总回答的 Agent,实现完整的 ReAct 循环。
- 定义 search / fetch / summarize 工具集
- maxSteps 控制最大循环次数
- 工具调用链路的日志可视化
- 流式输出中间思考过程
进阶1-2 天前往章节开始 →Vercel AI SDKTool UsemaxStepsReAct - 第 04 章 · Agent 框架实战
客服 Agent 系统
用 LangGraph.js 构建有状态的客服 Agent:意图识别 → 路由分发 → 专业子 Agent 处理 → 结果汇总,接入产品知识库。
- StateGraph 定义意图分类节点
- 条件边路由到专业 Agent
- 持久化 Checkpoint 保存对话状态
- 接入向量知识库检索
实战3-5 天前往章节开始 →LangGraph.jsStateGraphCheckpointRAG - 第 05 章 · Multi-Agent 系统设计
代码审查 Multi-Agent即将上线
构建一个多 Agent 协作的代码审查系统:安全审查 Agent + 性能审查 Agent + 可维护性审查 Agent 并行执行,Orchestrator 汇总报告。
- Orchestrator 分解任务并并行调度
- 三个专业 Worker Agent 独立审查
- Langfuse 追踪每条执行链路
- 自动化评估打分与报告生成
实战5-7 天LangGraph.jsMulti-AgentLangfuseEvals