人人都能学的 AI Coding 实战课 — 完整大纲

你不需要学 for 循环、if else、变量声明这些编程语法。AI Coding 的逻辑是：你用中文告诉 Cursor 你想要什么，AI 帮你写代码。你的工作是描述需求、检查结果、指出问题。这节课讲清楚传统编程 vs AI Coding 的区别，为什么 2026 年不会写代码的人也能做出能用的网站，以及 AI Coding 工程师这个新岗位是什么。

学习 Prompt 的基本概念，理解如何与 AI 有效对话，完成你的第一次 Prompt 练习。

动手写你人生中第一条 Vibe Coding 指令，感受

阅读「Vibe Coding 是什么」章节。自主节奏完成，巩固本节课的知识点。

Cursor 是目前最好用的 AI 编程工具——打开它，用中文告诉它你要什么，它帮你写代码。这节课从下载 Cursor 开始，一步步完成安装、登录、创建第一个项目。如果你从来没用过代码编辑器，不用怕，按步骤操作就行。课后你的电脑上就有一个能写代码的环境了。

从零开始认识浏览器，学会用地址栏访问网站、用搜索引擎找答案、用快捷键复制粘贴文字。完成后你就能独立上网查资料了。

认识目前最流行的 AI IDE——Cursor。掌握 Composer 多文件编辑、@ 引用上下文、Tab 补全，以及如何用 .cursorrules 让 AI 记住你的项目规矩。

阅读「安装 Cursor 与环境准备」章节。自主节奏完成，巩固本节课的知识点。

在动手之前先想清楚：你要做一个什么样的产品？好的互联网产品解决一个具体问题，目标用户清晰，操作流程简单。这节课看几个真实案例——它们为什么好用、解决了什么痛点、你能从中学到什么。想清楚这些，后面用 AI 写代码才知道要写什么。

阅读「AI Native 产品是什么」章节。自主节奏完成，巩固本节课的知识点。

浏览器、服务器、前端、后端、数据库、API、域名、DNS、HTTP、Git——这 10 个词你会反复碰到。不需要深入理解原理，但需要知道它们是什么、干什么用的、互相之间什么关系。这节课用最简单的比喻解释这 10 个概念，5 分钟一个，看完后面的课就不会一头雾水了。

了解什么是大语言模型、Token 的概念、System/User Prompt 的区别，以及主流 AI 模型的定位。

阅读「开发者工具栈速览」章节。自主节奏完成，巩固本节课的知识点。

Mac 用 Command，Windows 用 Ctrl。复制粘贴、撤销、保存、切换窗口、截图——这些快捷键在写代码时每天用几百次。这节课按操作系统分别列出最常用的 15 个快捷键，练几遍就记住了。后面操作 Cursor 和终端时你会感谢自己练过这些。

终端就是一个黑色的文字窗口，你输入命令，电脑执行。听起来吓人，但日常只用 5 个命令：cd（进入文件夹）、ls（看文件列表）、mkdir（创建文件夹）、code .（打开 Cursor）、git（保存代码）。这节课还会讲本地环境和云端环境的区别——本地就是你自己的电脑，云端就是别人的服务器。初学者先用本地就够了。

写代码最怕的不是写错，是改着改着回不去了。GitHub 帮你保存每一次修改，随时可以退回之前的版本。这节课从注册 GitHub 账号开始，创建你的第一个仓库（Repository），学会把代码推上去（push）和拉下来（pull）。以后每做完一个功能就 push 一次，代码永远不会丢。

阅读「Git Commit 规范与 Emoji」章节。自主节奏完成，巩固本节课的知识点。

AI Product Management 就是用 AI 来做产品管理——不是管 AI 产品，而是用 AI 帮你规划产品。这节课讲一个产品从想法到上线的完整流程：找到用户痛点 → 定义核心功能 → 画原型 → 拆任务 → 开发 → 测试 → 上线。后面的课你就是按这个流程走的。

学习如何通过明确的任务描述，让 AI 精准理解并执行你的需求。掌握动词开头、约束条件和任务拆分。

阅读「从想法到 PRD（用 AI 写 PRD）」章节。自主节奏完成，巩固本节课的知识点。

不知道做什么项目？这节课给你 3 个真实案例参考：一个餐厅官网（展示型）、一个预约系统（交互型）、一个个人作品集（Portfolio 型）。每个案例拆解它的页面结构、功能模块、用了什么技术。你可以直接选一个来改，也可以受启发自己想一个。关键是选一个你真的想做的，学起来才有动力。

阅读「实战：Todo App」章节。自主节奏完成，巩固本节课的知识点。

