2020最新Chrome插件开发指南

现如今,谷歌(Google)Chrome已经在浏览器市场占据60%左右的份额。如此巨大的用户和流量,我们可以在Chrome的基础上开发一些属于我们的应用,并且可以帮助到用户,那将是一笔巨大的财富。

的确如此,Chrome Store可以看到很多使用的应用。你可以在Chrome Store看到很多意想不到的应用。

开发前的准备

Javascript

在开发Chrome插件之前,首先必须了解Javascript。

Javascript是一种在浏览器上最常用的脚本语言。在我们的示例插件中,我们将会大量运用Javascript。我们不在这里对Javascript做过多的解读,以免对初学者造成困扰。

我们将在这个示例插件中,结合Jquery框架来编写。如果想了解更多Jquery,请点击这里

Bootstrap

Bootstrap是目前前端用的比较多的框架之一,我们在Chrome示例插件中,也将运用Bootstrap。如果你偏爱其他Html、CSS框架,也是可以选择的。

Fontawesome

Frontawesome是目前前端大量使用的图标框架,在Chrome示例插件中,我们选择Fontawesome。

gulpjs

gulpjs是目前使用比较广泛的Javascript开发的工具,可以对Html、CSS、Javascript文件进行拼接、压缩等。如果你还没听说过,赶紧去了解一下吧。

handlebarsjs

可能你还没听说过handlebarsjs,这是一个基于Javascript的模板化工具,去了解一下吧,绝对不容错过。

有什么用?不如先看看这里,你大概就知道了。

不错的组合,这样我们就可以通过gulpjs去压缩Html模版文件了。

NodeJS & NPM

在Chrome示例插件中,我们会大量使用NPM仓库中的代码。不需要重复造轮子,多么开心的一件事情。想了解更多NodeJS?还是以后通过具体项目了解吧。

Yii2 Framework

这里怎么会出现PHP的东西?如果你的Chrome插件需要用户注册、OAuth2授权、存储用户数据等,那么必不可少的需要服务端的支持。Yii2是你快速构建服务端不错的选择。更喜欢其他框架?LaravelCodeigniter?你喜欢就行。

XAMPP

XAMPP是免费的Apache+MariaDB+PHP+Perl本地测试环境,还等什么呢?我本人在Windows上使用的就是XAMPP,在MAMP Pro。当然MAMP Pro是收费的。

Github

如果你还不知道Github是什么,赶紧去看看吧。无论你做什么类型的项目开发,你都需要一个代码仓库。世界上没有比Github更出色的了。

而且Github全免费。

代码编辑器

如果你还不知道使用哪一款编辑器,请看2020年最好的代码编辑器,总有一款代码编辑器适合你。


一切准备就绪,我们将会给你带来Chrome插件开发的具体步骤。

已经忍不住开发Chrome插件应用的冲动了?先看看官方的开发文档吧

在一起开始前,不要忘了安装Chrome

发表评论

电子邮件地址不会被公开。 必填项已用*标注