实战项目

动手做,学得快。

每个项目对应一个核心章节,从零搭建到完整可运行。 难度循序渐进,完成全部五个项目即可构建生产级 Agent 系统。

  1. 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
    前往章节开始 →
  2. 02 章 · JavaScript / TypeScript AI 工具链

    结构化数据提取器

    使用 generateObject + Zod Schema 从非结构化文本中提取结构化数据,构建一个简历解析器或产品信息提取工具。

    • 定义 Zod Schema 约束输出结构
    • generateObject 调用 LLM 并强制类型化输出
    • 错误处理与 fallback 策略
    • 批量处理多条输入的并发优化
    入门3-5 小时
    Vercel AI SDKgenerateObjectZodTypeScript
    前往章节开始 →
  3. 03 章 · Agent 核心概念

    自主搜索 Agent

    基于 Vercel AI SDK 的 maxSteps 构建一个能自主搜索网页、提取信息、汇总回答的 Agent,实现完整的 ReAct 循环。

    • 定义 search / fetch / summarize 工具集
    • maxSteps 控制最大循环次数
    • 工具调用链路的日志可视化
    • 流式输出中间思考过程
    进阶1-2 天
    Vercel AI SDKTool UsemaxStepsReAct
    前往章节开始 →
  4. 04 章 · Agent 框架实战

    客服 Agent 系统

    用 LangGraph.js 构建有状态的客服 Agent:意图识别 → 路由分发 → 专业子 Agent 处理 → 结果汇总,接入产品知识库。

    • StateGraph 定义意图分类节点
    • 条件边路由到专业 Agent
    • 持久化 Checkpoint 保存对话状态
    • 接入向量知识库检索
    实战3-5 天
    LangGraph.jsStateGraphCheckpointRAG
    前往章节开始 →
  5. 05 章 · Multi-Agent 系统设计

    代码审查 Multi-Agent即将上线

    构建一个多 Agent 协作的代码审查系统:安全审查 Agent + 性能审查 Agent + 可维护性审查 Agent 并行执行,Orchestrator 汇总报告。

    • Orchestrator 分解任务并并行调度
    • 三个专业 Worker Agent 独立审查
    • Langfuse 追踪每条执行链路
    • 自动化评估打分与报告生成
    实战5-7 天
    LangGraph.jsMulti-AgentLangfuseEvals