这门课的主题很明确：用 ChatGPT 和 Copilot 这两个工具，配合 Vue3 写一个仿简书的项目。它想验证的事情是——AI 到底能不能承担一个前端项目里的大部分编码工作，以及人在这个过程中该站在什么位置。资料包里的第一个阶段就在讲「理性认识 AI，它是一个工具」，这个基调定得比较实在，不是鼓吹 AI 万能，也不是唱衰。如果你正处在「听说 AI 能写代码，但自己没真正用过」的阶段，这门课的价值主要在于给你一个完整的、跑得通的参照流程。

它解决的是哪类工作场景

日常开发里最耗时间的往往不是难题，而是大量重复的页面结构、接口调用、表单校验、路由配置。这门课演示的正是把这类工作交给 AI 生成，人负责描述需求、检查结果、修正偏差。仿简书项目本身包含文章列表、详情、发布、用户信息这些典型模块，属于前端面试和实际业务里都常见的形态。学完之后你至少能判断：哪些环节适合让 AI 直接产出，哪些环节必须自己动手改，以及 AI 给出的代码通常会在哪里出问题——比如状态管理写错、组件通信绕远、边界条件漏掉。这种判断力比单纯会用工具更实用。

适合什么基础，先看哪几块

前提是你能读懂 JavaScript，知道组件、路由、状态这些概念大致是什么，最好自己写过一两个 Vue 页面。完全零基础直接上手会比较吃力，因为 AI 生成的代码需要你有能力验收。建议的顺序是先看第一阶段的导学和理性认识部分，把心态摆正；然后看常用 AI 工具的介绍，重点是 ChatGPT 的提问方式和 Copilot 在编辑器里的补全逻辑，这两块的用法差异很大，混着用效率反而低。真正进入 Vue3 项目实战后，不要一路照着敲，遇到 AI 生成的代码先自己读一遍再运行，读不懂的地方正是你的知识缺口。资料里的视频按阶段推进，配合项目源码使用效果更好，但源码只作对照，不建议直接复制粘贴交差。

学完能独立做什么

比较现实的预期是：你能独立用 AI 辅助完成一个中小型 Vue3 项目的前端部分，从搭架子、写页面到对接接口，速度比纯手工快不少，而且知道在 AI 卡住时怎么换一种问法或者自己补上。至于「90% 代码由 AI 生成」这个说法，理解成课程演示中的比例即可，实际项目里比例高低取决于需求清晰度和你的验收标准。练习时建议把项目拆成小块，每块先自己想清楚要什么再让 AI 写，写完后刻意改几处，看看改动会不会引发连锁问题——这个过程比多敲几行代码更能提升你对 AI 协作的掌控感。

课程目录

📁 第1阶段： 课程简介 & 正确看待 AI [1.1]--1-1 -导学.mp4
 [1.2]--1-2 -理性认识AI-它是一个工具，它需要主人.mp4
 📁 第2阶段： 认识常用 AI 工具，入门到实战 [2.1]--2-2 -ChatGPT为何能一夜走红？.vep [2.3]--2-4 -关于ChatGPT Plus和GPT4.0 - 我暂不.vep [2.4]--2-5 -ChatGPT实战-写一个前端简历，快速且全面.vep [2.5]--2-6 -ChatGPT实战-润色简历文案，看起来更正式.vep [2.6]--2-7 -ChatGPT实战-写TodoList项目需求，它想的.vep [2.7]--2-8 -ChatGPT实战-设计TodoList项目的组件，它.vep [2.8]--2-9 -介绍微软NewBing - 时效性好，但回答的太简洁.vep [2.9]--2-

10 -介绍Github Copilot - 最流行的AI编.vep [2.10]--2-

11 -Github Copilot实战-通过注释智能生成代.vep [2.11]--2-12 -介绍Cursor-智能代码编辑器，集成了GPT4.vep [2.12]--2-13 -Prompt优化-全面精准的提问，可以让AI更好的理.vep [2.13]--2-14 -AI和搜索引擎的区别-两者是完全不一样的.vep [2.14]--2-

15 -国内AI工具介绍.vep 📁 第3阶段： 使用 ChatGPT 写项目需求，设计技术方案 [3.1]--3-2 -本课程对于讲师和学员都具有挑战性.vep [3.2]--3-3 -使用ChatGPT写项目需求大纲-它考虑的非常全面.vep [3.3]--3-4 -根据ChatGPT的生成结果，提取核心功能.vep [3.4]--3-5 -使用ChatGPT根据需求，分析需要多少页面.vep [3.5]--3-6 -搭建Vue3开发环境.vep [3.6]--3-7 -使用ChatGPT做技术方案设计-先切换它的角色为前端.vep [3.7]--3-8 -使用ChatGPT生成路由配置，并用Copilot快速.vep [3.8]--3-9 -使用ChatGPT根据需求设计API接口.vep [3.9]--3-10 -使用ChatGPT快速生成axios配置和API代码.vep [3.9]--3-10 -使用ChatGPT快速生成axios配置和API代码(1).vep [3.10]--3-11 -使用Copilot快速生成API接口代码-part1.vep 📁 第4阶段： 项目开发 part1（以 ChatGPT 为主） [4.1]--4-2 -使用ChatGPT尝试生成导航栏代码-效果非常好.mp4
 [4.2]--4-3 -使用ChatGPT生成模板主体的代码.mp4
 [4.3]--4-4 -使用ChatGPT生成usePageTitle函数，修.mp4
 [4.4]--4-5 -使用ChatGPT生成导航菜单，并能根据url参数实时.mp4
 [4.5]--4-6 -使用ChatGPT生成搜索组件代码，清晰的指令即得准确.mp4
 [4.6]--4-7 -抽离登录和用户信息组件.mp4
 [4.8]--4-9 -使用Copilot快速写出注册逻辑和API接口代码.mp4
 [4.9]--4-10 -使用ChatGPT生成登录页的代码，并调整优化.mp4
 [4.10]--4-11 -使用Copilot快速写出登录功能和API接口代码.mp4
 [4.11]--4-12 -介绍Vue3状态管理，Pinia 代码演示.mp4
 [4.12]--4-13 -使用Copilot快速生成Pinia代码，存储和管理.mp4
 [4.13]--4-14 -使用Copilot生成代码，获取用户信息.mp4
 [4.14]--4-15 -在导航栏显示用户信息，并实现注销功能.mp4
 📁 第5阶段： 项目开发 part2（以 Copilot 为主） 📁 第6阶段： 使用 ChatGPT 做项目优化和测试 📁 第7阶段： AIGC 做副业，成本低 效率高 📁 第8阶段： AI 的风险和问题 📁 第9阶段：源码课件 适合人群 Vue3开发者 AI技术爱好者 编程新手 学习收获 掌握ChatGPT和Copilot使用 提升Vue3项目开发效率 探索AI辅助编程 祝您学习愉快！ 学有所成，前程似锦！