跳到主要内容
版本:2026 TECHNEST 项目
JOB

AI 开发者工具包安装

导师 —— Chan Meng

TECHNEST 2026 的独立讲师。GitHub:github.com/ChanMeng666 · LinkedIn:linkedin.com/in/chanmeng666。完整课程站点在 programming.chanmeng.org。课程的 RAG 驱动 AI 助手(基于第 4 周会接触到的同一套检索模式)已索引了所有周次的讲义——课间被卡住时随时可以问它。

学习目标

到本节课结束,学员应当能够:

  • 装好并登录整学期要用的三套 AI 编码环境 —— Cursor(主力 IDE)、Claude Code(终端原生 AI)、Gemini CLI(免费额度的脚本型 AI)—— 并知道什么时候该用哪一个。
  • 给 Claude Code / Cursor 装上一个 Skill 和一个 MCP 服务器,并能用一句话说清每个扩展让 AI 能替学员做什么。
  • 识别并应用授权规则 —— 知道哪些操作该通过 CLI 或 MCP 交给 AI,哪些(OAuth、DNS、provider 侧凭据)必须自己动手。

核心主题

  • "自然语言就是源代码"为什么是这门课的主轴——以及它如何改变学员对编程的思考方式。
  • 三套 AI 环境:Cursor、Claude Code、Gemini CLI —— 分别在什么场景下用。
  • MCP 服务器和 Skills 是什么,它们如何把一个 AI 聊天变成会用工具的 agent。
  • Voice-first 提示词(可选但强烈推荐)—— Wispr Flow。
  • Cursor 的 Plan Mode —— 在 AI 改任何文件之前先看一遍它的计划。从第 2 周开始,这是任何"非小事"提示词的默认模式。
  • GitHub 作为"唯一真实数据源"那一层,后面每一周的部署链路都依赖它。

工具 / 技术栈

工具在本学期的作用
Cursor主力 IDE;内置 AI 聊天;整学期的周课工作都在这里发生
Claude Code终端原生的 AI,带 MCP + Skills;第 8 周 PDF 流程的首选
Gemini CLI免费额度的 AI,适合一次性脚本和快速探索
Wispr Flow语音转文字;不用敲字就能口述长提示词
GitHub唯一真实数据源;自动触发每一次 Vercel 部署
GitHub CLI(ghAI 调它来建仓库、改 Description / Topics、发 release
Vercel CLIAI 调它来部署、读日志、管理环境变量
Neon CLI + Neon MCPAI 调它来开数据库和 Auth(从第 4 周开始)
Typst skillAI 调它生成像素级精致的 PDF(第 8 周会用到)

课堂计划

时间活动
0 – 15 分钟回顾与 Check-in。 第一节课——没有回顾。10 分钟破冰:每个人讲一讲他们在看过 Cursor demo 之前之后 对"编程"这件事的理解。
15 – 40 分钟概念讲解。 授权规则。我们为什么让 AI 去跑 CLI。MCP 服务器是什么。声音 + AI 如何改变那些"非常吃键盘"的活儿。现场比一比:同一个任务,Cursor vs Claude Code vs Gemini CLI。
40 – 75 分钟现场演示。 讲师从零打开 Cursor,装上 Vercel MCP,然后对 Cursor 说:"给我搭一个简单的个人站点并部署到我的 Vercel。"全班看着 AI 自己挑起步方案、推到 GitHub、部署、返回一个活的 URL。
75 – 105 分钟动手 Lab。 每位学员在自己笔记本上把这遍演示复现一遍,结束时拿到一个可以分享的 *.vercel.app URL。
105 – 120 分钟Q&A + 收尾。 全班一起排错。所有人下课时都带着能工作的工具走。

动手 Lab

任务。 从"什么开发者工具都没装"走到"Cursor 刚刚在我 Vercel 账号里部署了一个简单的个人站点,而且整个过程我是亲眼看着它发生的"。这是整学期唯一一堂"手动配置多于平常"的课——从第 2 周开始,几乎每一步都只是一句口述。

给学员的节奏提示

如果你在第 1–4 步(安装)落后了,别慌。目标是在下课前走完 阶段 4(你的第一次 AI 驱动的 Vercel 部署)。安装可以继续挂在后台——Claude Code 可以一边在后台下载,一边 AI 已经能开始干活。

阶段 1 —— 装好三套 AI 环境

MANUALStep 1 · Manual (human only):

cursor.com 下载安装 Cursor。打开它,用 GitHub 登录,接受条款。当 Cursor 问你 "Would you like to import VS Code settings?" 时选 Skip —— 我们要一个干净的环境。

Why manual: Cursor 的安装器 + GitHub OAuth 需要点击和同意页,任何 CLI 都代替不了你。

MANUALStep 2 · Manual (human only):

官方快速开始 的步骤安装 Claude Code。在 Windows 上运行安装器,一路用默认值。当它提示登录时,用你的 Anthropic 账号登录。

Why manual: Anthropic 的登录流程会打开浏览器走同意,必须人参与。

MANUALStep 3 · Manual (human only):

Google 的 readme 安装 Gemini CLI。在任何终端(Cursor 自带的终端也行)里跑 npm install -g @google/gemini-cli,然后 gemini login,用 Google 账号登录。

Why manual: 装 Node + 登录 Google 两步都需要同意页。

PROMPTStep 4 · Say to Cursor:

请用我系统对应的包管理器(macOS 用 Homebrew、Windows 用 winget 或官方安装器、Debian/Ubuntu 用 apt)给我装上 GitHub CLIgh)。装好以后替我跑 gh auth login —— OAuth 浏览器页打开时停一下,让我在浏览器里确认 device code。授权完之后跑 gh auth status,确认它打印出我的用户名。

