【GitHub】キラキラでカッコよくてイケてるプロフィールの作り方
はじめに
みなさんこんにちは、saitogoです。
GitHubのプロフィールに色々なプログラミング言語のアイコンがあったり、コミット数やスターの数、言語ランキングなどが画像やグラフで表現されてるのを見たことありますか？
とてもキラキラでカッコよくてイケてるプロフィールですよね。
今回はそんなキラキラでカッコよくてイケてるプロフィールの作り方を解説します。
ゴール
下準備
リポジトリの作成
まず最初に専用のリポジトリを作成します。
リポジトリ名はユーザー名と同じにしてください。
このリポジトリは「Special Repository」と言って、公開プロフィールを作れる機能になります。
README.mdの作成
次にREADME.mdを作成します。
作成する時はエディタ上でもブラウザでGitHubから直接作成してもどちらでも良いです。
GitHub Readme Stats
GitHubの様々な情報を視覚的にわかりやすく表示してくれるものです。
その中でよく見る2つを紹介します。
詳しく知りたい方は公式リポジトリをご参照ください。
GitHub Stats Card
スター数の合計やコミット数の合計などを統計情報を表示して、総合評価をランクで表してくれるものです。
表示方法は下記のURLを貼り付けるだけです。
※<ユーザー名>の部分を自分のGitHubのユーザー名に置き換えてください。
[](https://github.com/anuraghazra/github-readme-stats)
クエリパラメータを追加することでオプションの設定も可能です。
Top Languages Card
プログラミング言語の使用率をランキング形式で表示してくれるものです。
表示方法は下記のURLを貼り付けるだけです。
※<ユーザー名>の部分を自分のGitHubのユーザー名に置き換えてください。
[](https://github.com/anuraghazra/github-readme-stats)
クエリパラメータを追加することでオプションの設定も可能です。
Skill Icons
自分のスキルをアイコンで一覧表示出来るものです。
この画像の中にあるアイコンが全て表示可能です。
表示方法は下記のURLを貼り付けて、クエリパラメータにIconIDを書くだけです。
i=の後の部分をアイコンリストのIconIDをカンマ区切りで追加してください。。
[](https://skillicons.dev)
クエリパラメータを追加することでオプションの設定も可能です。
GitHub Profile Trophy
GitHubの統計情報をそれぞれSSS/SS/S/AAA/AA/A/B/Cで表示してくれるものです。
表示方法は下記のURLを貼り付けるだけです。
※<ユーザー名>の部分を自分のGitHubのユーザー名に置き換えてください。
<a href="https://github.com/ryo-ma/github-profile-trophy">
<img src="https://github-profile-trophy.vercel.app/?username=<ユーザー名>" alt="GitHub Trophy">
</a>
クエリパラメータを追加することでオプションの設定も可能です。
その他のサービス
Badgen
URL: https://badgen.net/
概要: カスタムバッジを表示する。
Badge Generator
URL: https://badgen.org/
概要: Zenn・Qiita・AtCoder・Blueskyのフォロワー数や記事数などをバッジにして表示する。
GitHub Profile README Generator
URL: https://rahuldkjain.github.io/gh-profile-readme-generator/
概要: フォームから簡単にGitHubプロフィールのREADME.mdを作成出来る。
おわりに
実はGitHubでプロフィールを作れることを初めて知った人も意外といるのではないでしょうか。
もしかしたら自力でGitHubプロフィールを作っている人もいるかも知れません。
今回紹介したのは簡単に表示出来て実用的なものを紹介しました。
まだまだ他にもたくさんあると思うので、ぜひ紹介してほしいものがあればコメント欄に書いてくださると嬉しいです。
これで今日からあなたのGitHubプロフィールもキラキラでカッコよくてイケてるプロフィールにしていきましょう。
Discussion