侧边笔记,常伴左右:我用 Claude Code 开发了一个浏览器插件

最近我做了一个小工具:SlideNote,中文名「侧边笔记」。这是一个谷歌浏览器插件,可以在浏览器的右侧开辟一个记录区域,方便用户进行快速记录。

开发这个插件的想法源于我自己的真实需求。

1. 我的痛点

作为一名开发者,我经常需要快速记录一些临时信息:常用的命令、API 密钥、服务器 IP 地址,甚至是一些零散的灵感。

这些信息存在哪里最方便?有些人用系统便签,有些人用专门的笔记软件。但我每天工作,浏览器是花时间最多的地方。为了追求「最短路径」,我选择把信息都存在一个浏览器插件里。

这个插件我用了两年多,它简单、稳定,没有花哨的功能。

图 1:我之前用的笔记插件

但上周,我越用越不舒服。

为什么呢?因为这个插件是「阻断式」的——打开它,整个网页就被遮住了,你只能在插件里操作。复制一条信息,关闭插件,粘贴到网页,想再复制另一条——又要重新打开插件。

来来回回,严重打断了我的工作流。

2. 解决方案

与此同时,我发现 Chrome 去年新增了一个功能:侧边栏(Side Panel)

插件可以不再占据整个页面,而是在浏览器右侧留出一片独立空间。点击插件图标,侧边栏滑出;点击网页,侧边栏收起——两者互不干扰。豆包和一些 AI 助手已经用上了这个特性。

图 3:Chrome 侧边栏特性

那我为什么不做一个自己的笔记插件呢?说干就干。

Claude Code 的帮助下,仅用两天时间,SlideNote 就诞生了。

3. 什么是 SlideNote

SlideNote 是一个 Chrome 浏览器侧边栏笔记插件。

点击图标,侧边栏展开,采用左右分栏布局:左边是笔记列表,右边是笔记内容。点击即可切换,复制粘贴不再被打断。

它有两个核心特点:

  • 第一,极简轻量。
    打包后只有 24KB,没有框架依赖,加载速度小于 100ms。安装即用,不需要注册登录。

  • 第二,云端同步。
    数据基于 Chrome Storage API,存储在您的 Google 账号下。换一台电脑,登录同一个 Google 账号,笔记自动同步。
    数据都在本地和谷歌云端,不存在第三方服务器,保障隐私安全。

最后,一个承诺:保持简单。

SlideNote 是便利贴,不是笔记本。所以它不会有:

  • ❌ 复杂的标签分类
  • ❌ 知识图谱、双向链接
  • ❌ 协作分享、版本历史
  • ❌ 跨平台笔记客户端

它只做一件事:让你在浏览器里,快速记录、随时取用碎片信息。如果你需要写长文章、整理知识库,用 Notion、Obsidian 等更合适。

4. 适用场景

除了开发者场景,SlideNote 还有很多用武之地:

  • AI 提示词管理。
    在 DeepSeek、Claude 等 AI 工具里,您可能有常用的提示词模板。放在侧边笔记里,用时复制粘贴,修改一下主题就能发送。

  • 学习时记笔记。
    在 B 站看视频学习,一边看视频,一边在侧边记笔记。左边播放,右边记录,体验很好。

图 4:一边看视频一边记笔记

  • 运营人员的信息管理。
    客户信息、账号密码、文案模板、素材链接,都可以放在侧边笔记里,随时取用。

5. 其他特性

我还顺手做了几个实用的小功能:

  • Markdown 支持——输入 Markdown 语法,实时渲染预览。
  • 富文本复制——复制带样式的文本,可直接粘贴到其他应用。
  • 搜索过滤——实时搜索标题和内容。
  • 自动保存——停止输入 1 秒后自动保存。

图 5:Markdown 预览模式

目前是 v0.0.5 版本,后续也会根据自身需求持续优化,但这个工具一定会保持简单,不会变得复杂。

6. 如何安装

SlideNote 已经上架 Chrome 应用商店。

方式一:在线安装(推荐)
点击这里前往 Chrome 应用商店,点击「添加至 Chrome」即可安装使用。

方式二:本地安装
下载地址:https://gudong.s3.bitiful.net/asset/SlideNote-v0.0.5.zip
或者从 GitHub Releases 下载安装包,解压后在 chrome://extensions/ 开启开发者模式,加载解压后的文件夹即可。

方式三:从源码构建

然后加载生成的 dist 文件夹到 Chrome 扩展程序。

7. 写在最后

SlideNote 的 Slogan 是「侧边笔记,常伴左右」。

它解决的是我的一个小痛点,但也可能帮到更多人。如果你也需要在浏览器里快速记录、随时取用信息,不妨试试。

目前支持 Chrome 浏览器,微软 Edge 应该也可以。国内浏览器暂未测试,推荐用 Chrome 体验。

项目已开源,GitHub 链接

如果觉得有用,欢迎给个 Star,也推荐给有需要的人。


我是咕咚,好工具,值得被更多人看见。

关于咕咚
inBox 笔记 作者 | 独立开发者 | AI 编程实践者

爱开发,爱分享。
在这里,持续分享有价值的 AI 实践与开发感悟。
关注我,一起探索「对话式编程」的实践与思考。

排版 by weimd