独立开发第一版：如何选择工具和搭建开发环境

准备开发第一版时，工具很容易越选越多。原型工具、编程助手、数据库、部署平台各有一套介绍，装完之后，反而说不清下一步该在哪个窗口里做什么。

工具可以按当前任务选择。做界面讨论，需要快速调整原型；做真实处理，需要能读项目、改代码和运行检查的编程工具。把这两件事分清，后续工作会容易安排。

上一篇已经给长文内容整理工具写好任务书。这篇继续用它说明选型和环境准备；它仍是教学示例。

原型工具负责确认交互#

原型需要回答的几个问题很具体：输入框放在哪里，结果怎么展示，处理过程中用户看到什么，手机上是否能操作。

可以用在线原型工具，也可以让 AI 生成一个本地 HTML 页面。此时使用模拟结果就够了。拿它讨论“标签要不要分开复制”，比在文字里反复解释布局直接。

我会先讨论需求，再生成 HTML 原型，确认后让编程工具根据原型整理设计规范并实现。工具生成的页面仍要检查图片、交互和平台限制，不能因为看起来漂亮就直接交付。

原型确认后，留下文件和几条设计约定，比如正文宽度、按钮状态、移动端布局。继续开发时，把它们和 SPEC 一起交给 AI，避免每次改功能又换一种设计。

对于示例工具，浏览器负责输入与显示；服务端校验输入、调用模型并整理结果。模型密钥留在服务端。这已经是一条足够清楚的实现路径。

是否需要数据库，则取决于是否要跨会话保存数据。第一版不提供历史记录，处理完就让用户复制结果，可以先不接数据库。以后增加历史记录，再讨论保存内容、保留期限和访问权限。

表里的后两行是需求出现时再加的能力。匿名调用模型的第一版，也应有服务端调用限制和费用上限；没有账号不代表可以无限开放接口。

无论采用编辑器里的 AI 助手还是命令行工具，先检查它是否能读项目文件、修改代码、执行命令并展示结果。还要知道怎么查看差异，以及怎样限制它对文件和外部服务的操作。

刚开始可以固定使用一套工具，做完几个小任务后再评价。代码报错时先查看原因；如果工具无法访问项目文件或执行必要命令，再考虑更换。每次切换，都要重新交代项目背景和当前任务。

安排开发任务时，我会先准备需求文档，再确认产品原型，最后用编程工具逐步实现。换一套工具，也要交代清楚当前在做哪一步，以及这一步要检查什么。

如果从模板起步，先看 README、package.json、锁文件和运行时要求。不要凭习惯更换包管理器，也不要删除锁文件来解决依赖报错。

以一个已经采用 pnpm 的 Node.js 项目为例，可以先查看版本：

1
node --version
2
pnpm --version

核对项目要求后，安装依赖、启动开发服务器。新项目需要下载依赖；安装命令可能执行依赖包的脚本，因此模板也要选来源可信、内容可检查的版本。

1
pnpm install
2
pnpm dev

这些命令的前提是项目已经定义了对应脚本。Python、纯静态 HTML 或其他技术栈应使用自己的运行方式。

打开终端显示的本地地址，确认页面能访问，然后再检查核心接口是否已经接通。终端显示“服务器已启动”，只代表开发服务在运行。

可以把环境故障和产品故障分开记录。安装依赖就失败，优先检查版本、网络和安装日志；页面能打开但摘要请求失败，再去检查接口和供应商响应。

把模型服务地址、模型名称和密钥配置在项目约定的环境变量位置。不同框架加载文件的方式不同，按项目文档确认，尤其要区分服务端变量与会被打包到浏览器的公开变量。

代码仓库中可以放一份只含变量名和占位值的配置示例：

1
MODEL_API_URL=https://api.example.com/v1
2
MODEL_NAME=replace-with-your-model
3
MODEL_API_KEY=replace-with-your-own-key

这个地址和变量名只是示例，不能直接用于真实调用。实际配置里，私密密钥只由服务端读取；带有 PUBLIC_ 或 NEXT_PUBLIC_ 等公开前缀的变量，按框架规则可能进入客户端产物，不能放秘密。

保存真实配置的本地文件应被 Git 忽略。提交前检查文件清单，不能只凭“应该写过 .gitignore”就跳过确认。忽略规则也不能让已经被 Git 跟踪的文件自动停止跟踪。

项目首次能稳定运行时，保存一个可恢复的版本。之后每次只改一个能说清楚的任务，检查通过再记录。

Git 可以保存代码变化，GitHub 等托管服务则可以保存远程副本。它们是两件事：本地提交不会自动上传，上传代码也不意味着产品已经上线。

至少熟悉这几个查看命令：

1
git status --short
2
git diff --stat
3
git diff

提交时按具体文件选择变更，不要把整个目录里的临时文件、密钥和无关修改一起提交。旧版本的代码能恢复，也不代表外部数据库和已产生的 API 费用能恢复。

在 README 或现有的项目指令文件中留下几行说明，下次启动时就有据可查：

1
运行时与包管理器：采用什么版本，依据哪个配置文件。
2
安装、启动、检查、构建：各用什么命令。
3
配置变量：需要哪些变量，由前端还是服务端读取。
4
当前状态：哪些功能是真实调用，哪些仍是模拟结果。
5
本次限制：暂不支持哪些输入和能力。

关掉开发服务，再按记录启动一次。如果需要凭记忆补命令，说明记录还不够完整。能重新运行项目后，下一篇就可以把输入页面接到真实处理逻辑。