User Story 是产品经理最常用的需求描述方式：「作为 [某种用户]，我想要 [某个功能]，以便 [达到某个目的]」。比如「作为餐厅客户，我想在线预约座位，以便不用打电话排队」。这节课教你把一个模糊的产品想法拆成 10-15 条 User Story，每条都够具体到可以让 AI 直接写代码。

阅读「AI User Research：数据驱动的需求洞察」章节。自主节奏完成，巩固本节课的知识点。

前面想了产品方向、看了案例、写了 User Story，现在把它们整合成一份正式的产品提案（Proposal）。这节课用 AI 辅助你完成：产品名称、目标用户、核心功能列表、页面结构草图、技术选型建议。Proposal 是你后面整个项目的蓝图——改需求、加功能、找方向都回来看这份文档。

学习如何指定输出格式，让 AI 的回答结构化、可预测、易于使用。掌握列表、表格、JSON、Markdown 等格式的应用场景。

HTML 是网页的骨架——标题用 h1、段落用 p、图片用 img、链接用 a、列表用 ul/li。不需要背语法，因为 AI 会帮你写。但你需要看懂 AI 写的 HTML 是什么意思：这里是标题、那里是导航栏、下面是内容区。这节课用 10 分钟讲清楚 HTML 的核心标签，看完你就能读懂网页源代码了。

CSS 是网页的皮肤——颜色、字体、间距、布局、动画都靠它。AI 写的 CSS 代码你也不用背，但要能看懂：color 是颜色、font-size 是字号、margin 是外边距、display: flex 是弹性布局。这节课讲最常用的 15 个 CSS 属性，看完你就能跟 AI 说「把标题改成红色、字号改大、居中显示」。

Git 是代码的存档系统。每做完一步就 git commit（存个档），搞砸了就 git checkout（读档回退）。这节课只教 5 个命令：git init（初始化）、git add（选择文件）、git commit（存档）、git push（推到 GitHub）、git log（看历史记录）。从现在开始每节课结束都 commit 一次，养成习惯。

把你之前写的 Proposal 用 AI 转化成正式的 PRD（产品需求文档）。PRD 比 Proposal 更详细：每个页面有什么功能、每个按钮点了之后发生什么、数据从哪来存到哪去。这节课用 Cursor + AI 一起写 PRD——你说需求，AI 帮你组织成文档格式，你检查、补充、修改。

跟 AI 说「帮我写个网站」它不知道从哪开始。这节课给你一个 Prompt 公式：[角色] + [任务] + [技术栈] + [约束条件] + [输出格式]。比如：「你是一个 Next.js 开发者，帮我写一个用户注册页面，用 Tailwind CSS，表单要有邮箱和密码验证，输出完整的组件代码」。记住这个公式，AI 的代码质量直接翻倍。

掌握让 AI 生成高质量代码的 Prompt 模板，从

掌握 Few-shot prompting 技巧，学会通过提供示例来引导 AI 产出一致、高质量的输出。

阅读「写出第一个 Prompt」章节。自主节奏完成，巩固本节课的知识点。

阅读「高质量 Prompt 模板」章节。自主节奏完成，巩固本节课的知识点。

AI 写了 200 行代码给你，你怎么知道它写得对不对？这节课教你不用理解每一行代码的情况下判断质量：看文件名和函数名猜大概在做什么、找 console.log 验证数据流向、看注释理解意图、用浏览器预览实际效果。80% 的情况下你只需要看懂结构，不需要逐行读。

学习如何用 Prompt 让 AI 生成高质量、可直接运行的代码，避免常见的代码生成陷阱。

阅读「理解与校验 AI 的回复」章节。自主节奏完成，巩固本节课的知识点。

一个网页项目文件夹里有 HTML 文件（骨架）、CSS 文件（样式）、JS 文件（交互逻辑），还有 package.json（项目配置）、node_modules（依赖库）、public（静态资源）。这节课拆解一个真实项目的文件结构，让你知道每个文件夹是干什么的，改东西去哪找。以后 AI 让你「把代码放到 src/components/ 下」你就知道在哪了。

前面所有的准备工作——Proposal、User Story、PRD、文件结构——都在这节课汇总提交。你应该已经有一份完整的 PRD 文档，清楚地描述了你的产品做什么、给谁用、有哪些页面和功能。讲师会 review 几份 PRD，指出常见问题：需求太模糊、功能太多、没有优先级。提交后正式进入编码阶段。

