vibe 了个 chrome 插件发现网站

一直干后端，前端仅限于知道些技术名词，最近 ai 很火，试着做了个练手的玩具项目，分享些经验给大家~

背景：手上有份 csv 文件，里面收集了很多 chrome 插件的 id 和名字等信息，想给它做个 web 端的搜索界面。东西实用价值不大，主要是想实战下 vibe coding 。

说下我的流程。

1. 前端用美团出的 nocode ， 参考 https://v2ex.com/t/1134493 。用它生成页面原型，然后下载到本地用 cursor 修改。这个玩意有个 [ Visual Edit ] 模式，就是直接选择页面元素编辑，这个功能很强，目前本地的 ai ide 还没有谁做到了。

2. nocode 有个 dev mode 就是直接修改代码，但是要申请，我没用过。用本地的 cursor 更灵活、更强大。

3. 后端我想着尽可能简化，数据库用 sqlite ，需要做些数据处理，用 ai 生成了个 pandas 脚本，但不想本地搭 python 环境，就用腾讯云的 cloud studio 建个 flask 项目，能提供公网预览。发现腾讯也有个 ai 助手，叫 codebuddy ，纯智障。虽然中间出现了些问题，但都在 qwen 、copilot 的协助下解决了。

4. 最后前后端联调。flask 增加 swagger 模块，生成 swagger.json ；或者从浏览器导出 curl 请求，把这些接口信息给 cursor ，告诉它调用 api 拿数据，基本上能解决。注意下跨域问题的处理。

5. 前端部署到腾讯的 Pages 服务 edgeone ，后端用 cloud studio 的公网预览暴露 api 。都提供免费额度。

总结：AI 放大了个人能力，让不懂前端的我能实现完整的产品。悲观的讲，未来绝大部分的画图、crud 程序员都会被替代，chat ui 是新的人机交互范式，自然语言将成为高级编程语言。

感兴趣的可以浏览下： https://crx-name2id.lipc.me/， 欢迎吐槽

nocode 生成代码： https://cnb.cool/netcat1/crx-name2id

效果图：