浏览器插件:从想法到发布
浏览器插件跟软件客户端很相似。客户端让操作系统更易用,插件让浏览器更好用。
本系列将从方便用户复制网页内容这一想法切入,用「最小可行知识」(MVK)实现「最小可行原型」(MVP)并逐步完善CopyQ这个插件,同时一步步深入浏览器开发。
目前章节
第一个插件:
- 课前准备:下载并加载模板
- 一个开关:模板代码解释
- 插入脚本:复制攻防战
可能会写的内容:
- 插件的各种界面交互分析
- 登录
- 对接外部接口(不要将api_key之类的密钥放到插件代码中!)
- 图标(需要比AI画图标更详细)
- 提问之前:遇到问题怎么办
- 插件发布
- 其他常用插件特性
- 国际化
- 通知
- ……
目标读者
有一定前端基础,希望做一个浏览器插件的人,使用国内网络。
有前端基础意味着:
- HTML(必须)。一种排版方式,至少要懂:元素、标签、属性、链接、DOM等概念。一份HTML文档是一棵“树”;
- CSS(可选)。如果把HTML比作用默认方式堆叠的积木,那么CSS是重新堆叠积木的语言。本教程不关注界面的美观,CSS也就很次要,而且确实有的插件是不需要CSS的。但功能复杂起来后,一般都会有;
- JavaScript(必须)。让“积木”动起来的关键。至少明白变量、函数、循环、JSON、库等概念,写出相关代码。遇到不会的点,懂得翻文档或问AI。最好懂 npm 管理。
对了,代码编辑器用自己喜欢的就好,Vscode、Zed、Sublime这些都不错。如果你实在不知道去哪下载,而你电脑又是Windows系统,可以考虑我编译的Zed,点击即可下载zip
文件,解压出来exe
,双击即可运行。
国内网络意味着:
- 项目相关代码托管到gitee;
- 推荐阅读文档要考虑到国内可访问性;
- 发布渠道相关文章选择Edge为示例、而不是Chrome。
常见问答
为什么要写这个系列
- 试试纯国内网络环境下,能不能完成浏览器插件的开发
- 整理自己所学的同时,也促进个人学习。比如,我发现以前很多文档没看过,发现Chrome跟Edge都提供了文字转语音(tts)的接口……
多久更新一篇?
已知:2024年5月12日确定要写,5月23日写完(复制攻防战第一轮),5月27日完成(复制攻防战第二轮)
正经回答是,看我业余时间与大伙反馈。
有学习交流群吗?会开课吗?
微信不太适合交流代码,有问题在gitee上问吧。暂无开课打算。