小白也能做的 Vibe Coding 插件,真的被我做出来了

前几天，我做了一个很小、但我自己真的很喜欢的浏览器插件。

它的功能不复杂，甚至可以说很朴素：

当你在 ChatGPT 或 Gemini 里进行了很多轮对话之后，它可以自动把你“提过的问题”整理成一个导航目录，点一下就能快速跳回去。

插件名字也很直接：

AI 问题导航插件（ChatGPT + Gemini）

GitHub 地址我也已经放出来了：

https://github.com/1155117766/ai-question-navigator-extension

开发过程也很简单：直接打开codex，输入你的需求：

等待codex为你开发完，后续所有不懂的都可以直接问他，包括怎么安装，在哪里安装，如何提交到github让其他人也下载,等等。

一、这个插件是怎么来的？

如果你经常用 ChatGPT、Gemini 这类 AI 工具，你一定懂这个场景：

一开始只是问一两个问题，没什么感觉。但一旦对话变长，十几轮、二十几轮、甚至几十轮以后，问题就来了：

• 我之前那个问题到底问了什么？
• 那条关键提问在哪一段？
• 我是不是已经问过类似问题了？
• 我想回到刚才那一轮，只能一直往上滑……

尤其是当我们把 AI 当成工作搭子、写作助手、产品顾问、学习教练时，对话其实已经不是聊天，而是在处理一个不断展开的思考过程。

但现在大多数 AI 产品的对话界面，本质上还是聊天流。

它适合往下看，不适合往回找。

所以我当时就想：

有没有可能做一个很轻的插件，只抓“用户自己提过的问题”，然后在右边做一个目录导航？

这样用户就不用反复往上翻了。

二、我为什么会做这个插件？

说实话，一开始我并不觉得自己是那种会做插件的人。

我不是传统意义上很强的前端工程师，也不是那种一上来就能从零手搓浏览器扩展的人。

但最近这段时间，我越来越明显地感受到一件事：

AI 真的在降低“把一个想法做出来”的门槛。

以前我们脑子里有个产品念头，可能会卡在这些地方：

• 不会写代码
• 不知道插件结构怎么搭
• 不知道浏览器扩展怎么发布
• 不知道 DOM 怎么抓
• 不知道 GitHub 怎么推

但现在，很多问题已经可以边做边问、边改边调。

我越来越喜欢一种状态，叫：

先别想“我会不会”，先想“我能不能把第一个版本做出来”。

这个插件就是这么出来的。

它不是一个宏大项目。它没有什么复杂商业模式。但它是一个非常真实的“小需求被认真做出来”的例子。

而我觉得，这种事情本身就很有价值。

三、这个插件到底解决了什么问题？

一句话概括：

它帮你在长对话里，只保留“你自己问过的问题”，并整理成右侧导航。

具体来说，它现在能做这些事：

• 自动识别当前是 ChatGPT 还是 Gemini
• 抓取并结构化“用户已发送的问题”
• 在右侧生成问题目录
• 点击目录，快速跳转到对应提问位置
• 对长对话依然保持可用

它刻意不做很多复杂功能，比如：

• 不显示 AI 回答目录
• 不做全文搜索
• 不做知识库
• 不做总结归档
• 不搞一堆花里胡哨的面板能力

我当时非常明确地告诉自己：

这个插件只做一件事，就是找问题。

因为很多产品失败，不是因为做得不够多，而是因为第一步就做得太杂。

四、这个过程最有意思的地方，不是写代码，而是不断发现真实问题

做这个插件的过程，其实很像在和真实场景对话。

一开始我以为这个事很简单：

“无非就是抓一下页面上的用户提问，再做个侧边栏。”

但真做起来，问题一个接一个：

1. 平台之间 DOM 结构完全不一样

同样是 AI 对话页，ChatGPT 和 Gemini 的页面结构、消息容器、滚动方式都不同。

2. 长问题会被拆分

