Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Githubのプロフィールページをおしゃれにしよう
Search
吉川楓馬
May 21, 2024
Programming
2
790
Githubのプロフィールページをおしゃれにしよう
吉川楓馬
May 21, 2024
Tweet
Share
More Decks by 吉川楓馬
See All by 吉川楓馬
初心者向けSwift勉強会#3
yoshikawa0918
0
100
初心者向けSwift勉強会#2
yoshikawa0918
0
120
初心者向けSwift勉強会#1 ~Swift文法編~
yoshikawa0918
0
140
九州アプリチャレンジ・キャラバンに参加してきた話
yoshikawa0918
0
140
東京Flutterハッカソン行ってきたよ!!
yoshikawa0918
0
440
AkarengaLT_16_スライド.pdf
yoshikawa0918
0
89
ProcessingでAndroidアプリを作ろうの会
yoshikawa0918
0
260
サンプルを使って学ぶFlutter
yoshikawa0918
1
350
Other Decks in Programming
See All in Programming
A Gopher's Guide to Vibe Coding
danicat
0
160
Amazon Q CLI開発で学んだAIコーディングツールの使い方
licux
3
180
AIレビュアーをスケールさせるには / Scaling AI Reviewers
technuma
2
200
#QiitaBash TDDで(自分の)開発がどう変わったか
ryosukedtomita
1
370
Constant integer division faster than compiler-generated code
herumi
2
670
令和最新版手のひらコンピュータ
koba789
14
7.8k
パスタの技術
yusukebe
1
390
オホーツクでコミュニティを立ち上げた理由―地方出身プログラマの挑戦 / TechRAMEN 2025 Conference
lemonade_37
2
480
【第4回】関東Kaggler会「Kaggleは執筆に役立つ」
mipypf
0
220
新しいモバイルアプリ勉強会(仮)について
uetyo
1
260
CEDEC 2025 『ゲームにおけるリアルタイム通信への QUIC導入事例の紹介』
segadevtech
3
890
「リーダーは意思決定する人」って本当?~ 学びを現場で活かす、リーダー4ヶ月目の試行錯誤 ~
marina1017
0
230
Featured
See All Featured
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.6k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
810
Optimising Largest Contentful Paint
csswizardry
37
3.4k
Agile that works and the tools we love
rasmusluckow
329
21k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.4k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.8k
Faster Mobile Websites
deanohume
309
31k
KATA
mclloyd
32
14k
The Cult of Friendly URLs
andyhume
79
6.5k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
283
13k
Transcript
Githubのプロフィールページ をおしゃれにしよう 1
⾃⼰紹介 名前 吉川楓⾺ 所属 九州産業⼤学 理⼯学部 情報科学科 4年 出⾝ ⼤分県佐伯市
趣味 カードゲーム(遊戯王OCG) ⼀⾔ AkarengaLT登壇4回⽬! 2
Githubを使っててたまにみるもの • プロフィールページによく使う⾔ 語やスキル⼀覧らしいものが表⽰ されている • プロフィールREADME ◦ Githubで⾃分に関する情報を 共有できる
• プロフィールREADME⽤のライブ ラリが公開されている 3
今回話すこと • プロフィールREADMEの作り⽅ • Githubのプロフィールページで使えるライブラリをいくつ か紹介する ◦ ライブラリはたくさんあって全ては紹介しきれない ◦ 私が使っているツールを紹介する
4
プロフィールREADMEの作り⽅ 5 1.リポジトリの名前を ⾃分のユーザ名にする 2.Publicを選択 3.ここにチェックを ⼊れる 4.リポジトリを作成する
プロフィールREADMEの作り⽅ 6 5.⾃分好みに編集!
GitHub Stats Card • Github Readme Statsの機能の⼀つ ◦ https://github.com/anuraghazra/github-readme-stats •
ユーザーのコミット数やプルリク数といった情報を表⽰できる • ドキュメントに載っているコードをプロフィールREADMEコピペ して、?username=の値をGithubアカウントのユーザー名に変更 するだけ! 7
Top Languages Card (Compact layout) 8 • Github Readme Statsの機能の⼀つ
• ユーザーが最も利⽤しているプログラミング⾔語を表⽰できる • 基本的な使い⽅はGithub Stats Cardと⼀緒 • クエリパラメータ?layout=compactを渡せば、レイアウトをコン パクトにできる
Github Profile Trophy 9 • ユーザーのコミット数やプルリク数といった情報をトロフィーに して表⽰できる ◦ https://github.com/ryo-ma/github-profile-trophy •
ドキュメントに載っているコードをプロフィールREADMEコピペ して、?username=の値をGithubアカウントのユーザー名に変更 するだけ!
Skill Icons 10 • プログラミング⾔語やツールのアイコンを表⽰できる ◦ https://skillicons.dev/ • ドキュメントに載っているコードをプロフィールREADMEコピペ して、カンマ区切りで表⽰したいプログラミング⾔語やツールの
名前を渡す
まとめ • プロフィールREADMEの作り⽅ • 私が使っているライブラリの紹介 ◦ Github Stats Card ◦
Top Languages Card(Compact layout) ◦ Github Profile Trophy ◦ Skill Icons 11