スポンサーリンク

GitHub のリポジトリ内に、ファイルサイズが表示されるようにする Google Chrome 拡張機能「GitHub Repository Size」

GitHub Repository Size Google Chrome

今日は、GitHub のリポジトリ内に、ファイルサイズが表示されるようにする Google Chrome 拡張機能「GitHub Repository Size」を紹介しようと思います。

「GitHub Repository Size」は、GitHub のリポジトリ内に、ファイルサイズが表示されるようにする Chrome 拡張機能です。

通常、GitHub のリポジトリ内では、各ファイルの

  • 名前
  • 説明
  • 更新日時

が表示されるのみですが、ここにファイルサイズも表示されるようにすることで、各ファイルがどのくらいのサイズであるのかを一目で判別できるようにしてくれます。

デフォルトでは、ファイルサイズが表示されない

デフォルトでは、ファイルサイズが表示されない

リポジトリ内に、各ファイルのサイズが表示されるようになる

リポジトリ内に、各ファイルのサイズが表示されるようになる

基本的にインストールするだけで使える拡張機能で※1、ファイルサイズに加えてディレクトリサイズも表示できるようになっています。
(ただし、ディレクトリサイズを表示するには、手動のクリック操作が必要となる)
※1 プライベートリポジトリ内のファイルサイズを表示できるようにする場合、トークンの生成と登録作業が必要になる。

ほんのちょっとした機能ではありますが、あると地味に便利だと思います。

ダウンロード

GitHub Repository Size の使い方

  1. まず、「GitHub Repository Size」をインストールします。
  2. 自動的に、「GitHub Repository Size now supports private repositories through Github personal access tokens. Do you want to add a token?」というダイアログが表示されます。
    GitHub Repository Size now supports private repositories through Github personal access tokens. Do you want to add a token?

    GitHub Repository Size now supports private repositories through Github personal access tokens. Do you want to add a token?


    プライベートリポジトリ内でもファイルサイズを表示できるようにしたい場合は、「OK」ボタンをクリック… しますが、プライベートリポジトリにアクセスするにはトークンの生成が必要になるので、ここはとりあえず「キャンセル」をクリックします。
  3. 続いて「You can click extension icon to set a token」というダイアログが表示されるので、「OK」ボタンをクリックします。
    You can click extension icon to set a token

    You can click extension icon to set a token

  4. 以降、GitHub のリポジトリ内に、リポジトリのサイズと各ファイルのサイズが表示されるようになります。
    リポジトリ内に、リポジトリのサイズと各ファイルのサイズが表示されるようになる

    リポジトリ内に、リポジトリのサイズと各ファイルのサイズが表示されるようになる

    ディレクトリサイズも表示させたい時は、リポジトリサイズの部分をクリックしてください。

    ディレクトリサイズも表示させたい時は、リポジトリサイズの部分をクリックする

    ディレクトリサイズも表示させたい時は、リポジトリサイズの部分をクリックする

    ディレクトリサイズが表示された

    ディレクトリサイズが表示された

目次へ戻る

プライベートリポジトリ内でも、ファイルサイズを表示できるようにする

  1. GitHub にサインインした状態で、Personal access tokens のページを開きます。
  2. 「Personal access tokens」という画面が表示されるので、画面右上にある「Generate new token」ボタンをクリックします。
    画面右上にある「Generate new token」ボタンをクリックする

    画面右上にある「Generate new token」ボタンをクリックする

  3. 「New personal access token」という画面が表示されます。
    まず、一番上の「Note」欄に「GitHub Repository Size」とでも入力し、「Select scopes」欄にある「repo」にチェックを入れます。
    「Note」欄に「GitHub Repository Size」と入力し、「Select scopes」欄にある「repo」にチェックを入れる

    「Note」欄に「GitHub Repository Size」と入力し、「Select scopes」欄にある「repo」にチェックを入れる

  4. そのまま画面を下にスクロールし、「Generate token」ボタンをクリックします。
    画面を下にスクロールし、「Generate token」ボタンをクリックする

    画面を下にスクロールし、「Generate token」ボタンをクリックする

  5. トークンが生成されるので、緑色の枠の中に表示されるているトークンをコピーします。
    コピー アイコンをクリックすると、トークンをコピーすることができます)
    緑色の枠の中に表示されるているトークンをコピーする

    緑色の枠の中に表示されるているトークンをコピーする

  6. 続いて、ツールバー上にある「GitHub Repository Size」アイコンをクリックします。
    ツールバーボタンをクリックする

    ツールバーボタンをクリックする

  7. 「Please enter your Github token」というダイアログが表示されるので、コピーしたトークンを貼り付けて「OK」ボタンをクリックします。
    Please enter your Github token

    Please enter your Github token

  8. 「Your Github token has been set successfully. Reload the Github page to see changes.」というダイアログが表示されたら登録完了です。
    以後、プライベートリポジトリでもファイルサイズが表示されるようになります。
  9. Your Github token has been set successfully. Reload the Github page to see changes.

    Your Github token has been set successfully. Reload the Github page to see changes.

  10. 尚、作成したトークンを無効化したい時は、ツールバー上にある「GitHub Repository Size」アイコンをクリックします。
    ツールバーボタンをクリックする

    ツールバーボタンをクリックする

  11. 「You have already set your Github token. Do you want to remove it?」というダイアログが表示されるので、「OK」ボタンをクリックします。
    You have already set your Github token. Do you want to remove it?

    You have already set your Github token. Do you want to remove it?

  12. 「You have successfully removed Github token. Click extension icon again to set a new token.」というダイアログが表示されるので、これも「OK」ボタンをクリックします。
    You have successfully removed Github token. Click extension icon again to set a new token.

    You have successfully removed Github token. Click extension icon again to set a new token.

  13. 最後に、GitHub にサインインした状態で「Personal access tokens」のページにアクセスし、削除したいトークンの右側にある「Delete」ボタンをクリックすれば処理完了です。
    削除したいトークンの右側にある「Delete」ボタンをクリックする

    削除したいトークンの右側にある「Delete」ボタンをクリックする

コメント