如果你有兴趣,现在顺手装上 Wispr Flow

Wispr Flow(wisprflow.ai)让你用口述代替敲字。从阶段 2 开始,几乎每条提示词都是一句口述——Wispr Flow 会让你这学期剩下的时间都舒服不少。

阶段 2 —— 证明 AI 会动手

PROMPTStep 5 · Say to Cursor:

先切到 Plan Mode。 然后:我刚装好你。你能不能做个自我介绍,告诉我你现在能调用哪些工具(比如能不能在终端跑 shell 命令、能不能读写硬盘上的文件、能不能打开网页?),然后在我 home 目录下新建一个叫 technest-week-1 的空文件夹?建好以后,把它作为 Cursor 工作区打开。

非小事提示词默认走 Plan Mode

Plan Mode 会让 Cursor 先写一份计划给你看,然后你再批准、它再执行——任何文件改动、任何命令都在这之后才发生。从这学期开始,但凡比"改一行字"复杂的提示词,都默认走 Plan Mode —— 它能在错误落到磁盘前就抓住你的误解。

文件夹命名讲究

不要空格、不要中文、小写优先。 一些 CLI 和部署平台至今还会被路径里的空格搞乱,而你今天创建的文件夹会一直跟着你出现在 Vercel 的 build log 里。technest-week-1 ✅ —— TechNest Week 1 ❌。

VERIFYStep 6 · Verify:
  • Cursor 用它自己的话报告了它的能力——花一点时间读一读。
  • 你的 home 目录下出现了一个叫 technest-week-1 的文件夹。
  • Cursor 窗口现在就在这个文件夹里(左侧文件树看得到)。

阶段 3 —— 装一个 MCP 服务器,让 AI 能操作 Vercel

PROMPTStep 7 · Say to Cursor:

请给我装上 Vercel MCP 服务器,这样你能替我调 Vercel 的 API。把它加到我的 Cursor 配置里。装好以后,告诉我它给你带来了哪些工具——我想看一看这张清单。如果 MCP 服务器需要我粘一个 Vercel token,请先停下来,告诉我这个 token 具体去哪里取,再继续。

MANUALStep 8 · Manual (human only):

当 Cursor 暂停并问你要 Vercel token 时,在浏览器里打开 vercel.com/account/tokens,登录,点 Create Token,名字起作 cursor-mcp,复制 token,粘回 Cursor 的聊天窗。

