最初のChrome拡張「Hello, World」

　ちょっと思うところあってChrome拡張に手を出してみることにしました。

　とりあえずはお約束のHello Worldから。Chrome拡張は以下の3つで作ることができます。作業フォルダを用意して以下の構成を準備します。HTMLとマニフェストファイルはテキストファイルで、アイコン画像はテキトーに自作しました。

• フォルダ(任意のフォルダ名)
  • HTMLファイル.html(任意のファイル名)
  • manifest.json(JSON形式のマニフェストファイル)
  • アイコン画像ファイル.png(16x16ピクセルのPNG画像、任意のファイル名)

popup.html

<P><strong>Hello World!!</strong></p>

manifest.json

{
	"name":"はじめてのChrome拡張",
	"version":"1.0",
	"description":"いつもおなじみHello World",
	"browser_action":{
		"default_icon":"favicon.png",
		"popup":"popup.html"
	},
	"permission":[
	]
}

　Chromeの「Google Chromeの設定(スパナのアイコン)」から「ツール」＞「拡張機能」を選択。

　ウィンドウ右上の「デベロッパーモード」をクリック。

　表示された内容から「パッケージ化されていない拡張機能を読み込む」ボタンをクリック。先ほど資材を置いたフォルダを選択します。

　マニフェストファイルで書いた内容が拡張機能リストの一番上に追加されれば準備OK。この時点で拡張機能のアイコン群の中にオレの描いたみすぼらしいアイコンが混ざって表示されています。

　実際にクリックすると「Hello, World」が吹き出し表示されます。ねっ、簡単でしょ？

　Chromeとテキストエディタがあれば割と簡単に開発が始められるのが気楽で良いですね。基本はHTML / JavaScript / CSSで作れるようなので、それほど新しい技術を覚える必要もありません。う〜ん、こんな手軽なおもちゃがあったとは。

　当面はこれで色々トライしてみたいと思います。最終的には何か公開してみたいなぁ。