🔍

GitHubアカウントの統計情報を定期的に取得してプロフィールに表示する

2022/06/09に公開

GitHub

Markdown

GitHub Actions

tech

はじめに

GitHubアカウントのOverviewに表示されるやつです。

こちらのインフォグラフィックジェネレーターを使用します。GitHubアカウントの統計情報をSVG、Markdown、PDF、JSONなどの形で出力できます。

https://github.com/lowlighter/metrics

セットアップの方法はいくつかありますが、今回はGitHub Actionsを使う方法を試してみます。

リポジトリの作成

アカウント名と同じpublicリポジトリを作成します。
自分の環境だと krabben16/krabben16 というリポジトリになります。

Action codeの生成

以下のサイトで統計情報をどのように表示するかシミュレートできます。

https://metrics.lecoq.io/

また、Action codeタブに統計情報を画像の形で出力するGitHub Actionsのコードが生成されます。

# Visit https://github.com/lowlighter/metrics/blob/master/action.yml for full reference
name: Metrics
on:
  # Schedule updates (each hour)
  schedule: [{cron: "0 * * * *"}]
  # Lines below let you run workflow manually and on each commit
  workflow_dispatch:
  push: {branches: ["master", "main"]}
jobs:
  github-metrics:
    runs-on: ubuntu-latest
    permissions:
      contents: write
    steps:
      - uses: lowlighter/metrics@latest
        with:
          # Your GitHub token
          # The following scopes are required:
          #  - public_access (default scope)
          # The following additional scopes may be required:
          #  - read:org      (for organization related metrics)
          #  - read:user     (for user related data)
          #  - read:packages (for some packages related data)
          #  - repo          (optional, if you want to include private repositories)
          token: ${{ secrets.METRICS_TOKEN }}

          # Options
          user: krabben16
          template: classic
          base: header, activity, community, repositories, metadata
          config_timezone: Asia/Tokyo

GitHub Actionsの設定

Action codeをリポジトリの以下の場所に保存します。

コード内でsecrets.METRICS_TOKENを参照しています。これはジェネレーターがGitHubアカウントの統計情報にアクセスするために必要なものです。Personal Access Tokenを生成して、その値をリポジトリのsecretsに設定します。

Personal Access Tokenの生成

Action code内に記載されている通り、Select scopesで以下のアクセスを許可します。

read:org
read:user
read:packages
repo

https://github.com/settings/tokens

secretsの設定

secretsは暗号化された環境変数のことです。生成したPersonal Access TokenをMETRICS_TOKENという名前で登録します。設定場所はリポジトリのSettings > Security > Secrets > Actions です。

ワークフローの動作確認

設定が問題なければGitHub Actionsが正常に動作してリポジトリにgithub-metrics.svgというファイルがコミットされています。画像を出力するワークフローはyamlのscheduleで設定した通り1時間に1回実行されます。

README.mdの作成

出力した画像を読み込むマークダウンファイルを作成します。

画像の表示確認

GitHubアカウントのOverviewを表示した時に画像が表示されていれば完成です！

おわりに

お気に入りはMost used languagesです。その他にも統計情報を視覚的に表示するプラグインがいろいろ用意されているので、プロフィールの見せ方のバリエーションが広がりますね🧐

プラグインの一覧

GitHubで編集を提案