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 Gistを使って、アクティビティを可視化しよう / Let's try visu...
Search
Kentaro Matsushita
April 25, 2020
Programming
1
860
GitHub Gistを使って、アクティビティを可視化しよう / Let's try visualizing your activity using the GitHub Gist
Kanazawa.js Remote #02 2020.04.25
https://kanazawajs.connpass.com/event/171954/
Kentaro Matsushita
April 25, 2020
Tweet
Share
More Decks by Kentaro Matsushita
See All by Kentaro Matsushita
開発のアジリティ向上のためのシステムリプレイス ~DMM GAMESの事例~
kentarom
0
810
Denoで簡単なCLIツールを作ってみる / Try to make a simple CLI tool with Deno
kentarom
0
1.1k
GatsbyJSで作った個人ブログの構成を色々見直してみた / Improve my personal blog made with GatsbyJS
kentarom
1
430
Webサイトパフォーマンスを継続的に計測したい!!! / I want to continuously measure my website performance!!!
kentarom
2
580
Actions ToolkitではじめるGitHub Action開発 / Getting started creating a GitHub Action with Actions Toolkit
kentarom
2
2k
OGP画像を生成するNode.jsのライブラリを作ってみた / Create a Node.js module for generating Open Graph image
kentarom
1
7.5k
チームをよしなにする立場を経験して学んだこと / Things I have learned in leading the team
kentarom
0
800
AWSの既存サービスを活用して、 障害検知・復旧を迅速化するカラクリ / JAWS-UG Kanazawa x OpsJAWS
kentarom
2
4.7k
DMM.comの認証基盤を支えるエラー通知の仕組み / AWS Dev Day Tokyo 2018 Lightning Talk
kentarom
2
14k
Other Decks in Programming
See All in Programming
テーブル定義書の構造化抽出して、生成AIでDWH分析を試してみた / devio2025tokyo
kasacchiful
0
400
釣り地図SNSにおける有料機能の実装
nokonoko1203
0
210
CSC509 Lecture 09
javiergs
PRO
0
290
Kotlin + Power-Assert 言語組み込みならではのAssertion Library採用と運用ベストプラクティス by Kazuki Matsuda/Gen-AX
kazukima
0
100
r2-image-worker
yusukebe
1
120
オンデバイスAIとXcode
ryodeveloper
0
420
Node-REDのノードの開発・活用事例とコミュニティとの関わり(Node-RED Con Nagoya 2025)
404background
0
120
Webサーバーサイド言語としてのRustについて
kouyuume
1
5.1k
マンガアプリViewerの大画面対応を考える
kk__777
0
460
Vue 3.6 時代のリアクティビティ最前線 〜Vapor/alien-signals の実践とパフォーマンス最適化〜
hiranuma
2
410
HTTPじゃ遅すぎる! SwitchBotを自作ハブで動かして学ぶBLE通信
occhi
0
220
Introducing RemoteCompose: break your UI out of the app sandbox.
camaelon
2
500
Featured
See All Featured
The World Runs on Bad Software
bkeepers
PRO
72
12k
Building Adaptive Systems
keathley
44
2.8k
Producing Creativity
orderedlist
PRO
348
40k
YesSQL, Process and Tooling at Scale
rocio
174
15k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.1k
How Fast Is Fast Enough? [PerfNow 2025]
tammyeverts
2
300
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
A Tale of Four Properties
chriscoyier
161
23k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.1k
Bash Introduction
62gerente
615
210k
A Modern Web Designer's Workflow
chriscoyier
697
190k
Transcript
GitHub Gistを使って、アクティビティ を可視化しよう Kanazawa.js Remote #02 2020.04.25 GitHub: kentaro-m /
Twitter: @_kentaro_m 1
⾃⼰紹介 Kentaro Matsushita ⾦沢市内のゲーム会社で働 くフロントエンドエンジニ ア 最近はTerraformを書いて るか、チーム開発が円滑に 回るように⾊々やっていま す
2
⾃宅で過ごすことが多くなりましたね 私は2⽉20⽇からリモートワークをはじめました 最低限の買い物と運動以外は外に出ない⽣活 最近は⾃宅の作業環境のアップデートにはまってます 4Kディスプレイ/モニターアーム/空気清浄機など購⼊ インドアできることを考えるようになった ゲーム/筋トレ/読書/Netflixなど ⾃分の習慣やアクティビティに⽬が向くように トラッキングや可視化したい 3
アクティビティを可視化したい欲 特に⽬的はないが、アクティビティを⾒える化したい欲に駆られる 何分運動したか 何冊本を読んだか よく聴いているアーティストはなにか よく書いているプログラミング⾔語はなにか プログラミングの⽣産性の⾼い時間は朝か夜か 可視化して、⽬につくところにおいておきたい 4
アクティビティの可視化にGitHub Gist が使える GitHub GistはGitHubプロフィールにピン留めできる テキストや画像 (PNGやJPEG、GIF) などを表⽰できる GitHubブログのGistのピン留め活⽤例 Pins
to win: students, show off your stuff to win a GitHub Education backpack - The GitHub Blog ⾃⼰紹介やレジュメなどアピールできる アクティビティも載せられる 5
APIで動的にGistを更新する matchai/awesome-pinned-gists GitHubプロフィールにGistをピン留めするActionを⼀覧化 様々なアクティビティをGitHubプロフィールに可視化できる Spotifyで今週よく聴いたアーティストベスト5を表⽰ ⾃分のTwitterアカウントの最新のツイートを表⽰ WakaTimeで今週のプログラミングした時間を可視化 APIを使⽤し、動的にGistを更新しているところがポイント 6
GitHub Gistでアクティビティを可視化 する 必要なもの GitHub Gist GitHub Actions APIを叩いて、Gistを更新するコード 7
⾃分の読書状況を可視化してみる 読んだ本や積読本、読んでる本をGitHubのプロフィールに表⽰す る 8
⾃分の読書状況を可視化してみる Gistのファイル先頭5⾏がプロフィールに表⽰できる 9
⾃分の読書状況を可視化してみる Google Booksから情報を取得する マイライブラリで読んだ本や積読本、読んでる本を管理できる Google BooksのAPIで上記の情報を取得できる Gist APIを更新して、読書状況を反映する GitHub Actionsをスケジュール実⾏すると、1⽇1回⾃動で更新
GitHub Actionsとして提供すると、誰もがフォークして同じような ことができる 私が作った読書状況を可視化するGitHub Action kentaro-m/book-box 10
みなさんもGistでアクティビティの可 視化に是⾮試してみてください! APIがあれば、様々な情報が可視化できると思います! 11