GitHubのプロフィールが、Markdownで格好よくできるらしい

お役立ち

はじめに

Twitterなどで、GitHubでプロフィールをマークダウンで書けるらしいと知りました。実際に作成してみたので、メモしておきます。

手順

リポジトリを作成する

まず、自分のユーザー名と同じ名前のリポジトリを作成します。自分であればnishipyです。こんな風に表示されるはずです。

README.mdを作成する

あとはREADME.mdを書いて、このリポジトリのpushするだけです。以上の手順を踏むと、自分のトップページにREADMEで書いた内容が表示されるようになります。例えば、こんな感じです。

簡単ですねえ。この先は完全に自己満足の領域です。デザインにこだわれば、めちゃめちゃ格好いいプロフィールができるはずです。今回は最低限思いついたことを試してみます。



README.mdを格好よくする

草を生やす

今回作ったプロフィールが表示されるページに草グラフも載るのでいらない気もしますが、草はいくらあってもいいのでやってみます。

↓サービスを使うと、自分のGutHubアカウントの草を画像として埋め込むことができます(もちろん他人のも可)。使い方は、単純にユーザー名を入力して、生成されたタグをコピペするだけ。この記事のも埋め込めます。

Grass-Graph / Imaging your GitHub Contributions Graph
Generate PNG image about your GitHub contributions graph by Grass-Graph.

GitHub Readme Statsを使う

そのほかに、GitHubでの活動を動的に生成してくれるのが、GitHub Readme Statsです。これもTwitterでよく見かけますね。

anuraghazra/github-readme-stats
:zap: Dynamically generated stats for your github readmes - anuraghazra/github-readme-stats

自分のアカウントが獲得したStarや、コミット数、PR数、作成したIssue数の合計をきれいに表示してくれるようです。また、コミットをもとに使っている言語の割合も表示されます。とてもよさそうなので使ってみます。使い方は↑のGitHubに書いてあります。日本語がよければ、どこか1に記事が上がっているはずです。

少し例をあげると

とすれば、以下のように表示されます。

nishipy's github stats

数字が小さく格好悪い😞場合、&hideというクエリストリングで隠したい項目を指定できます。

Nishipy's github stats

資格のバッジをつける

最近CKAとCKADを取ったので、記念にこれらのバッジを埋め込んでみます。受験体験記はこちら。

Certified Kubernetes Administrator(CKA)を取得しました
NishipyCKAを取得しました。ひさびさの資格試験だった上、合計4時間くらい拘束されたので、とても疲れました。はじめに2020年7月にCertified Kubernetes Administrator(CKA)を取得し...(続く)

コードで埋め込むとこんな感じらしいですね。

あまり好みじゃないので画像貼るだけにしようかな、と思います。

独自のバッジをつける

Shields.ioでいろいろつくれるらしい。例えば、このようにすると

ビルゲイツのLinkedInへ飛ぶバッジが作成できます。

LinkedIn



作成例

こんな感じになりました!

nishipy - Overview
☁️ Engineer. nishipy has 27 repositories available. Follow their code on GitHub.

最後に

Twitterには、ほかにも様々な人が作った格好いいプロフィールが載っていました。一部を共有しておきます。これらを参考にして、さらにこだわったプロフィールを作るのも楽しいかもしれません。

以上.


  1. 日本語版のREADMEQiitaの記事がありました。 

コメント