PRD 准备好了，终于开始写代码。打开 Cursor，把 PRD 里的第一个功能描述复制进去，告诉 AI 用什么框架（Next.js / React），它就开始写了。这节课手把手带你完成第一个功能——可能是一个导航栏、一个 Hero Section、或一个联系表单。重点不是代码本身，是你和 AI 的协作流程：描述需求 → AI 写代码 → 你预览效果 → 提出修改 → AI 改。

阅读「交付一个小功能的全流程」章节。自主节奏完成，巩固本节课的知识点。

AI 写的代码跑不通很正常——专业程序员写的代码也天天报错。关键是你怎么把报错信息给 AI。三步法：1）复制完整报错信息（不是截图，是文字）；2）告诉 AI 你在做什么操作时报的错；3）让 AI 解释报错原因再给修复方案。90% 的报错 AI 能一次修好。这节课列出新手最常见的 10 种报错和解决方法。

AI 写的代码不可能一次就对。学会读懂错误日志、识别 AI 常犯的错误模式，以及如何把错误信息精准地喂给 AI 让它自己修复——这才是 Vibe Coding 的核心技能。

学会使用约束来精确控制 AI 输出：长度限制、格式要求、内容边界、风格规定和禁止事项。

阅读「用 AI 做 Debug」章节。自主节奏完成，巩固本节课的知识点。

上节课讲了 Debug 的方法论，这节课实战。讲师故意制造 5 个真实 bug（CSS 样式错位、JS 报 undefined、API 连不上、页面空白、部署失败），现场用 Cursor + AI 一个一个修。你看完整的 Debug 流程：看报错 → 定位问题文件 → 复制给 AI → AI 分析原因 → 给修复代码 → 验证修复。不再怕报错了。

掌握 CoT 提示技术，让 AI 通过分步推理得出更准确、更可靠的答案。

你已经能用 AI 写代码和修 bug 了，但容易写着写着迷路——不知道下一步该做什么。这节课给你一个标准开发流程：1）看 PRD 选下一个功能 → 2）拆成小任务（每个 15-30 分钟）→ 3）一次只做一个任务 → 4）做完 commit → 5）预览检查 → 6）下一个。按这个节奏走，不管多大的项目都不会乱。

阅读「Vibe Coding 思维模型」章节。自主节奏完成，巩固本节课的知识点。

CMS（内容管理系统）是网站后台——管理员用它添加、修改、删除网站上的内容。比如餐厅老板在后台改菜单，前台网站自动更新。这节课用 Cursor + AI 从零搭一个 CMS：管理员登录界面、内容列表、添加/编辑/删除功能。你会第一次体验「后台改数据，前台立刻变」的感觉。

学习如何把设计稿或截图交给 AI，让它生成符合你项目规范的前端代码。掌握指定 UI 框架、约束组件结构、控制响应式行为的指令技巧。

阅读「与 AI 结对编程」章节。自主节奏完成，巩固本节课的知识点。

网页上的按钮、卡片、导航栏、轮播图、表单、弹窗、下拉菜单——这些都是前端组件。这节课介绍 15 个最常用的组件，每个展示长什么样、什么场景用、怎么告诉 AI 生成。以后你说「帮我加一个带图片和标题的卡片列表」，AI 就知道你要什么了。

不是一个页面一个页面写，而是用 AI 一次搭一个完整的多页面官网：首页（Hero + 功能介绍 + 客户评价 + CTA）、关于我们、服务列表、联系我们。这节课讲怎么给 AI 一个完整的网站结构描述，让它一次性生成所有页面的框架，你再逐页调整细节。比一页一页写快 5 倍。

阅读「多文件协作与项目级修改」章节。自主节奏完成，巩固本节课的知识点。

前面搭了前台页面，这节课搭后台系统。后台需要三个核心功能：管理员登录（不能谁都能进后台）、数据列表（展示所有内容）、增删改查（CRUD）。用 Cursor 告诉 AI 你的数据结构（比如服务名称、价格、描述、图片），它帮你生成完整的后台页面。这节课结束后你有一个能登录的后台管理界面。

学习

掌握让 AI 输出合法、稳定、可被程序直接消费的 JSON 数据的技巧。

阅读「前后端协同与 API 生成」章节。自主节奏完成，巩固本节课的知识点。

数据库就是存数据的地方。你的网站需要存用户信息、产品列表、订单记录——这些数据不能写死在代码里，要存在数据库里才能动态更新。这节课讲数据库的最基本概念：表（Table）、行（Row）、列（Column）、主键（ID）。用日常表格类比，5 分钟就能理解。后面的课会用 Supabase 免费搭一个真实数据库。

阅读「数据与知识库协作」章节。自主节奏完成，巩固本节课的知识点。

