一页选好你的 Vibe Coding「装备」

新手最重要的一句
  • 先跑通最小闭环(本地预览 → 上线),再升级更强的模型/更复杂的架构。

1) 选路线 & 你的目标

你的情况

系统推荐(最短上手路径)

结论
根据你的路线与目标,给出最短的“安装 → 预览 → 上线”建议。
怎么理解“服务器/部署”
  • 纯静态:只是一堆 HTML/CSS/JS 文件 → 用 Pages/GitHub Pages 就够。
  • 带 API:需要一个后端接口 → 用 Workers/Serverless 或 VPS。
  • 越自由越复杂:从 Pages → Workers → VPS,学习成本逐渐上升。

2) 模型 & Coding Agent(产品推荐)

不想纠结就照抄:Codex + GPT-5.2(推荐)→ Claude Code + Opus 4.5(备选)。 新手优先把“本地预览 + 上线”跑通,CLI Agent 是可选项。

开源自部署路线:优点是低成本/可离线/更隐私;缺点是更折腾、需要下载模型、效果通常不如顶级闭源。 建议先用小模型跑通闭环,再决定是否升级更大模型。

选择器(只做最少的决定)

推荐组合
根据你的路线与工作方式给出最少安装建议。
我不会打开终端(展开看)
  • ⌘ + Space → 输入 Terminal → 回车。
  • 你会看到一个窗口,可以输入命令并回车执行。
  • Win 键 → 搜索 Windows TerminalPowerShell → 回车。
  • 看到窗口后就可以输入命令并回车执行。
  • 应用列表里搜索 Terminal(或 Konsole/GNOME Terminal)打开。
怎么验证基础工具装好了(展开复制命令)

逐行运行,看到版本号就行;提示 command not found 就去安装对应工具。

git --version
python --version
py --version
node --version
npm --version
git --version
python3 --version
node --version
npm --version
git --version
python3 --version
node --version
npm --version
开源路线:怎么验证本地模型能跑(展开)

安装 Ollama 后,先验证命令存在,再从库里挑一个 coder 模型运行(首次会下载,可能几 GB)。

ollama --version
ollama run <model>
# 例子:ollama run qwen2.5-coder:7b

LM Studio 是图形界面:打开 App → 搜索并下载一个 coder 模型 → 进入 Chat → 让它输出一段简单 HTML/JS 代码。

vLLM 更像自建服务:建议先用 Ollama/LM Studio 跑通闭环;如果你坚持用 vLLM,就用“生成安装指导提示词”让 AI 给你机器/显卡对应的最小配置。

3) IDE / 编辑器(产品推荐)

4) 服务器 / 部署(产品推荐)

你选中的部署方式

结论
选择上面选项后,这里会给出适用场景与最短上手建议。
Cloudflare Pages:静态站点怎么部署(最短步骤)
  1. 把项目推到 GitHub(新手推荐 GitHub Desktop)。
  2. Cloudflare Dashboard → Workers & PagesCreatePages
  3. 连接你的 GitHub 仓库
  4. Root directory:选你项目所在文件夹(index.html 在仓库根目录就填 .;在子目录就选那个子目录)
  5. Framework preset 选 None;Build command 留空;Output directory 填 .
  6. 部署完成后打开 *.pages.dev 域名验证
Cloudflare Workers:什么时候需要它
  • 你需要一个 API(例如保存数据/鉴权/聚合数据)。
  • 你需要定时任务(cron)。
  • 你需要存储:D1(数据库)/ KV(缓存)/ R2(对象存储)。

新手建议:先用 Pages 把前端跑通;确实需要 API 再加 Workers。

Vercel:适合谁
  • 你在做 Next.js/React 生态,想要一键部署与预览链接。
  • 你愿意跟随它的构建/输出目录约定。
Netlify:适合谁
  • 你主要是静态站点,也希望有一些附加能力(例如表单)。
  • 你愿意跟随它的构建/输出目录约定。
VPS:你需要准备什么(简版)
  • 需要学基础 Linux:SSH、进程管理、日志、磁盘。
  • 需要自己做部署/监控/备份/安全更新。

如果你只是要上线一个网页:优先选 Pages。

你的推荐清单(可复制/导出)

根据你上面的选择自动生成。你可以把它保存为 SETUP.md 放进你的项目仓库。