どんぶらこと「Chrome Extension作りたい欲」が流れてきた（１）
学生時代、履修した授業の5段階評価アンケートにWEBで回答するという儀式が毎学期末にあったのですが、
技術に尖っていた先輩が「いちいち手で選ぶの面倒くさい」ということでChromeの拡張機能を自作し 、各評価項目のラジオボタンをランダムに選択して提出できるものを作っておられて感動したのを覚えています。（実際に使用されていたのかまでは把握していませんが。）
あの感動から約10年、突然川上の方からどんぶらこと「Chrome Extension作りたい欲」が流れてきたのでやってみた記録です。
(n番煎じ感はありますが・・・)
たどり着きたいところ
スケジュールの話をするときにいちいちカレンダーアプリを開くのが面倒なので、
Chrome Extensionで簡単なカレンダーを開けるようになる！
Nice to have： やれたらいいけど今は優先度低めなこと
- ReactやVueを使って書いてみる？
- そのカレンダー上で予定を登録できるようにする？？
- そのほかリッチな機能の実装
- 実際にweb storeで公開する($5かかるらしい)
今回のゴール
公式にGetting startedがあるのでやってみる！
とりあえずはじめてみる
Extensionをつくるのに必要なものは、以下の4つでした
- jsファイル
- css ファイル
- html ファイル
- manifest.json: 「どんな拡張機能か」を記載しておく定義書のようなもの
※ 執筆時点ではmanifest v3の形式でmanifest.jsonを記述しています。
もちろん、実装する機能によってサイズ感や難しさは変わると思いますが
Extensionはとてつもなく特殊な方法で作られているのかなと勝手に思い込んでいたので、普通にwebページを作る感覚で作り上げることができるんだなーというのが最初の印象です。
できた！
ということで、Getting startedに載っているコードをそのままコピペするだけで、こんな感じのOptionメニュー付き Extensionを作ることができました！
特に詰まってしまうところはなくて、ゆっくりやっていましたが所要時間は1時間程度で形にすることができました。
「あれ、書いてあるとおりに動かないぞ・・・？」となるときは、だいたい拡張機能管理画面の更新ボタンを押し忘れているときでした。
次回は・・・
popup.htmlの要領で、カレンダーを表示するものを作ってみようと思います！
今回実際に書いたコード。フォルダ構成を若干変えていますが、ほぼ公式ページに載っているコードそのままです。