用户注册、登录、忘记密码、修改个人信息——几乎每个网站都需要用户系统。这节课用 Cursor + AI 实现完整的用户系统：注册表单（邮箱 + 密码）→ 登录验证 → 用户会话管理 → 个人中心页面。AI 帮你处理密码加密、Token 管理这些技术细节，你只需要描述需求和检查效果。

AI 生成的代码能跑不等于安全。学习 AI 代码中最常见的安全问题——硬编码密钥、缺少输入校验、权限漏洞，掌握一份 Security Review 清单来守住底线。

前面分别做了前台页面和后台 CMS，这节课把它们连起来。管理员在后台添加一个 Service（比如「网站设计 $500」），前台官网的服务列表页自动出现这条内容。核心操作：前台调 API → 从数据库读数据 → 渲染到页面。用 Cursor 告诉 AI 数据流向，它帮你写 API 和数据获取代码。

最完整的业务闭环：用户在官网浏览 Service → 选择 → 填写订单信息 → 提交 → 管理员在后台看到这个订单。这节课实现从用户下单到管理员查看的完整流程，包括订单表单、订单列表、订单状态管理。做完这节课，你的网站就不只是展示页面了，它能接单了。

代码写完了，但只在你自己电脑上能看到。部署就是把代码放到互联网上，让所有人通过网址访问。这节课讲部署的三个核心概念：服务器（代码放哪）、域名（网址是什么）、DNS（域名怎么指向服务器）。下节课实操部署，这节先理解原理。

阅读「脚手架与自动化交付」章节。自主节奏完成，巩固本节课的知识点。

Vercel 是最简单的部署平台——连接 GitHub 仓库，点一个按钮，网站就上线了。这节课手把手操作：注册 Vercel → 连接 GitHub → 部署 → 拿到一个 .vercel.app 网址 → 绑定自己的域名（可选）。5 分钟你的网站就在互联网上了。每次 push 代码到 GitHub，Vercel 自动重新部署。

代码写完了不算完，部署上线才是真正的

网站上线了但没人能搜到怎么办？SEO（搜索引擎优化）就是让 Google 把你的网站排在搜索结果前面。这节课讲 SEO 最基本的 5 件事：标题标签（title tag）、描述标签（meta description）、URL 结构、图片 alt 文字、页面加载速度。不需要很深，知道这 5 件事就比 90% 的新网站强。

学习如何用 AI 从非结构化文本中提取结构化数据，掌握 NER、简历解析、合同分析等实用技巧。

阅读「内容创作全景图」章节。自主节奏完成，巩固本节课的知识点。

上节课讲了 SEO 概念，这节课实操。用 AI 帮你做 3 件事：1）检查你网站的 SEO 问题（用 Lighthouse 或 PageSpeed Insights）；2）生成每个页面的 title 和 meta description；3）优化图片和加载速度。做完之后用 Google Search Console 提交你的网站，等 Google 收录。

练习职场三大高频场景：写邮件、写周报、分析数据。每个场景都用 Prompt 公式实战，做完就能直接用在工作里。

阅读「AI 调研、摘要与知识库」章节。自主节奏完成，巩固本节课的知识点。

API 就是两个程序之间互相说话的方式。你的前台页面向后台 API 发一个请求「给我所有的 Service 列表」，API 返回数据，前台显示出来。这节课用实际例子讲清楚 API 的请求-响应模式、GET 和 POST 的区别、什么是 RESTful。理解了 API，后面加 AI 功能（Chatbot、OCR）就知道怎么接了。

JSON 是程序之间传递数据的格式——就像 Excel 的表格格式，但用花括号和方括号组织。{"name": "网站设计", "price": 500} 这就是一条 JSON 数据。这节课教你读写 JSON：键值对是什么、数组怎么写、嵌套怎么看。API 返回的数据和 AI 生成的结构化数据都是 JSON 格式，看懂它你就能处理所有数据。

前面你做的网站只能展示固定内容。这节课开始让产品「聪明」起来——调用 AI 的 API 给网站加智能功能。比如用户输入一段产品描述，AI 自动生成 SEO 标题和关键词；用户上传一张图片，AI 识别内容并生成描述。用 Cursor 告诉 AI 你要什么功能，它帮你写调用 OpenAI API 的代码。

学习如何通过角色设定，让 AI 以特定身份、专业视角和风格进行回答。

阅读「MVP 规划与工具选型」章节。自主节奏完成，巩固本节课的知识点。

