Chrome拡張TabTabTabをReact/TypeScriptでリニューアルしました
TabTabTabとは
開いたタブを管理しやすくするためのChrome拡張です。
以下のように、ウィンドウごとに開いているタブを一覧することができ、選択したタブに移動したりタブを削除したりすることができます。
リニューアルでやったこと
今回のリニューアルでやったことは以下の2つです。
- UIの大幅刷新
- Chrome89から使えるようになったグループ化タブに対応
特にUIを刷新するにあたり、React/TypeScriptを導入し、UIフレームワークにMaterialUIを使用しました。今まではJSを使って直接DOMを操作していたので、かなり開発がしやすくなりました。
ちなみに前のバージョンのUIはこんな感じでした。
テンプレート化
上記のようなReact/TypeScriptなChrome拡張開発環境をすぐに構築できるようにテンプレート化しました。READMEに使い方を書いているのでぜひ使って自分なりのChrome拡張を作ってみてください！
