フリーランス 技術調査ブログ

フリーランス/エンジニア Ruby Python Nodejs Vuejs React Dockerなどの調査技術調査の備忘録

Chrome拡張機能を利用できるようにするための設定

はじめに

  • 先日作成した住所検索をChrome拡張機能として利用できるように設定する

px-wing.hatenablog.com

フォルダ構成

  • 前回作成したフォルダ構成は下記のような構成となっている
C:.
└─address_search
       form.html
       jquery.min.js
       manifest.json
       zipcodeSearch.js

Chromeの設定

  • ブラウザを起動させて、メニューから「設定」を選択する f:id:PX-WING:20201109084450p:plain

  • 画面右側にあるメニューから拡張機能を選択する f:id:PX-WING:20201109084223p:plain

  • パッケージされていない拡張機能を読み込むボタンをクリックして作成したフォルダを選択する。 f:id:PX-WING:20201109085152p:plain

  • Chrome拡張機能として登録されることを確認する f:id:PX-WING:20201109085647p:plain

実際に利用してみる

  • 追加したアドオンを選択する f:id:PX-WING:20201109085910p:plain

  • chrome拡張機能として動作していることを確認できる f:id:PX-WING:20201109090009p:plain

実際に一般に公開する場合

  • 下記のサイトを参考に登録することができます。 support.google.com qiita.com

  • 登録するには5ドルの支払いが必要なのでやめる。 f:id:PX-WING:20201109090832p:plain