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
1.1k
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Githubのプロフィールページをおしゃれにしよう
吉川楓馬
May 21, 2024
More Decks by 吉川楓馬
See All by 吉川楓馬
初心者向けSwift勉強会#3
yoshikawa0918
0
130
初心者向けSwift勉強会#2
yoshikawa0918
0
150
初心者向けSwift勉強会#1 ~Swift文法編~
yoshikawa0918
0
170
九州アプリチャレンジ・キャラバンに参加してきた話
yoshikawa0918
0
190
東京Flutterハッカソン行ってきたよ!!
yoshikawa0918
0
510
AkarengaLT_16_スライド.pdf
yoshikawa0918
0
110
ProcessingでAndroidアプリを作ろうの会
yoshikawa0918
0
290
サンプルを使って学ぶFlutter
yoshikawa0918
1
400
Other Decks in Programming
See All in Programming
気圧・高度・GPSを記録&可視化するアプリ「Koudo」を作った話
hjmkth
1
320
Signal Forms: Details & Live Coding @enterJS 2026 in Mannheim
manfredsteyer
PRO
0
180
技術記事、AIに書かせるか、自分で書くか? 〜それでも私が自分の手で書く理由〜 / #QiitaConference
jnchito
2
1.5k
Honoでのサプライチェーン侵害対策 〜 3つのライブラリに学ぶ
yusukebe
7
1.4k
The NotImplementedError Problem in Ruby
koic
1
880
「なぜそう決めたのか」を残し続ける仕組み ― Notion AI カスタムエージェント × Slack連携による設計判断の自動記録 - NIKKEI Tech Talk #47
niftycorp
PRO
0
220
Make SRE Operations Easier with Azure SRE Agent
kkamegawa
0
7.4k
IBM Bobを活用したレガシーアプリの最新化
oniak3ibm
PRO
1
210
技術記事、 専門家としてのプログラマ、 言語化
mizchi
13
6.4k
AIで効率化できた業務・日常
ochtum
0
140
スマートグラスで並列バイブコーディング
hyshu
0
250
脅威をエンジニアリングの糧にして――現場編 / Turning Threats into Engineering Fuel — Field Edition
nrslib
0
290
Featured
See All Featured
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
170
Paper Plane (Part 1)
katiecoart
PRO
0
9.2k
Ethics towards AI in product and experience design
skipperchong
2
310
Navigating Team Friction
lara
192
16k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
250
1.3M
Art, The Web, and Tiny UX
lynnandtonic
304
22k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.4k
Accessibility Awareness
sabderemane
1
140
Facilitating Awesome Meetings
lara
57
7k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
360
30k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
19k
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
390
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