自作Chrome extension紹介
自己紹介
- @kyo_ago
- Scala, TypeScript, LocalProxy, ApplicationCache
- Chrome apps, extension合わせて20個くらい作成
（エンジニア向け）自作Chrome extension紹介
皆さんサイトを見るときはまずJSを読むと思うんですが
毎回ChromeのDevTools開いたりするの面倒ですよね
contextmenu-source
- 右クリックメニューからそのサイトが読み込んでいるJS、CSSを開く
- どこのドメインから読み込んでるかもわかりやすい
- 読み込み判定は結構確か（DevToolsと同じくらい）
- パフォーマンスにも配慮（event page）
やった！これですぐJSが読める！
でも、ブラウザ上だとJSって読みにくい。。。
それに読むだけじゃなくて書き換えて実行したりもしたい
source-editor
- ブラウザのJS表示する画面にACE Editorを仕込む
- エディタ上からJSを書き換えるとサイト上のJSも変わる
- シンタックスハイライトもある
- Lintもついてる
- 安心のVim, Emacsモード搭載
さあ、これで初めて訪れるサイトも安心ですね！
しかし、サイトによっては右クリックメニューを禁止してるサイトも。。。
Enable right click
- 右クリックメニューを禁止してるサイトの右クリックを使えるようにする
- 右クリックメニュー殺し殺し
- 独自の右クリックメニューを設定しているサイトとも共存可
もう何も恐くない
時間があればついでに小物もいくつか
copy-base64
- 画像の右クリックメニューに「Copy base64」を追加
- 右クリックメニューへの追加は画像クリック時だけなので、余計なメニューが増えない
- data scheme形式なのでそのまま使える
- クリップボードコピーなので扱いが楽
全角半角変換
- フォームの右クリックメニューに「全角へ変換する」、「半角へ変換する」を追加
- 右クリックメニューへの追加はフォームクリック時だけなので、余計なメニューが増えない
- 「住所は全角で入力してください」対策
background-search
- 文字選択時の右クリックメニューに「Googleで検索する」を追加
- 右クリックメニューへの追加は文字選択時時だけなので、余計なメニューが増えない
- タブの遷移なしに裏のタブで検索できる
なぜChrome extensionを作るのか
なぜChrome extensionを作るのか
- サイトはかなりアプリに近づいている
- ブラウザもOSに近い存在になっている
- ブラウザを拡張できることはOSを拡張できることに近い
- Webアプリは拡張で手を入れやすい
- 欲しい機能を簡単に追加することができる
extensionは次の世代のdaemon
ご清聴ありがとうございました
