10年没写代码,4个晚上做出＂工业级＂应用:AI改变了游戏规则

这不是一个纯前端玩具，而是一个结合了前端、后端，还有阿里云 OSS 存储的工业级产品。

前后大概花了4个晚上。

说起来有点不好意思，我已经10年没写代码了，和新手没什么差别。一开始只是想试试 Vibe Coding，看看能不能实现功能。后来逐步规划，把应用变成了一个前后端架构的产品。

回头想想，既然要做工业级产品，确实需要达到这种程度，所以后来就开始认真做了。

通过这个项目，我确定了一个想法：AI 现在真的可以帮你完成这样的事情，并且能做得很好。

AI 驱动的开发方法论

下面是我在整个过程中积累的一些经验，总结成了一套可复制的方法论。

第一步：一定要写好你的 PRD

你要相信，AI 一定比你想得更全面、更完善。

你需要给它的只是一个想法，但要记得让 AI 不停地反问你，然后按照一步一步的步骤，让它帮你写：

• 项目概述

• 需求说明

• 用户旅程

• 项目操作流程

• 涉及的几个页面

让它通过不停反问的方式与你交流，然后慢慢去形成你的 PRD。

让它一个一个问题地问你，不要嫌多、嫌烦，它会问得非常非常细。

每一个小故事（User Story），它都会告诉你在这个故事里，用户是怎么用的，用户旅程是怎么样的。然后，它会先把线框图（或流程图）画出来，画出来之后你去做确认。如果没问题，再进行下一个故事。每个故事都这样循环往复。

当然，PRD 里面还会包含一些非功能性的需求。这个 AI 会比较聪明，它会帮你考虑一些方面，比如：

• 密码验证

• 防暴力破解

• 性能需求

• 数据库存储

• 是否明文存储

所以，写好 PRD 是你关键的第一步。

第二步：引入专家角色规划项目

在 PRD 完成之后，你要请各种角色身份来帮你规划这个项目。

引入技术专家

你要引入一个技术专家的身份，去评估你的 PRD 应采用什么技术方案。

让它告诉你：

• 采用什么技术方案？依据是什么？

• 为什么采用这个方案？

• 给出详细的建议和规划方案

• 甚至给出性价比分析

在这个活动中，我们会需要用到哪些外部工具，以及这些是否涉及成本，它都会给你评估一番。

把上面提到的 PRD，还有这个技术方案，让它落到一个具体的 MD 文件里写下来。这些都是你的思考和与 AI 交流的结果。

关于项目经理角色

同时，你也可以引入一个项目经理（PM）的身份，让他帮你规划整个开发阶段。

但我后来试下来，PM 和技术专家的角色其实有点重叠，这两个身份你引入一个就差不多了。你的用户故事和开发阶段规划，是可以放在那个 PRD 里的。

第三步：分阶段开发，逐步验证

接下来就进入开发阶段。

记住：让 AI 一个阶段一个阶段地给你做，不要一次性全部做完。

在进行每一个阶段的时候，让 AI 给你列出所有的任务清单，然后让你去确认要做哪些事情。你觉得没有问题，就让它开始做，接下来就只是等待就好了。

每个阶段做完之后，它会告诉你，并且让你去做一下验证。如果有问题，你再去本地启动一下服务，做一下测试验证就可以了。

第四步：质量控制与测试

千万不要相信 AI 说的"做完了"

不要以为已经做完了。你可以适时地引入一个叫"测试专家"的身份，让他基于你的 PRD 里某个阶段的故事，对 AI 现阶段完成的任务去做一个全面测试。

同样，你也不要完全相信这个测试专家的话。你要相信的是测试专家给你出的报告和总结。你可以让它给你出一个测试总结，这个非常有用。

有时候 AI 说做完了，其实是有遗漏的。我基本试下来，每个阶段都会有遗漏或错误的地方。

或者你也不一定要引入测试专家，你可以直接让 AI 基于当前完成的任务，自行测试一遍，然后让它告诉你测试结果是什么。

实战中的三个关键经验

