#navi_header|技術|

前から作ってみたい簡単なChrome拡張のアイデアがあったので、Chrome拡張作るのの勉強に、作ってみた時のメモ。

やりたかったこと：

そのウィンドウで開いてるタブの、タイトルとURLを、あるフォーマットにしたがって一覧化したい。
技術系のblog書いてる時とかに、参考URLのリストを、開いてるタブから集約したい時に使う。

chrome.tabs.query()で現在ウインドウのタブの一覧を取り出せる：
- chrome.tabs - Google Chrome
-- https://developer.chrome.com/extensions/tabs#method-query

また、フォーマットはカスタマイズ出来るようにしたい。
→インストール時に初期化して、オプションページで保存したり、デフォルトに戻したりしたい。
→localStorage + backgroundのeventpageで実現できた。

ソース：
https://github.com/msakamoto-sf/copy_tab_urls

Chromeストア：
https://chrome.google.com/webstore/detail/copy-tab-urls/dpddcgncoldfnleboobgkogkjnbdofce

----
以下、参考URL

入門系：
- Chrome Extension を作って公開する - Qiita
-- http://qiita.com/sqrtxx/items/19fd2114430e9e1fb57f
- Google Chrome拡張の作り方（その1：マニフェストファイル作成とパッケージ化）: 小粋空間
-- http://www.koikikukan.com/archives/2014/06/03-012345.php
- Google Chrome拡張の作り方（その2：browser_actionを使ったアイコン表示）: 小粋空間
-- http://www.koikikukan.com/archives/2014/06/05-015555.php
- Google Chrome拡張の作り方（その3：ポップアップ表示とバックグラウンドスクリプトとの連携）: 小粋空間
-- http://www.koikikukan.com/archives/2014/06/12-025555.php
- Google Chrome拡張の作り方（その4：オプション画面と保存データのバックグラウンド・ポップアップとの連携）: 小粋空間
-- http://www.koikikukan.com/archives/2014/06/19-005555.php
- Getting Started: Building a Chrome Extension - Google Chrome
-- https://developer.chrome.com/extensions/getstarted

manifest.json:
- Manifest File Format - Google Chrome
-- https://developer.chrome.com/extensions/manifest#icons

デバッグ方法：
- Tutorial: Debugging - Google Chrome
-- https://developer.chrome.com/extensions/tut_debugging
- chromeの拡張機能をデバッグする際のメモ - うぇっぶぷろぐらまーになりたい日記
-- http://d.hatena.ne.jp/ganr/20120316/1331887322

拡張のサンプル沢山：
- Sample Extensions - Google Chrome
-- https://developer.chrome.com/extensions/samples

設定をlocalStorageに保存：
- localStorageをつかってエクステンションの設定を管理する - 心魅 - cocoromi -
-- http://umezo.hatenablog.jp/entry/20091115/1258291572
- Google Chrome extension上で、localStorageの中身がundefined - QA@IT
-- http://qa.atmarkit.co.jp/q/3031

インストールやアップデートされた時に何かしたい（イベント）：
- Event Pages - Google Chrome
-- https://developer.chrome.com/extensions/event_pages
--- 以前はbackgroundページとなってたのが、イベントページという概念にアップデートされたっぽい。アクセスAPIも変わってる。
- chrome.runtime - Google Chrome
-- https://developer.chrome.com/extensions/runtime#event-onInstalled
- Detect Chrome extension first run / update - Stack Overflow
-- http://stackoverflow.com/questions/2399389/detect-chrome-extension-first-run-update


公開への流れ：
- Publishing Your App - Google Chrome
-- https://developer.chrome.com/webstore/publish


#navi_footer|技術|