OCR（光学字符识别）就是让 AI 看懂图片上的文字。拍一张名片，AI 提取姓名、电话、邮箱；拍一张收据，AI 提取金额、日期、商品。这节课讲 OCR 的原理（不深入技术）和实际用途：文档数字化、发票识别、车牌识别、手写体识别。下节课的 Chatbot 和这节课的 OCR 是给网站加 AI 功能的两个最常见场景。

学习如何利用多模态 AI 处理图片、音频和文本的混合输入，掌握图文组合 Prompt 的设计技巧。

阅读「AI 多模态输入与解析」章节。自主节奏完成，巩固本节课的知识点。

Chatbot 就是网站上那个弹出来跟你说「有什么可以帮你」的小窗口。以前的 Chatbot 只能匹配预设问答，现在用大语言模型（GPT/Claude）做的 Chatbot 能真正理解问题并回答。这节课讲 Chatbot 的基本架构：前端聊天界面 → 发消息到后端 → 后端调 AI API → 返回回答。下节课实操把 Chatbot 加到你的网站上。

学习如何设计结构化、可维护的 System Prompt，包括角色定义、行为规则、边界设定和版本管理。

理解 AI 问答的三种模式，掌握 FAQ 系统的 Prompt 设计，学会处理

阅读「Coze Bot 构建」章节。自主节奏完成，巩固本节课的知识点。

这节课动手给你的网站加 AI 功能。三选一（或全加）：1）智能客服 Chatbot（用户在网站上提问，AI 基于你的产品信息回答）；2）内容生成（用户输入关键词，AI 自动写文案/描述）；3）图片识别（用户上传图片，AI 返回分析结果）。用 Cursor 描述你要什么功能，AI 帮你写前端组件 + 后端 API + AI 调用代码。

学习如何在有限的上下文窗口中，高效组织信息，让 AI 始终保持专注和准确。

阅读「AI Agents 与工具调用」章节。自主节奏完成，巩固本节课的知识点。

Embedding 是把文字变成数字向量——听起来很技术，但实际用途很直观：让你的 Chatbot 能搜索你上传的文档。普通 Chatbot 只知道 AI 训练过的通用知识，加了 Embedding 后它能搜索你的产品手册、FAQ、公司政策，回答「你们的退货政策是什么」这种具体问题。这就是 RAG（检索增强生成）的基础原理。

学习 RAG（检索增强生成）的核心流程，掌握如何用外部知识库增强 LLM 的回答质量，减少幻觉。

阅读「RAG 系统入门」章节。自主节奏完成，巩固本节课的知识点。

产品原型就是产品的「草图」——在写代码之前，先画出来每个页面长什么样、点哪里跳到哪里、数据怎么流转。这节课用 AI 工具（Bolt / v0 / Figma AI）快速生成产品原型：描述你想要的页面，AI 生成可交互的原型，你调整布局和交互逻辑。有了原型再写代码，方向更清晰，返工更少。

阅读「Bolt 快速生成 Web 应用」章节。自主节奏完成，巩固本节课的知识点。

第一版产品上线后不是结束，是开始。产品迭代就是根据用户反馈持续改进：收集用户反馈 → 分析哪些功能用得多哪些没人用 → 决定下一版改什么 → 用 AI 快速实现修改 → 发布新版本。这节课讲迭代思维和具体方法，包括怎么用 Google Analytics 看数据、怎么用 AI 分析用户反馈。

学习如何科学评估 Prompt 的效果，掌握评分标准设计、A/B 测试方法和持续优化策略。

阅读「AI 产品迭代管理：从 MVP 到规模化」章节。自主节奏完成，巩固本节课的知识点。

整个课程的最后一个作业：完成你的 AI 互联网产品原型。不是从零开始——你前面已经有 PRD、代码、部署好的网站、AI 功能。这节课是把所有东西整合打磨：UI 细节调整、Bug 修复、性能优化、产品文档撰写。用 Cursor + AI 做最后的打磨，准备下节课的展示。

AI 能帮你写代码，但谁来保证代码质量？学会从安全、性能、可维护性三个维度审查 AI 生成的代码，以及如何写出让团队受益的 Review 意见。

掌握将复杂任务拆解为多个 Prompt 步骤串联执行的编排技术，学习 Pipeline、Map-Reduce、校验回环三种核心模式。

8 周的成果展示。每人 10 分钟展示你的产品：做了什么 → 给谁用 → 解决什么问题 → 核心功能演示 → 技术亮点 → 遇到的坑和怎么解决的。导师点评每个项目：产品思维是否到位、AI 功能是否有价值、代码结构是否合理、展示是否清晰。做得好的项目可以继续优化上线运营。