-
Notifications
You must be signed in to change notification settings - Fork 34
Description
你是否已经阅读并同意《Datawhale开源项目指南》?
- 我已阅读并同意《Datawhale开源项目指南》
你是否已经阅读并同意《Datawhale开源项目行为准则》?
- 我已阅读并同意《Datawhale开源项目行为准则》
项目简介
Vibe Vibe: From Scratch to Full Stack——人人都能学会的 AI 编程(Vibe Coding)指南
1. 基本信息
| 项目 | 内容 |
|---|---|
| 项目名称 | Vibe Coding 全栈实战教程 |
| 英文名称 | Vibe Vibe: From Scratch to Full Stack |
| 项目副标题 | 写给所有人的 AI 编程入门与实战 |
| 项目地址 | https://vc.nfeyre.top/ (暂定,后续会转移到datawhale) |
| GitHub | (待创建 Datawhale 仓库) |
2. 一句话介绍
面向零编程基础学习者的 AI 辅助编程系统化教程,从「我有一个想法」到「我做出了一个产品」,让人人都能成为 Builder。
3. 项目定位
本教程是国内首个系统化的 Vibe Coding 开源教程,分为基础篇与进阶篇两大板块:
| 板块 | 名称 | 定位 | 适合人群 |
|---|---|---|---|
| 📘 基础篇 | Vibe Coding 启示录 | AI 编程入门 + 心法 + 第一个项目 | 完全零基础、用过 ChatGPT 但没做过项目 |
| 📗 进阶篇 | Vibe Coding 全栈实战 | 全栈技术栈 + 工程化 + 生产级部署 | 想深入学习、有一定编程基础想转型 |
4. 学习产出
完成本教程后,学习者将获得:
| 阶段 | 具体产出 |
|---|---|
| 基础篇完成 | ✅ 掌握 Vibe Coding 核心心法 ✅ 能用自然语言"指挥" AI 写代码 ✅ 独立完成 1-2 个个人工具项目 ✅ 具备版本管理和部署上线能力 |
| 进阶篇完成 | ✅ 掌握现代全栈技术栈(Next.js/TS/Prisma) ✅ 理解前后端分离架构 ✅ 能独立开发带用户系统的完整应用 ✅ 具备生产级部署和运维能力 ✅ 建立工程化思维和协作规范 |
5. 核心理念
践行 OpenAI 联合创始人 Andrej Karpathy 提出的 Vibe Coding 理念:
"There's a new kind of coding I call vibe coding... you fully give in to the vibes, embrace exponentials, and forget that the code even exists."
"完全沉浸于编程的'氛围'中,忘记代码的存在。"
从 Coder 到 Commander:让编程从"写代码"转变为"对话式创作",开发者从"逐行编码者"升级为"产品思维指挥官"。
立项理由
1. 时代背景:Vibe Coding 已成为全球趋势
Vibe Coding(氛围编程) 由OpenAI联合创始人Andrej Karpathy于2025年2月正式提出,被Collins Dictionary评选为2025年度词汇。该理念主张通过自然语言与大语言模型交互,由AI生成和迭代代码,开发者从"逐行编码者"转变为"产品思维引导者"。
关键数据支撑:
- Y Combinator 2025年冬季批次中,25%的创业公司代码库95%由AI生成
- Cursor编辑器已吸引全球超过2600万开发者使用
- 据《华尔街日报》2025年7月报道,Vibe Coding已开始进入商业化应用
2. 市场需求:学习资源碎片化严重
目前国内Vibe Coding学习资源存在以下问题:
| 问题类型 | 具体表现 |
|---|---|
| 碎片化 | 教程多为博客文章、单篇视频,缺乏系统性 |
| 门槛高 | 大多数教程假设读者有编程基础 |
| 工具单一 | 集中于Cursor单一工具,缺乏全景视野 |
| 理论偏重 | 介绍概念多,实战项目少 |
| 缺乏进阶 | 缺少从入门到精通的完整路径 |
3. Datawhale定位契合
本项目高度契合Datawhale使命:"for the learner,和学习者一起成长":
- 降低门槛:让零基础学习者也能用AI创造软件
- 开源共享:秉承开源精神,内容完全免费
- 实战导向:项目式学习,学完即有作品产出
- 社区协作:适合组队学习模式
项目受众
1. 核心受众
| 受众群体 | 画像描述 | 学习动机 |
|---|---|---|
| 编程零基础者 | 产品经理、设计师、运营人员等非技术背景人群 | 希望独立开发工具/验证想法 |
| 大学生 | 文科/理科等全部专业的本科生、研究生 | 提升动手实践能力、交叉学科探索 |
| 创业者 | 有产品想法但缺乏技术能力、或者想快速验证idea | 快速构建MVP原型 |
| 传统程序员 | 想要提升AI编程效率的在职开发者 | 学习新范式,提升生产力 |
| 职场人士 | 想使用AI帮助提高工作效率 | 提高日常工作效率,了解AI的能力边界 |
2. 预估用户规模
参考Datawhale类似教程数据:
- 预计首轮组队学习参与人数:1000-5000人?
- 预计GitHub Star数(3个月):5000-10000
- 预计长期受益学习者:50000+
项目亮点
1. 类似项目调研
经充分调研,目前市面上已有以下相关项目:
国内项目
| 项目名称 | 来源 | 特点 | 不足 |
|---|---|---|---|
| zhanglunet/vibe-coding | GitHub | 中文Vibe Coding指南,介绍概念和流程 | 偏理论,实战项目少,非零基础友好 |
| 火山引擎-Vibe Coding实践 | 知乎/CSDN | 详细的概念介绍和工具对比 | 单篇文章,非系统化教程 |
| Cursor保姆级教程(多篇) | CSDN/知乎 | 工具使用详解 | 聚焦单一工具,缺乏全栈视角 |
国际项目
| 项目名称 | 来源 | 特点 | 不足 |
|---|---|---|---|
| Google Cloud Vibe Coding Guide | Google Cloud | 权威、系统的官方指南 | 英文为主,聚焦Google工具生态 |
| Vibe Coding Wikipedia | Wikipedia | 概念定义权威 | 百科性质,非教程 |
2. 本项目差异化优势
与上述项目相比,Vibe Coding 全栈实战教程具有以下独特优势:
| 差异化维度 | 本项目特色 |
|---|---|
| 真正零基础 | 从"什么是代码"讲起,无需任何编程经验 |
| 全栈实战 | 涵盖前端、后端、数据库、部署全流程 |
| 多工具覆盖 | Cursor/Windsurf/Claude Code/Replit等主流工具全景 |
| 项目驱动 | 每章一个完整可运行项目,学完即有作品 |
| 中国本土化 | 针对国内网络环境、支付方式等进行适配 |
| 组队学习适配 | 章节设计匹配Datawhale 2周学习周期 |
| 持续更新 | 跟进AI编程工具快速迭代,保持内容新鲜度 |
3. 创新点总结
- 首个Datawhale零基础Vibe Coding教程:填补生态空白
- "概念+工具+实战"三位一体:理论与实践深度结合
- 适配中国开发者生态:解决工具访问、支付等本土化问题
- 开源社区共建模式:持续迭代,吸引贡献者
项目规划
5.1 内容规划(目录)
本教程分为基础篇和进阶篇两大板块,采用渐进式学习路径设计:
📘 基础篇:Vibe Coding 启示录(写给所有人的 AI 编程入门)
基础篇目录
│
├── 写在最前面:这份教程是写给谁的
│ ├── 写给不同的你(爸妈/文科生/理工生/职场人/创业者)
│ ├── 自测清单:你应该从哪里开始?
│ └── 学完这份教程,你将获得什么
│
├── 第1章:觉醒 —— 为什么现在是编程最好的时代
│ ├── 1.1 编程已死,编程永生:从 Coder 到 Commander
│ ├── 1.2 核心概念:Vibe Coding 与 Spec Coding 详解
│ ├── 1.3 破除迷信:不懂英文、数学不好也能写代码吗?
│ ├── 1.4 工具初探:Cursor、Windsurf、Bolt.new 与 Replit 选型指南
│ └── 1.5 Hello World:你的第一个 3 分钟 AI 网页
│
├── 第2章:心法 —— 像产品经理一样思考
│ ├── 2.1 拒绝功能堆砌:为什么你的 AI 写不出复杂的 App?
│ ├── 2.2 MVP 思维:如何设计一个"能跑的最小版本"
│ ├── 2.3 灵魂三问:用户是谁?痛点在哪?为何用你?
│ └── 2.4 实战演练:拆解一个"背单词软件"的想法
│
├── 第3章:技法 —— 与 AI 对话的艺术
│ ├── 3.1 提示词工程基础:Context is King
│ ├── 3.2 用户旅程地图:把想法变成 AI 能懂的路径
│ ├── 3.3 编写第一份 PRD:让 AI 不再胡编乱造
│ └── 3.4 功能优先级 P0/P1/P2:学会对 AI 说"这个先不做"
│
├── 第4章:实战 —— 从 0 到 1 开发个人工具
│ ├── 4.1 环境准备:无需命令行的开发环境搭建
│ ├── 4.2 第一轮:生成静态页面 —— 先看"脸"
│ ├── 4.3 第二轮:注入逻辑与交互 —— 再长"脑"
│ ├── 4.4 第三轮:数据存储基础
│ └── 4.5 Debug 指南:当 AI 报错时,如何用 AI 修复 AI
│
├── 第5章:进阶 —— 真实世界的开发流程
│ ├── 5.1 版本管理:为什么我改崩了回不去?
│ ├── 5.2 部署上线:把你的网页发给全世界
│ ├── 5.3 安全意识:不要把密码告诉 AI
│ └── 5.4 局限性:Vibe Coding 搞不定的时刻
│
├── 第6章:不同人群的学习路径与资源
│ ├── 6.1 文科生/商科生路径
│ ├── 6.2 理工科学生路径
│ ├── 6.3 职场人士路径
│ ├── 6.4 推荐学习资源
│ ├── 6.5 持续学习建议
│ └── 6.6 进入进阶版的准备
│
└── 附录
├── A. 常用 Prompt 模板库
├── B. 常见错误与解决方案速查表
├── C. 术语表(中英对照)
├── D. 工具对比速查表
└── E. 项目 idea 清单
📗 进阶篇:Vibe Coding 全栈实战教程
进阶篇目录
│
├── 第0章:Bootcamp(零基础概念打底)
│ ├── 0.0 课程概念定义:术语表与课程范围
│ ├── 0.1 计算机与操作系统基础:文件/进程/端口/路径/权限
│ ├── 0.2 命令行入门:pwd/ls/cd/cat/grep/nano
│ ├── 0.3 前端三件套:HTML/CSS/JS 基础语法与作用
│ ├── 0.4 开发环境配置:Node.js、包管理器与工具链
│ ├── 0.5 JS → TS 思维转换
│ ├── 0.6 开发安全底线
│ └── 0.7 Docker 核心概念
│
├── 第1章:概念与准备(从思维到工具)
│ ├── 1.1 工具装配与最小项目验证
│ ├── 1.2 Vibe Coding 心法
│ ├── 1.3 最小上线实战与 1Panel 部署
│ ├── 1.4 AI 协作工作流实战与最佳实践
│ └── 1.5 工具链与环境
│
├── 第2章:技术选型与架构蓝图
│ ├── 2.0 技术栈全景
│ ├── 2.1 Next.js + TS + Prisma + OSS 架构全景
│ ├── 2.2 Next.js 渲染策略全景(CSR/SSR/SSG/ISR)
│ ├── 2.3 Next.js 核心概念深入
│ ├── 2.4 前后端协作:接口契约/API Route
│ ├── 2.5 架构分层详解
│ └── 2.6 拓展:Supabase 适用与取舍
│
├── 第3章:前端到后端(把页面跑起来)
│ ├── 3.1 App Router:文件路由与数据获取
│ ├── 3.2 前端构建块:组件/状态/路由/数据获取
│ ├── 3.3 Figma 集成实战与 AI 协作
│ ├── 3.4 Tailwind + shadcn/ui:统一设计体系
│ ├── 3.5 Debug 实战:断点/Network/日志
│ ├── 3.6 API Route 与服务层分离
│ ├── 3.7 可用性:错误/空态/加载骨架
│ └── 3.8 可访问性/UX 原则/i18n
│
├── 第4章:数据库与数据生命周期
│ ├── 4.1 数据建模与 ER 图
│ ├── 4.2 关系型数据库:CRUD/索引/事务
│ ├── 4.3 SQL 基础操作
│ ├── 4.4 Prisma 实战
│ └── 4.5 数据迁移与版本管理
│
├── 第5章:产品文档与沟通规范
│
├── 第6章:用户认证与权限
│ ├── 6.1 NextAuth.js 快速上手
│ ├── 6.2 认证与授权安全实践
│ ├── 6.3 API 安全防护实践
│ ├── 6.4 常见 Web 安全威胁与防护
│ └── 6.5 第三方登录集成(微信/QQ/钉钉)
│
├── 第7章:API 设计与开发规范
│ ├── 7.1 HTTP 与 API 方法/幂等/重试
│ ├── 7.2 REST 最小原则与错误返回
│ ├── 7.3 API 文档:Swagger/Postman
│ └── 7.4 API 版本管理与兼容性
│
├── 第8章:项目规则与协作
│ ├── 8.1 Git 基本流程
│ ├── 8.2 分支策略与分支保护
│ ├── 8.3 提交规范:Conventional Commits
│ ├── 8.4 .gitignore 管理
│ └── 8.5 文档与评审流程
│
├── 第9章:测试与质量
│ ├── 9.1 测试金字塔
│ ├── 9.2 测试环境与隔离
│ ├── 9.3 单元测试/集成测试:Jest
│ ├── 9.4 错误处理与日志规范
│ └── 9.5 CI 质量门禁与 GitHub Actions
│
├── 第10章:部署与运维
│ ├── 10.1 云服务/网络/域名/证书
│ ├── 10.2 1Panel 可视化部署
│ ├── 10.3 Docker Compose 编排
│ ├── 10.4 反向代理与负载均衡
│ └── 10.5 监控与日志
│
├── 第11章:发布、复盘与教学沉淀
│ ├── 11.1 语义化版本与发布流
│ ├── 11.2 GitHub Actions 部署
│ ├── 11.3 课程化产出
│ └── 11.4 复盘模板
│
└── 第12章:高级专题与优化
├── 12.1 Node 进程与事件循环
├── 12.2 SEO:SSR/Meta/站点地图
├── 12.3 Vercel AI SDK 与流式响应
├── 12.4 WebSockets 实时通信
├── 12.5 文件分片传输
├── 12.6 爬虫基础
└── 12.7 版本化与变更日志
🎯 新增板块规划
| 板块名称 | 内容描述 | 形式 |
|---|---|---|
| 「他们说」资源库 | 收集高质量的 Vibe Coding 相关博客、文章、播客、Talk 等 | Markdown 列表 + 简评 |
| Web 互动教学工具 | 面向进阶篇核心概念的可视化交互演示 | React 组件 / 独立网页 |
Web 互动教学工具覆盖概念(包括但不限于):
- 数据库概念(ER 图、SQL 查询可视化)
- 前后端交互(API 请求/响应流程动画)
- HTTP 协议(请求头、状态码交互演示)
- 渲染策略(CSR/SSR/SSG/ISR 对比演示)
- Git 工作流(分支、合并可视化)
2. 时间规划
总周期:1-2 个月(2025年12月 - 2026年1月)
| 阶段 | 时间范围 | 核心任务 | 里程碑 | 状态 |
|---|---|---|---|---|
| 初稿完成 | 已完成 | 基础篇 + 进阶篇全部章节初稿 | ✅ 初稿完成 | ✅ Done |
| Phase 1:基础篇精修 | 12月1日-12月10日 | 基础篇6章逐篇校验、内容丰富 | 基础篇定稿 | 🔄 进行中 |
| Phase 2:进阶篇核心章节精修 | 12月11日-12月20日 | 进阶篇核心章节(第0-4章、第10章)校验 | 进阶篇核心定稿 | 📋 待开始 |
| Phase 3:配套内容建设 | 12月11日-12月15日 | 「他们说」资源库 + Web互动工具开发 | 配套内容上线 | 📋 待开始 |
| 内测启动 | 12月中旬 | 发布内测版,招募种子用户 | 内测启动 | 📋 待开始 |
| 内测迭代 | 12月中旬-1月初 | 收集反馈、快速修订 | 内测版稳定 | 📋 待开始 |
| Datawhale组队学习 | 2月/3月(待定) | 首次正式组队学习 | 首轮学习完成 | 📋 待定 |
3. 人员规划
| 角色 | 负责内容 | 人数 | 主要职责 |
|---|---|---|---|
| 项目负责人 | 全局 | 1人 | 统筹进度、质量把控、Datawhale对接 |
| 基础篇校验 | 基础篇第1-6章 | 1-2人 | 内容校验、案例补充、语言润色 |
| 进阶篇校验 | 进阶篇第0-12章 | 1-2人 | 技术准确性、代码验证、内容完善 |
| 「他们说」编辑 | 资源库 | 2-3人 | 资源收集、筛选、撰写简评 |
| Web工具开发 | 互动教学工具 | 1-2人 | 前端开发、交互设计、概念可视化 |
| 社区运营 | 全局 | 1人 | 内测组织、反馈收集、社群维护 |
预计团队规模可根据实际情况灵活调整
已完成内容
已完成内容
1. 已上线内容
项目官网:Vibe Vibe: From Scratch to Full Stack(暂存)待后续datawhale的repo建好后,使用基于datawhale的repo来做vitepress页面。此外,我们最近购买了一个vibevibe.cn的域名,届时或许可以使用docs.vibevibe.cn和whale.vibevibe.cn来作为我们的教程网页的访问地址
- 已完成教程框架搭建
- 已实现零基础友好的landing page设计
- 后续章节内容持续开发中
2. 相关技术储备
项目负责人具备以下相关经验:
- 长期使用Cursor/Claude Code等AI编程工具
- 有AWS Kiro等平台AI编程教程创作经验
- 受邀进行Vibe Coding主题分享
- AI+社区建设者(湖南大学金融科技协会创始人)
- AI创业者(为外贸电商行业公司提供AI化转型服务)
- 正在NUS NExT++ Research Center担任Research Intern,开展AI+金融研究工作(supervisor:Dr. Fengbin Zhu, Prof. Tat-Seng Chua)
- 个人主页:www.guohaoqi.cn
❗❗❗注意事项❗❗❗:为了便于我们跟你取得联系,请务必加我们的微信:at-Sm1les(备注你来自于项目立项即可),发起立项申请后DOPMC成员将会在7天内给出审核意见并评论在该Issue,若7天内无反对意见则默认立项通过,如有任何疑问或者需要帮助均可随时联系微信:at-Sm1les
- 我已知悉上述注意事项并添加了微信:at-Sm1les