副标题:Datawhale 出品的「3+1 阶段」Vibe Coding 教程:不写玩具 Demo,从找需求 → 做原型 → 全栈上线 → Claude Code / Agent 工程化,一条路走到底
1. 30 秒介绍
Easy-Vibe 是 Datawhale 开源的一份 AI 编程教程,核心理念是 Vibe Coding——用自然语言编程:想做一个记账工具、带微信登录的预约系统,直接说出来,然后把它变成真能上线的产品。它面向零基础、产品经理 / 创业者、学生、初中级到高级开发者,用 3+1 阶段渐进式路径(新手入门 → 全栈开发 → 高级 AI 原生开发 → 附录知识体系)串起 100+ 篇文章,覆盖 Stage 2 / Stage 3 与附录共 10 种语言,并对 AI Agent 友好(仓库内置 llms.txt / CLAUDE.md)。
2. 主要内容
模块总览
| 阶段 / 模块 | 规模 | 内容概要 |
|---|---|---|
Stage 1 新手入门与产品原型(stage-0/ + stage-1/) |
主线 7 讲 + 附录 4 篇 | 贪吃蛇初体验 → AI IDE(Cursor / Claude / Trae)→ 找创意 → 做产品原型 → 接入文本/图像/视频 AI → 完整项目实战;附产品思维、常见错误排查、B 端/C 端场景参考 |
Stage 2 初中级开发(stage-2/) |
前端 8 + 后端 6 + 大作业 2 + AI 1 | 全栈闭环:Figma/MasterGo、UI 设计与组件库、设计转代码;Git、Supabase、后端 API、Zeabur 部署、CLI 工具、Stripe 支付;SaaS 全栈实战 |
Stage 3 高级开发(stage-3/) |
核心技能 10 + 跨平台 13 + AI 进阶 2 | Claude Code 全家桶(MCP / Skills / Agent Teams / Superpowers / Spec Coding / Agent SDK);微信小程序、Android、iOS、PWA、浏览器插件、Electron、NFT、VS Code 插件、Qt 工业 HMI;RAG 与 LangGraph 高级 RAG |
附录知识体系(appendix/) |
9 大领域 · 80+ 交互式专题 | 计算机基础、开发工具、浏览器与前端、服务器与后端、数据、架构与系统设计、基础设施与运维、人工智能、工程卓越 |
亮点模块
① Stage 3 · Claude Code 核心技能(AI 原生工程)
这是全仓库最「Agent 味」的部分,10 篇文章从基础到生产:Claude Code 入门、MCP 指南、Skills 指南、Agent Teams、长任务处理、Superpowers 工程化开发、从 Vibe Coding 到 Spec Coding、Claude Agent SDK 等。
② Stage 3 · 跨平台开发(13 个真实项目)
不是概念介绍,而是逐个项目交付:微信小程序(含后端)、Android、iOS、PWA 本地应用、浏览器 AI 插件、Electron 语音转文字、NFT 铸造、VS Code 插件、Qt 工业 HMI 等,一条「写一次、多端发布」的实战线。
③ 附录知识体系(9 大领域 · 80+ 交互式专题)
用动画和可视化组件讲原理,例如「从晶体管到 CPU」「RAG 数据流点击式演示」「Git 终端原理可视化」,把计算机基础到 AI 前沿讲得直观。适合当作长期查阅的知识库。
④ Stage 1 · 从想法到可展示原型
针对零基础 / 产品经理:先拿真实问题(学习路线图 → 找创意 → 用户需求访谈)再动手,最终产出一个能拿给用户或同事看的 AI 产品原型。
适合 / 不适合
零基础、产品经理、创业者:Stage 1 先做出第一个项目建立信心
初级开发者 / 独立开发者:Stage 2 补齐前端、数据库、部署、支付的全栈闭环
想深入 Claude Code / Agent 工作流的开发者:Stage 3 的 MCP、Skills、Agent Teams、Spec Coding 是当前少见的中文系统整理
想边做边查基础的人:附录 9 大领域可随时回查
想找「纯算法 / 模型训练 / 论文复现」的人(本仓库偏应用与工程落地)
只想读不想动手的人——教程核心是「shipping real products」,必须跟着敲
3. 快速上手与链接
仓库地址:https://github.com/datawhalechina/easy-vibe
本地运行:
现代做法(在 VS Code / Cursor / Trae 等 AI IDE 对话框里直接说):
Please help me run this project locally.
传统做法:
npm install
npm run dev
# 打开 http://localhost:3000
模块直达:
- Stage 1 学习路线图:How to Learn This Course | Easy-Vibe Tutorial
- Stage 2 全栈开发:Junior Developer | Easy-Vibe Tutorial
- Stage 3 高级开发:https://datawhalechina.github.io/easy-vibe/en/stage-3/
- 附录知识体系:Appendix | Easy-Vibe Tutorial
- AI Agent 导航文件:仓库根目录
llms.txt(给 Agent 读)、CLAUDE.md(Claude Code 专用)
作者 / 协议:Datawhale 社区出品,项目负责人 Sanbu;采用 CC BY-NC-SA 4.0(署名-非商业性使用-相同方式共享)协议。