Why manual: Vercel 不通过任何 API 暴露账号级 token——只能在网页控制台里手动建。

VERIFYStep 9 · Verify:
  • Cursor 打印出它现在拥有的 Vercel 工具列表(创建部署、读日志、管环境变量等等)。
  • 没有报错。

阶段 4 —— "哇哦"时刻

PROMPTStep 10 · Say to Cursor:

现在向我证明这个"授权模型"真的能跑通。给我推荐一个适合简单个人 landing page 的起步方案——可以是 Next.js、Vite + React,甚至纯 HTML/CSS/JS——并用一段话告诉我你为什么这么选。然后在这个文件夹里建出这个项目(叫它 hello-technest),初始化 git 仓库,用 gh CLI(阶段 1 里装好的那个)把它推到我 GitHub 账号下一个新的公开仓库,再通过 Vercel MCP 部署到 Vercel。部署上线后,在我浏览器里打开生产 URL。整个过程中请合理地 commit 并写清楚的 commit message。我只负责看。

第一天不要把技术栈钉死

不少同学最后会落到 Next.js,因为 Vercel 的模板都假设你用 Next.js —— 这没问题,也正好对得上第 2 周我们要 fork 的 Magic Portfolio 模板。如果你的 AI 推荐了一个更轻的起步方案(Vite,或者一个 landing page 直接纯 HTML/CSS/JS),那也行。今天学的是部署管道,不是框架。

VERIFYStep 11 · Verify:
  • 你的浏览器打开了一个线上 hello-technest-*.vercel.app URL,显示你那个起步方案的页面。
  • 你的 GitHub 账号里出现了一个新仓库。
  • 本地文件夹里有 Cursor 替你写的一串合理的 commit 历史。
RECOVERStep 12 · If stuck, say to AI:

部署失败了,有个 build error。你能不能通过 MCP 读一下 Vercel 的 build log,找到根因,修一下,再重新部署?在我们进行下一步之前,我希望那个生产 URL 能无报错地打开。

阶段 4.5 —— 让仓库看起来像一个真项目

PROMPTStep 13 · Say to Cursor:

请把这个项目的 README.md 优化一下。包含:一句话项目简介、线上站点的截图或 URL、技术栈表格(你选了什么 + 为什么)、一段简短的"本地如何运行"、以及一张 Mermaid 图可视化部署管道(本地编辑 → git push → GitHub → Vercel webhook → 线上 URL)。改完 commit & push。

PROMPTStep 14 · Say to Cursor:

现在把这个仓库变得"可被发现"。用 gh CLI 把 GitHub 仓库的 Description 设成一句话总结这个站点是什么,再加五个合理的 Topics(比如 personal-websitenextjsvercelai-codedtechnest-2026 —— 根据你实际做的内容微调)。改完后跑 gh repo view --web,让我确认 description 和 topic chips 都渲染出来了。

VERIFYStep 15 · Verify:
  • 在 GitHub 上打开仓库。README 里有一张 Mermaid 图,并且能内联渲染(GitHub 原生支持 Mermaid)。
  • 仓库 About 边栏显示了你的一句话 description 和五个 topic chip。
  • gh repo view --web 这条命令在你浏览器里打开了仓库页。

阶段 5 —— 换一个 AI 试试手感

PROMPTStep 16 · Say to Claude Code:

打开一个终端,cdhello-technest,确认你能看到这个项目。然后把你目前激活的 Claude Code skill 列出来 —— 用"我现在有以下 skill 可用:……"的句式 —— 让我看看今天这台机器装好后自带哪些。Typst skill 我们在第 8 周再装(它住在另一个 GitHub 仓库,需要手动安装 —— Claude Code 不会自动发现 skill)。

VERIFYStep 17 · Verify:
  • Claude Code 打印它当前能用到的 skill 列表(比如项目内置的 slash command,以及你之前可能装过的 plugin skill)。
  • Typst skill 现在不应该出现 —— 这是有意为之,第 8 周才装。