有些长提问在页面里并不是一个干净节点，而是多个片段。

3. 新建会话时会残留上一轮数据

如果不仔细处理会话状态，用户打开新窗口，右侧导航可能还显示旧记录。

4. 点击跳转不是总能跳准

尤其是 Gemini 长会话、多条相似问题时，点最后一条可能跳到第一条。

5. 定位到了，但不一定定位得“舒服”

有时候虽然跳到了对应问题，但页面停留的位置是问题中间，不是开头，体验依然不对。

你会发现，真正决定一个小工具有没有用的，常常不是“有没有这个功能”，而是这些细小但真实的边角问题有没有被处理好。

这也是我做完之后最大的感受：

产品体验不是靠“功能列表”堆出来的，而是靠一堆用户会真实遇到的小麻烦，一点点磨出来的。

五、对我来说，这不是写了一个插件，而是完成了一次很具体的产品练习

我后来回头看，会发现这件事最有价值的地方，不只是插件做出来了，而是我完整走了一遍这种路径：

1. 从一个真实痛点出发
2. 先定义极小 MVP
3. 只保留核心功能
4. 真实使用、真实发现 bug
5. 一边修，一边收敛边界
6. 最后把它发到 GitHub，让别人也能用

这其实就是一个非常典型的产品闭环。

很多时候我们会觉得，做产品一定要从大处着眼。但这次我更深的感受是：

一个很小、很具体、很“有人会用”的工具，本身就已经是产品。

不一定非要宏大。不一定非要融多少资。不一定非要先讲一个特别大的故事。

能把一个真实问题解决掉，本身就已经很了不起了。

六、如果你也是小白，我特别想告诉你一件事

以前我也会觉得：

• 我不会前端
• 我不会做插件
• 我不会 GitHub
• 我不会上线
• 我可能做不出来

但这次做完以后，我反而更相信一件事：

现在这个时代，很多普通人第一次做产品的方式，不是先学完再开始，而是先开始，再边做边学。

尤其是有了 AI 之后，很多原本很陡的门槛，真的已经变平了很多。

当然，它不会让你一夜之间变成专家。它也不会替你做判断。它更不会自动帮你把产品做对。

但它确实能让你：

• 少卡很多技术细节
• 更快验证想法
• 在真实反馈里迭代
• 把“想做”变成“真做了一个版本”

这对普通人来说，已经非常重要了。

七、这个插件现在长什么样？

它现在是一个 Chrome / Edge 浏览器插件，支持：

• ChatGPT
• Gemini

使用方式也很简单：

安装后，在对话页右侧会出现一个小小的“导航”按钮。鼠标移上去，就会展开问题目录。

目录里只显示：

你自己问过的问题。

不是 AI 回答，不是系统提示，不是草稿输入，而是你已经发出去的提问。

你点某一条，就能尽量回到对应问题的位置。

这听起来不算惊艳。但如果你真的每天和 AI 深度对话，它会非常实用。

八、我把它放到 GitHub 了，欢迎你去试试

仓库地址：

https://github.com/1155117766/ai-question-navigator-extension

如果你也经常在 ChatGPT 或 Gemini 里做长对话，我很欢迎你去试试。

九、最后想说一句

这不是一个多伟大的项目。但它是一个我觉得很“活”的项目。

因为它不是为了展示技术而做，而是因为我自己真的被一个小问题反复困扰过，然后决定把它认真解决一下。

我越来越觉得，好的产品起点常常就是这样：

不是我要做一个很大的东西，而是这个问题让我有点难受，我想把它处理好。

如果这篇文章也刚好让你冒出一个念头：

“诶，我是不是也可以把自己工作里那个小烦恼，做成一个小工具？”

那它就已经很值了。

感谢您读到这里，如果您喜欢今天的内容，不妨点个关注，成为我们成长路上的同行者。期待在下一篇文章里，继续与您分享、共同成长。