经验1：技术方案可能需要调整

有时候 AI 给的技术方案不一定是正确的。

像我在做第二阶段，引入阿里云 OSS 存储的时候，我曾经想尝试用阿里云云开发和阿里云 STS 认证这种方式，后来发现怎么都行不通。

这个时候，我又重新引入了一个技术专家的身份，让他去评估我当前的技术方案。

这个时候就起效果了，它让我改了一个方案，从阿里云 STS 改成后端代理的方式，确实解决了我的一些问题。

当然，这不是一个最安全、最稳妥的方案，但确实已经达到了能用的级别。所以这也是一个经验：当遇到技术方案卡住时，重新引入专家评估。

经验2：UI 组件不能全信

有时候在前端设计时，AI 会引入一些组件，比如 Ant Design 这类 UI 组件。

这个时候，你也不能完全相信这个东西，需要自己进行判断和验证。

经验3：遇到问题时回归原生

有时候 AI 在组合这些工具时也会出现一些问题。

比如说，我在做文件上传区域时，会出现一个无法识别的竖线元素。我尝试调试了一晚上没有调通。

后来想什么办法呢？

让 AI 重做这个区域，让它用最原生的方式去做这个区域，不要再引入 UI 组件，这就很好解决了问题。

这个经验很重要：当复杂的组件方案出现问题时，用最原生的方式往往能更快解决问题。

像这个二维码组件，一开始也总是无法正确生成，一直都是引用 localhost 的一个地址。这个时候其实还是需要你学点代码或者编程的知识，这还是很有用的。

我的工具选择

关于 AI 模型

我用的还是 Cursor+Claude Code，但我没有用国外的模型，因为封号太严重，这一点对国人很不友好，所以我没有再用。

我最后用的是智谱的 GLM-4Coding Plan，而且我用的是最便宜的套餐，一个季度才几十块钱。

我觉得这能达到我的效果，而且物超所值。

关于工具体验

对比目前我用过的一些 AI 工具，还是 Claude Code 会好用一点。

你可以理解它是一个真正的元工具，你可以通过它来链接各种各样的外部工具。

现在迭代速度非常快，包括最近出的"龙虾"，其实我还没时间去研究，用好一个就够了。

项目成果与收尾

前面讲到这些事情做完之后，差不多你就能做出一个可用的工业级产品。

如果后面还需要优化，主要是部署、运维、生产环境以及 UI 方面的一些调整。

这个工具从前端来看内容比较简单，但通过它你可以熟悉整个 AI 应用开发的技巧。

现在大家所说的 Vibe Coding，通常只是做一些前端应用或者 HTML 网页，但实际上涉及到前后端，对于没有学习过相关内容的同学来说还是有一定门槛。

对我而言，我已经超过 10 年没有再写代码，其实和新手没什么差别。但通过这个项目，我也坚定了一个想法：AI 现在真的可以帮你完成这样的事情，并且能做得很好。

随着你对应用的熟练度增加，速度会越来越快。

将来真正考验的是你的创造力和点子。

关于项目"垃圾"

整个项目完成后，AI 会产生很多"垃圾"，比如一些过程文件，在上传 OSS 或者做其他事情时会生成过程文档。

比如 AI 会帮你写一些过程文件或者项目开发总结，这些当然很有用，但整个项目里会有点臃肿，适当删除就可以了。

保存工作成果

最后一步是保存你的工作成果，做好版本管理。我这里是上传到 GitHub。

在上传之前，记得先和 AI 沟通一句：

"我要上传到 GitHub，请帮我看一下哪些文件可以上传，哪些不可以。"

因为本地可能有一些敏感文件、敏感数据，以及通过 npm 安装的依赖包，这些是不需要上传的。

你要相信 AI 能帮你做好这件事，并让它告诉你它打算怎么做。这是一个关键点，一定要让 AI 告知你它的计划。

上传到 GitHub 之后，这就成了我的第一个开源项目。至少是一个可用的版本，后面差的只是生产部署了。如果有一些技术小伙伴觉得有用，可以直接拿去用。