Course Map
练习进度 0/55
💡 Stage 0: 觉醒 (5)
Vibe Coding 是什么从 Coder 到 Commander — 你的角色变了Vibe Coding vs Spec Coding — 两种范式,两种活法Vibe Coding 工具全景图 — 选对工具少走弯路你的第一个 Vibe 项目 — 从需求到指令🧘 Stage 1: 心法 (9)
MVP 思维 — 别做完美产品,做能用的产品需求拆解 — 从模糊想法到 AI 能执行的任务PRD 驱动开发 — 写清楚再动手代码 Prompt 五要素 — 让 AI 写出能用的代码Prompt 迭代与追问 — 第一次一定不够好Vibe Coding 思维模型用 Cowork 找设计参考 + 生成 design.mdStudio用 AI 生图给 PPT 配图 — 同一套风格,不再东拼西凑StudioAI 生图 + 数据图表给 PDF 配图Studio🛠️ Stage 2: 工具精通 (12)
Cursor 入门 — Vibe Coding 的代名词Cursor 进阶 — 多文件编辑和 Agent 模式Claude Code 入门 — 终端里的 AI 程序员MCP 入门 — 让 AI 连接整个世界Claude Code Skills 和 Agent Teams — AI 能力复用Browser 工具 — 零安装的 AI 编程体验GitHub Copilot 和 Windsurf — IDE 选择题工具选型实战 — 没有绝对的最好,只有最适合用 Cowork 给你的科普 PPT 批量生成配图Studio用 ElevenLabs 给科普 PPT 配中英双语旁白Studio一稿多发实战 — 把 PPT 内容改成 3 个平台版本Studio用 Suno 生成 60s 科普视频 BGMStudio🏗️ Stage 3: Context Engineering (9)
Context Engineering 入门 — 让 AI 不再"失忆"CLAUDE.md 设计实战 — 让 AI 秒懂你的项目Cursor Project Rules 设计实战项目结构与 AI — 让你的项目 AI 友好Token 经济学 — 省钱和效率的平衡文档驱动开发 — AI 时代的新范式让 AI 把一段乱文本变成 JSON 表格Studio用 Claude 设计每天运行的 JSON 提取任务StudioObsidian + AI 第二大脑:设计一套可审核的笔记整理流程Studio🚀 Stage 4: 全栈实战 (13)
环境搭建 — 让 AI 帮你配环境AI 前端开发 — 从截图到 React 代码AI 后端开发 — 从 API 设计到实现数据库设计与 AI — Schema 到迁移安全与认证 — AI 生成的代码怎么不掉坑调试 AI 代码 — 读错误日志和修复 BugGit 工作流 — AI 怎么写 Commit 和 PR部署到上线 — AI 加速从开发到生产Code Review 和质量保证 — AI 写的代码咋审测试 TDD — 先写测试再让 AI 实现用 AI 写一个最小 Admin CMS(产品增删改查)Studio给 Landing Page 加联系表单 + 数据收集Studio用 Cowork 搭一个每日金融新闻聚合 AgentStudio Learning Guide
Agent ≠ Chatbot:它是一个会自己做事的小程序
Chatbot 是被动的——你问它答,你不问它不动。Agent 是主动的——你给它一个目标(比如"每天抓 10 条金融新闻并总结"),它自己规划步骤、调工具、把结果交付出来。
内容聚合类 Agent 几乎都是同一个三段式架构:
第一段:抓数据(Fetch)
Agent 要从某个数据源拿到原始内容。金融新闻的常见来源:
- RSS feed——最稳定、最简单。雅虎财经、彭博、华尔街日报、Reuters 财经板块都开放 RSS。一行代码拿全文
- 公开 API——Alpha Vantage、Finnhub、CoinGecko 等都有免费 tier
- 网页爬虫——只在前两个都没有时才用。容易被封、不稳定
第二段:AI 总结(Summarize)
抓到的原始文章可能是 5000 字的长文,但你要的是"标题 + 1 句要点"。这一步给 AI 做:
你是金融编辑。下面是一篇新闻原文。
请输出:
- 标题(不超过 25 字,保留原意但更简洁)
- 一句要点(不超过 60 字,讲清楚"发生了什么、谁受影响")
原文:
{article_text}
AI 一篇文章 5 秒搞定,10 条新闻也就 1 分钟。
第三段:输出 JSON(Output)
总结完的内容要给前端网站读。最简洁的格式是 JSON:
{
"date": "2026-05-13",
"items": [
{
"title": "美联储 5 月议息维持利率不变",
"summary": "鲍威尔表示通胀仍有粘性,年内降息次数预期下调。",
"source": "Reuters",
"url": "https://..."
}
]
}
JSON 写到 data/daily-news.json,前端 fetch 一下就能用。
为什么三段必须分开
很多人第一反应是写一个"大函数"把三件事都干了——抓、总结、写文件全揉一起。这样写不可调试:跑挂了你不知道是抓挂了还是总结挂了。
分三段的好处:
- 抓挂了——RSS 网址变了,单测第一段
- 总结挂了——prompt 翻车,单测第二段(喂同一篇原文)
- 输出挂了——JSON 格式有问题,单测第三段
Vibe Workspace
Live build context
Agent 三段式:抓 → 总结 → 输出
所有内容聚合 Agent 都是这三段——讲清楚每段做什么、为什么这样切
自动保存在此设备
理解 Agent 的三段式架构——抓数据 / AI 总结 / 输出 JSON写出一条能让 Cowork 一次性生成 Agent 全部代码的 prompt学会本地手动跑一次 Agent 验证结果(先跑通再上自动化)