之前把 Easy-Vibe 收录进了设计灵感收藏夹（一篇偏”网站设计拆解”的报告）。今天这篇不一样——我想把网站里面真正的好东西挖出来，仔细讲一讲：它到底分享了什么、哪些资源值得收藏、按照什么顺序学最省力。
一、先说结论：这为什么是一个”宝藏站”
Easy-Vibe 是 Datawhale 出品的开源 AI 编程（Vibe Coding）教程站，核心主张一句话：
编程语言正在变成自然语言，会说话，你就能做产品。
它不是那种”讲一堆概念然后让你自己去悟”的教程，而是一条从零基础到全栈开发的完整成长路径——分成四个大阶段，每阶段都是”跟着做就能做出东西”的项目制训练。网站支持 10 种语言切换，简体中文、English、日本語、繁體中文、한국어、Español、Français、Deutsch、العربية、Tiếng Việt，一个开源项目做到这个国际化程度，本身就是”好东西”。
我花时间把主要章节都翻了一遍，下面按”地图怎么走 → 每站藏着什么好东西 → 有哪些理念值得带走”的顺序，一次讲清楚。
二、整张学习地图：四个阶段走完”从会用 AI 到会做产品”
网站把学习路径组织成一条非常清晰的”升级打怪”路线：
| 阶段 | 定位 | 学完能做什么 |
|---|---|---|
| Stage 1 · 零基础入门 | “没有技术背景？正好。” | 用对话做出能跑、能演示的产品原型 |
| Stage 2 · 初中级开发 | “一个人，就是一支团队。” | 前端 + 数据库 + 部署 + 支付，全栈闭环 |
| Stage 3 · 高级开发 | “产品和结果，我全都要。” | 跨平台应用、AI 智能体团队、个人品牌 |
| Appendix · 附录 | “让代码，活灵活现。” | 49 篇知识库，随查随用 |
入口处还配了一张身份对照表——学生、职场人、产品经理、创业者、老师、医生……每个人都能直接找到”这门课能帮你什么”，10 秒定位自己的入口，这是很多教程都没有的产品思维。
三、Stage 1 · 零基础入门：两小时做出第一个”AI 原生应用”
这一阶段完全面向”没写过一行代码”的人，最大的宝藏是手把手的实战。
1. 60 秒生成贪吃蛇：见识”网页就能编程”的新模式
课程先用一个实验网页 z.ai（智谱 AI 的 GLM 平台）演示：不用装环境、不用配编辑器，打开浏览器、用自然语言描述需求，AI 自动生成代码并实时预览。
课程里给出的示例提示词就是一个”如何跟 AI 说人话”的绝佳范本：
帮我做一个贪吃蛇游戏：
1. 用方向键控制蛇的移动
2. 吃到食物后蛇会变长，分数增加
3. 撞到墙壁或自己的身体就游戏结束
4. 要有开始和重新开始按钮
5. 界面要简洁好看然后课程带着你一步步迭代：让蛇吃单词而不是豆子 → 吃满 8 个单词让 LLM 根据单词写一首诗 → 诗完成后自动生成一幅画。三句话，把”对话式编程”的威力演示得明明白白。
2. 九款在线 AI 编程平台实测对比（重点收藏）
这是 Stage 1 里含金量非常高的一张表——课程把主流”网页就能编程”的平台挨个做了对比：
| 工具 | 出品方 | 一句话特点 |
|---|---|---|
| Kimi Code | 月之暗面 | 终端 CLI + VS Code 扩展，编程专用模型 Kimi K2.7 Code，还支持接入 Claude Code |
| Google AI Studio | Gemini 模型，适合快速原型开发 | |
| z.ai | 智谱 AI | GLM 模型，全栈开发、幻灯片、海报一体 |
| Figma Make | Figma | 与设计工具深度整合，设计师友好 |
| Coze | 字节跳动 | 零代码可视化搭建，可发布到飞书、微信 |
| v0.dev | Vercel | 输入描述即生成可运行的 React 组件 |
| Bolt.new | StackBlitz | 直接生成并部署完整 Web 应用 |
| Lovable | Lovable | 生成高质量 React 应用，支持 GitHub 集成一键部署 |
| Replit Agent | Replit | 在线 IDE 集成 AI 助手，支持实时协作 |
对国内用户来说，Kimi Code、z.ai、Coze 都是可以零门槛直接上手的选项；想做国际化的可以看 Google AI Studio 和 v0.dev。
3. 八个全网精选案例：AI 真的能做出复杂游戏
课程还精选了 8 个真实案例，每一个都让人看完立刻想动手：
- WotAI Games：一个下午用 Claude Code 复刻 10 款经典街机游戏（吃豆人、俄罗斯方块、太空侵略者……），完全不用游戏引擎
- Blooming Garden：日本一位完全不懂编程的开发者，2 小时纯对话做出 2048 风格「植物花园」游戏，粒子动画、排行榜、音效全都有
- Planet Jumper：设计师用 AI 做出可在线联机的 3D 多人平台跳跃游戏
- mini-browser-games：一位中文开发者用 Vibe Coding 做了 100 款零依赖的单 HTML 浏览器游戏，MIT 协议开源
- CraftMine：6,820 行单文件的网页版《我的世界》复刻，46 种方块、36 种生物，甚至支持 P2P 多人联机
- AI 版超级马里奥：AI 实时生成无限关卡，实测能连续玩 45 分钟
- Kimi K3 3D 游戏：一个提示词做出可玩的第一人称 3D 游戏，两轮对话修两个 bug，全程约 2 美元
- K399 游戏平台：月之暗面官方平台，几十款 AI 游戏全部由 K3 模型制作，点开即玩
4. “找到好点子”：先想清楚做什么，再动手写代码
Stage 1 里还有一节非常”反套路”的内容——不是先教写代码，而是先教找需求。它讲了一个独立开发程序员小明的故事：花一年做了个功能很全的健身 APP，结果 7 日留存只有 5%，亏了 20 万。
结论是：方向错了，越深入错得越多。 这节提供了完整的方法论——什么样的需求用户愿意买单、怎么从普通想法里挖出商业机会、怎么用 AI 把想法打磨成可落地的产品方案。对于想”做点什么”但还没想好做什么的人来说，这部分比任何工具教程都值钱。
四、Stage 2 · 初中级开发：一个人就是一支团队
这个阶段开始进入”真正的全栈”，覆盖前端设计 → 设计转代码 → 数据库 → 部署 → 支付 → AI 能力集成的完整闭环。
1. 素材生成 Agent：Lovart + Nanobanana
从 Lovart 和 Nanobanana 出发，批量生成高质量设计素材，并动手构建一个能”意图识别”的绘图 Agent——这是很多人想做的”素材流水线”。
2. Figma 与 MasterGo：设计工具的前世今生
课程把前端设计工具讲得很透：从 Photoshop 时代的手动”切图、量尺寸、抠标注”，到 Sketch 的组件化，再到 Figma 把协作搬上云端的革命。还梳理了设计稿转代码的三种路径：
- 路径一：截图给多模态大模型，直接还原代码（最快，适合快速验证）
- 路径二：平台自带能力/插件导出（还原度高、可编辑）
- 路径三：平台 + MCP 能力导出（自动化程度最高）
课程甚至讲到了 Figma 2025 年后的 AI 全家桶（Make 一句话生成界面、FigJam 白板协作、Buzz 品牌资产批量生产、Site 一键发布成网页）——设计工具的 AI 化，比想象中快得多。
3. Supabase：数据库 + 用户系统一起搞定
课程用 Supabase 这条主线，带你理解”数据”与”数据库”，然后直接实现注册/登录/权限，再延伸到 realtime、storage、edge function，甚至加上 Google 与 GitHub 登录。产出一套可复用的后端代码模板，后续项目直接套用。
4. 部署上线：四款平台对比（收藏）
“把网站发到网上”这节用大白话讲清楚了部署到底是什么，还对比了主流平台：
| 平台 | 特点 | 免费额度 |
|---|---|---|
| 腾讯云 CloudBase | 国内访问快，微信生态整合 | 有免费额度（需公众号兑换码，试用 6 个月） |
| Vercel | 前端框架支持好，GitHub 集成紧密 | 有免费额度 |
| Netlify | 功能全面，表单/身份验证 | 有免费额度 |
| Zeabur | 多语言多服务模板，配置灵活 | 每月约 5 美元免费额度 |
5. Dify：从”聊天机器人”到”AI 智能体 + 工作流”
这是 Stage 2 里我最喜欢的一节。它先讲清楚一个关键洞察：聊天机器人本身并不能做事——它能回答”怎么查订单”，却不能真的去数据库查。要让 AI 变成”数字员工”，需要三样东西：专属知识、工具调用、结构化执行。
然后引出 RAG（检索增强生成） 的概念：企业有成千上万页文档，模型怎么在每轮对话里找到最相关的内容？答案是把检索到的片段”注入”大模型的输入，让它有据可依、减少幻觉。最后用 Dify 动手搭建一个基于知识库的问答机器人。
这一节还附了一张低代码 AI 工作流平台对比表：
| 平台 | 特点 | 适用场景 |
|---|---|---|
| Dify | 开源、支持 RAG、LLM 编排、中文友好 | 企业知识库问答、定制化 Agent |
| Coze（字节） | 国内可用、集成抖音/飞书生态 | 社交机器人、小程序集成 |
| n8n | 通用自动化、强调 API 编排 | 跨系统数据同步、AI + SaaS 自动化 |
| 百度千帆 / 阿里百炼 / 腾讯混元 | 大厂云原生方案 | 企业级部署、合规要求高 |
6. 大作业：两个能写进作品集的完整项目
Stage 2 末尾安排了两个大作业，目标是”把零件装成一个能跑、能演示、能上线的产品”：
- 大作业 1 · 文案生成 SaaS：登录 → 生成 → 数据库 → Stripe 支付 → 管理后台，跑通现代 SaaS 最常见的主链路
- 大作业 2 · 在线考试系统：角色权限、题库建模、考试流程、批改统计，更像真实的业务系统
每个大作业都要求三个交付物：可运行的项目仓库 + 可访问的演示链接 + README 和演示视频——这正是求职作品集的完整模板。另外还有 6 个扩展选题（Web 落地页、类 Dify 平台、AI 旅行规划、Spring Boot 推荐系统、微服务、Go 数据分析），按技术方向自由选。
五、Stage 3 · 高级开发：Claude Code、MCP 与 Agent 团队
到了这个阶段，教程开始深入工程化与 AI 智能体协作，全是进阶玩家最需要的东西：
1. Claude Code 系列
- Claude Code 快速上手核心指南：安装配置、基础操作、实用技巧
- MCP 与 Claude Code 完全指南：用 Model Context Protocol 扩展 AI 编程工具的能力边界
- Claude Code Skills 完全指南：把专业知识、工作流程、最佳实践打包成可复用技能包
- 如何让 Coding Tools 长时间工作：用循环脚本和 Ralph 插件管理长时间任务，让 Claude Code 过夜稳定跑完工作
- Claude Agent Teams 完全指南：让多个 AI 实例像真正的开发团队一样协同工作
- Claude Code Superpowers：用框架让 AI 写出工程级代码
- Claude Code 工作流最佳实践
2. 跨平台开发
微信小程序（含后端）、Android、iOS、PWA、浏览器 AI 助手插件、Electron 桌面程序（语音转文字）、VS Code 插件、Qt 工业级桌面应用——几乎覆盖了”让 AI 产品随处可见”的所有形态。连 NFT 智能合约铸造都有 10 分钟上手版。
3. 个人品牌
“如何构建属于自己的个人网页与学术博客”——这节对正在做 personal-site 的我们来说，简直是量身定做的进阶参考。
4. 高级 AI 能力
RAG 原理、中高级 RAG 与 LangGraph 工作流编排，为想深入 AI 原生应用的人留了足够的上升空间。
六、Appendix 附录：49 篇知识库，随查随用的”活字典”
附录是我认为性价比最高、最容易被忽略的部分——9 大主题、49 篇文章：
| 主题 | 篇数 | 覆盖内容 |
|---|---|---|
| 💻 计算机基础 | 7 | Vibe Coding 全栈全景、CPU、操作系统、数据结构、算法思维、编程语言图谱、网络基础 |
| 🔧 开发工具 | 6 | Git 版本控制等 |
| 🌍 浏览器与前端 | 6 | 前端框架、JavaScript 深入 |
| ⚙️ 服务端与后端 | 7 | API 设计、后端语言、分层架构 |
| 📊 数据 | 4 | 数据库原理等 |
| 🏗️ 架构设计 | 4 | — |
| ☁️ 基础设施 | 4 | — |
| 🤖 人工智能 | 6 | AI 进化史、提示词工程、LLM 原理、Agent 智能体 |
| ✨ 工程素养 | 5 | — |
学 Vibe Coding 遇到”前端是什么""提示词怎么写”这种概念问题时，随时回附录查，比到处搜资料高效得多。尤其是”提示词工程”和”AI 进化史”这两篇，强烈推荐先读。
七、不只是教程：几个值得带走的理念
1. “提问的艺术”是 AI 时代的必备技能
教程专门用一节讲怎么提问，这是我认为全站最有普适价值的内容：
现实很少有完整文档，更多时候你面对的是不清晰的需求、半成品代码、零散的错误信息。你越能提供关键信息、越能约束输出格式，答案越可用。
还给出了非常实用的截图 vs 复制粘贴对比：
| 方式 | 适用场景 | 关键要求 |
|---|---|---|
| 复制粘贴 | 报错堆栈、日志、代码、配置、API 返回 | 尽量完整，不要只截一行关键字 |
| 截图 | UI 布局、交互异常、找不到按钮 | 截全屏 + 标注重点区域 + 配一句文字说明 |
（前提：AI 要支持图片输入——Claude、GPT-4o、Gemini、通义千问、文心一言等。）
2. 完成比完美更重要
每一章开头都有一句暖心的提醒：“完成比完美更重要 🐣“。还解释了为什么要项目制训练——“在相对安全的环境里，提前给你一次模拟社会毒打”，训练你在需求模糊、边界变化的情况下解决问题。
3. 共情式设计：把”想放弃”写进标题
附录和 FAQ 里直接出现了这样的章节标题：
- “坚持了好久还是搞不定，我想放弃了”
- “我觉得教程有的设计不合理”
把学习者的情绪卡点直接写成标题，先安抚再给路——这种”把人当人”的教程设计，比冷冰冰的文档高级太多。
4. 用户故事是最好的社会证明
网站首页放了一个真实故事：《放弃月入过万，他在农村小学带孩子们”用 AI 赶苍蝇”》。乡村老师小浩带着三年级的孩子，用对话和 AI”聊”出了一个触屏防误触软件，解决电子屏被苍蝇骚扰的课堂痛点。看完你会明白——AI 编程的门槛，真的低到任何人都可以参与创造。
八、怎么用这份指南：给 Galvin 的行动建议
结合我们在个人网站上正在做的事，Easy-Vibe 里至少有这几样可以立刻用起来：
- 先逛附录：重点读「提示词工程」「AI 进化史」「Vibe Coding 全栈开发全景图」三篇，建立概念地图
- 上手一个在线平台：从 z.ai 或 Kimi Code 开始，照着 Stage 1 用 60 秒生成一个贪吃蛇，感受”对话即编程”
- 把”提问的艺术”练成习惯：以后让 CodeBuddy 干活时，报错尽量完整复制粘贴、UI 问题截图加标注——效率会明显提升
- 参考它的学习路径设计：我们网站的文章/教程编排，也可以学它按”关卡/阶段”组织，每篇结尾给”下一关”入口
- 作品集思维：如果想做自己的 AI 产品，照着 Stage 2 大作业的三个交付物标准（仓库 + 演示链接 + README/视频）去完成，就是一份能打的作品集
结语
Easy-Vibe 最打动我的不是某个具体功能，而是它把一个宏大的命题——“普通人也能做产品”——拆成了一条任何人今天就能迈出第一步的路径。从 60 秒的贪吃蛇，到 100 款浏览器游戏，再到乡村课堂里的”触屏锁”，AI 编程的门槛正在以肉眼可见的速度消失。
正如网站首页那句话：
曾经最难的是怎么写代码，现在最难的是你要做什么。
剩下的问题，就交给你的想象力了。🚀
参考：https://datawhalechina.github.io/easy-vibe/zh-cn/（CC BY-NC-SA 4.0 开源课程）