停止重复编写相同的 Dev Helpers:改为构建 Browser Toolbelt
I’m happy to translate the article for you, but I’ll need the text you’d like translated. Could you please paste the content (or the portion you want translated) here? I’ll keep the source line and all formatting exactly as you request.
情况
很长一段时间,我的开发生活是这样的:
- 打开编辑器。
- 打开文档。
- 在本周第五次 “online JSON formatter” 上搜索。
- 编写另一个我知道某处有但找不到的微小辅助脚本。
这些任务都不难:
- 格式化或验证 JSON
- 在 CSV ↔ JSON ↔ XML 之间转换
- 生成测试数据
- 转换时区
- 解码一些奇怪的 token 或 Base64 数据块
但它们是 持续的 – 千百个微小助手导致的死亡。
洞察
有一次,我意识到我的问题不在于技能。
问题在于,我把每个小任务都当作一次性的 one‑off,而不是可重复工作流的一部分。
于是,我不再尝试单枪匹马,而是为自己打造了一个 browser toolbelt。
“如果一个任务是重复的、机械的且容易出错,我会尽量不去用全新的脚本来解决它。”
我现在遵循的规则
当我需要一个助手时,我会问三个问题:
- 我以前解决过这个问题吗?
- 是否已有稳定的工具可以做到这一点?
- 这真的需要放在仓库里吗?
如果答案是“没有,我只需要一个可靠的助手”,我就会使用浏览器工具箱。
从搜索历史到真实的工具带
之前
format json online
csv to json
utc to est converter
url decode online
每次会话:相同的搜索,稍有不同的网站,新的弹窗和布局。
问题
- 行为不一致。
- 我从未形成肌肉记忆。
之后
- 为每个重复的任务挑选一个工具。
- 将其收藏在 “Dev Toolbelt” 文件夹中。
- 每次都使用同一个工具。
文件夹一旦建立,添加和删减工具就变得自然。
核心类别 & 推荐工具
JSON(常见的痛点)
- 格式化器 / 验证器 – 让我能够真正阅读 payload。
- 差异工具 – 对比两个 JSON 块。
- 转换器 – JSON ↔ CSV ↔ XML。
如何覆盖
- IDE 格式化器(例如 VS Code、IntelliJ)
- 像
jq这样的 CLI 工具 - 一个可信赖的在线格式化/转换工具
关键是停止四处寻找,每次使用同几款工具。
真实的测试数据
我过去会用 test@test.com 和 John Doe 来“测试”,结果真实数据一出现就把一切弄崩。
现在我把真实的测试数据视为 一等工具:
- 用于代码的 Faker 风格库
- 用于 CSV/JSON 列表的简单生成器
- 一个可以复用的共享样本数据集
工作流: 生成 → 导出 → 导入 → 复用。
测试数据越真实,遇到的奇怪生产 bug 就越少。
时区转换
时区问题可以消耗整个下午。我会混合使用:
- 语言特性 & 库(例如
moment、date-fns、pytz) - MDN 或官方文档
- 一个友好的在线转换器进行 sanity check
我再也不会在脑子里算时区了;每次都把它们交给同一小套工具处理。
编码 / 哈希
我把以下内容集中在一个地方:
- Base64 编码/解码
- URL 编码/解码
- HTML 实体
- 快速哈希检查(MD5、SHA‑1、SHA‑256)
大多数可以用标准库或 openssl 完成。
我仍然喜欢在离开主机时使用熟悉的浏览器工具进行快速检查。
浏览器工具的防护措施
- 永远不要将生产环境的机密或实时客户数据 粘贴到随机网站。
- 优先选择明确声明在浏览器中处理数据的工具(无服务器往返)。
- 对于敏感工作流,考虑 自托管或内部工具。
如果在事后报告中解释起来尴尬,那么它就不应该出现在公共工具中。
AI Helpers – Complement, Not Replacement
Great for
- Sketching one‑off scripts
- Exploring unfamiliar APIs
- Explaining confusing stack traces
Not a full replacement because
- AI can be confident but wrong.
- It may use outdated or insecure patterns.
- Results can change from run to run.
A small, deterministic toolbelt still wins for:
- Quick format / convert / validate jobs
- Reproducible workflows you can share with the team
- Situations where you cannot paste data into an AI system
My approach: use AI around the toolbelt, not instead of it.
当浏览器工具带不足时
需要采用不同方法的迹象:
- 任务必须在 CI 或每次 部署 时运行。
- 逻辑 特定于你的业务规则。
- 需要 状态、历史记录或高性能工作。
这些问题应当使用正式的代码、测试和审查来处理。
对我而言,工具带适用于 无状态、重复性、机械性的任务。
入门 – 快速计划
- 列出您最常遇到的五大烦恼。
- 对每个烦恼,挑选一个您喜欢的单一助手(在线或 CLI)。
- 在浏览器中创建一个 “Dev Toolbelt” 书签文件夹。
- 添加这些链接并将文件夹固定,便于快速访问。
- 持续一周,在编写新助手之前先使用工具带。
可选扩展
- 在浏览器中添加自定义搜索关键词。
- 固定一个始终打开的 “toolbelt” 标签页。
- 与团队共享此列表并邀请建议。
从三个可靠的工具开始,而不是三十个。只有在您多次感受到相同痛点后才添加更多。
我遇到的常见错误
- 试图在一次会议中构建一个 “完美”工具带。
- 重新实现已经存在且运行良好的工具。
- 让所有东西都依赖于 个人怪癖,而其他人无法理解。
- 从不修剪文件夹中旧的或损坏的工具。
**保持标准简单:**这个工具是否在实际工作中可靠地为我节省时间?如果不是,就去掉它。
维护 – 季度清理
每个季度,我会在书签文件夹里花十分钟:
- 移除我不再使用的工具(或已变得不可靠的工具)。
- 更新链接,如果服务更改了 URL 或 UI。
- 添加新助手,以应对任何新出现的重复性痛点。
(原始笔记被截断:“Remove tools I no lo…”。其意图是移除我不再需要的工具。)
进一步阅读
如果你对我自己的浏览器工具带的具体、链接丰富的版本感兴趣,请查看权威文章:
Computer Programming Made Easier – CodersTool Blog
祝使用工具愉快!
精简我的浏览器工具带
替换任何感觉慢或不可靠的东西。
添加一两个在过去几个月里被证明有用的助手。
这种小清理让工具带保持轻便,而不是臃肿。
这就是我如何从随意的标签页和临时助手,转变为一个安静地为我每月节省数小时的精简浏览器工具带。
Your Turn
在日常开发工作中,你离不开的工具是什么?
你会像这样保持一个工具箱,还是所有东西仍然藏在搜索历史和旧仓库里?
在评论中分享你的必备工具——我很想偷几个好点子来完善我的配置。