阶段 6 —— 把授权规则内化掉

Career · 记住这张表——每一周你都会用到

让 AI 去做:开资源、环境变量管道、git、装依赖、改代码、迁移 schema、部署、生成 PDF——全部通过 CLI、API、MCP、Skill。只有你自己能做的事:OAuth 同意页、在 provider 站点建 API key、DNS、以及偶尔某行 .env.local(因为没有任何 CLI 能设它)。拿不准的时候,直接问 AI 这件事属于哪一类 —— 这是一个完美的提示词:"这件事你能通过 CLI 做,还是需要我自己来?"

本周作业

做 / 交付。

  • 一个全程由 AI 调 CLI 部署出来的 *.vercel.app 线上 URL。
  • 仓库里有一份精修过的 README.md,包含 Mermaid 部署管道图,加上 GitHub 的 Description 和至少 5 个 Topic(看阶段 4.5)。
  • 一张 Cursor 对话截图,展示你用哪一句提示词触发了部署。
  • 第二张截图,展示 Vercel MCP 的 tool-call 输出。

要求。

  • 仓库必须在你自己的 GitHub 账号下。
  • 部署必须是 AI 触发的,而不是你自己手动跑 vercel deploy(这是整学期的重点)。
  • Cursor 和 Claude Code 必须都装好并已登录。(Typst skill 在第 8 周才装,本周不要求。)

提交。 在第 2 周开课前,把这几样(线上 URL + 仓库 URL + 两张截图)发到课程 Slack 频道里。

资源

文档视频仓库
Cursor 官方文档 —— 入门讲师的 "first AI deploy" 演示录屏her-waka/tutorial/vibe-coding —— 给好奇学员的深入版
Claude Code —— quickstartFireship —— "Cursor in 100 seconds"ChanMeng666/typst-claude-skill —— 我们第 8 周要装的 Typst skill
Claude Code —— Skills reference
Vercel MCP server —— readme
GitHub CLI —— manual
Wispr Flow —— setup

真实世界应用

2026 年任何一家做 AI 工程的公司,在面试时都会让你 演示一次工作流,而不是背语法。招聘经理想看到的是:候选人打开 Cursor,描述一个功能,10 分钟后一个线上 URL 就出来了——因为他们团队里的资深工程师已经是这种工作方式。今天的 Lab 就是那段面试素材:你用一句口述拿到了一个线上 URL。请把屏幕录屏存好。

Career

下一周可以更新的 LinkedIn bio:"Full-stack AI developer · I prompt, I ship · vercel.app/my-project"

踩坑提醒 & 小贴士

  • "Cursor 每条 shell 命令都让我确认。" 这是好事——课堂环境下保留手动审批。第 3 周之后如果你想迭代更快,可以给低风险命令开自动批准。
  • "MCP 服务器说 'authentication required'。" 你的 Vercel token 丢了或过期了。从 vercel.com/account/tokens 重新生成一个并粘回来。
  • "gh auth login 在 device-code 那一步老是失败。" 确认你粘 code 的浏览器和你 GitHub 已登录的浏览器是同一个。还不行就换 gh auth login --web 走 OAuth 备用流程。
  • "Gemini CLI 提示我超了 rate limit。" 本节课剩下的时间用 Cursor 或 Claude Code。Gemini 免费额度每小时重置。
  • "我搞不清这一步该我做还是该问 AI。" 直接问:"这件事你能通过工具做,还是需要我自己做?" AI 会如实回答。
  • "我的提示词不够具体——AI 总在追问。" 仔细看这堂课讲师用的提示词。好的提示词会写明:AI 应该用哪个工具、手里有哪些输入、以及什么信号表示任务完成
如果彻底卡住了

把你最后一条提示词 加上 AI 最后一条回复,粘到一个全新的 Claude Code 窗口里,说:"这条没跑通。最可能的下一步是什么,为什么?" 把卡住的 AI 会话当成一个可以重启、可以检视、可以重定向的调试对象——这是这门课最重要的一个能力。