01 | 先把开发环境准备好

第一次做 Vibe Coding，笔者没有直接让 AI 写页面，而是先整理环境边界。

笔者的开发环境里，Codex Cli 已安装，并配置了可用模型；同时配置了 Oracle SQLcl 的 MCP，可以连接到数据库里的开发用户。为了后续方便，也添加了 Oracle 的 Skill，不过这不是必须条件。

另外，conda 环境也已经安装。笔者让 Codex 直接在 conda 中创建一个独立的 alfred 环境，这样不会影响同样使用此环境开发的其他同事。

端口也提前规划好。本次使用两个端口，分别给前端和后端。

02 | 不急着写代码，先让 AI 探索数据库

真正开始 AI 开发时，笔者先和 Codex 对话，让它通过 SQLcl MCP 连接开发用户，并分析已建立的一张表。

这里有一个关键点：Vibe Coding 不要求一开始就懂很多具体技术，但最好有一点前后端概念。需求描述可以按生产要求来写，这样后续结果不会只停留在 Demo。

笔者的做法是：先把初步想法交给 AI，让 AI 润色成一版更完整的提示词。提示词里明确产品目标是构建“可信知识录入平台”，并告诉 Codex：

• 数据库通过本地 SQLcl MCP 读取和写入，不要在 Python 中做 Mock 数据；
• 后端使用 FastAPI，并要求异步化、RESTful 接口和 Pydantic 校验；
• 前端使用 React，建议结合 Tailwind CSS，页面要具备现代响应式设计；
• 第一步不是直接写 React，而是先探索数据库中的 AI_QA_LIB 表；
• 如果后续需要其他表，必须以 AI_ 开头，便于区分。

这样，Codex 的第一步任务就很清晰：先理解表结构，再汇报查到了什么、表之间可能有什么业务逻辑、计划设计哪些 FastAPI 路由，以及 React 前端布局和配色想法。

03 | 用聊天方式逐步确认需求

第一步探索完成后，后面的开发就顺畅很多。笔者继续用聊天方式和 Codex 确认需求，等框架搭建并运行后，再根据偏好微调。

第一个版本先做最基础也最关键的功能：访问真实数据表，完成知识录入；也能对已录入知识进行检索、更新和删除。

可以访问真实的数据表，进行知识录入：

可以对已录入知识进行检索、更新、删除：

这一步的重点不是一次性做大做全，而是先跑通前端页面、后端接口到真实数据库表的完整链路。

04 | 安全和运维要提前规划

除了产品业务功能，安全和运维层面的规划也很关键，而且通用。

在安全性方面，笔者要求前端必须有登录界面，验证真实用户名和密码后才可以进入系统；后端 REST API 也必须有 X-API-KEY 认证。

在易用性方面，笔者要求提供一整套启动、关闭、检查服务状态的脚本。这样既方便后续维护，也方便 Codex 调试时直接调用。

05 | 第一个版本先完成基础闭环

最终，第一个 Vibe Coding 程序完成了基础功能：可以录入可信知识，可以检索、更新、删除已录入内容，也加入前端登录页面。

对初学者来说，这个过程的启发是：Vibe Coding 不是简单让 AI “写个程序”，而是先把环境、数据库、技术栈、接口、安全和运维要求说清楚，再让 AI 小步快跑地执行。

至此，笔者的第一个 Vibe Coding 程序基础功能已经完成。后面会根据实际需要继续迭代。

关注我，和AI一起成长~