Upgrade to Pro — share decks privately, control downloads, hide ads and more …

GitHub Gistを使って、アクティビティを可視化しよう / Let's try visualizing your activity using the GitHub Gist

Kentaro Matsushita
April 25, 2020
Programming
1
470

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

More Decks by Kentaro Matsushita

See All by Kentaro Matsushita
Denoで簡単なCLIツールを作ってみる / Try to make a simple CLI tool with Deno
kentarom
0
310
GatsbyJSで作った個人ブログの構成を色々見直してみた / Improve my personal blog made with GatsbyJS
kentarom
1
120
Webサイトパフォーマンスを継続的に計測したい！！！ / I want to continuously measure my website performance!!!
kentarom
2
240
Actions ToolkitではじめるGitHub Action開発 / Getting started creating a GitHub Action with Actions Toolkit
kentarom
2
1.2k
OGP画像を生成するNode.jsのライブラリを作ってみた / Create a Node.js module for generating Open Graph image
kentarom
1
6.2k
チームをよしなにする立場を経験して学んだこと / Things I have learned in leading the team
kentarom
0
460
AWSの既存サービスを活用して、
障害検知・復旧を迅速化するカラクリ / JAWS-UG Kanazawa x OpsJAWS
kentarom
2
3k
DMM.comの認証基盤を支えるエラー通知の仕組み / AWS Dev Day Tokyo 2018 Lightning Talk
kentarom
2
12k
Firebaseで
ポートフォリオサイトを作ってみた / Make a portfolio site with Firebase
kentarom
0
360

Other Decks in Programming

See All in Programming
入門Hello world（PHPカンファレンス2022）
yutaron
0
260
react-reconcilerでオレオレReact Nativeを作ろう！
kwzr
0
500
どのくらい速くなるの？Laravel MixとViteを性能比較してみました！
akitotsukahara
0
220
VSCodeしか使ったことない新卒2年目がPhpStormくんと友達になるためにやったこと - PHP Conference Japan 2022
kotomin_m
0
370
Micro Frontends for Java Microservices - Cork JUG 2022
mraible
PRO
0
440
プログラミング教育について(公開版)
yosuke_furukawa
PRO
4
4.7k
php_mecabをFFIで実装してみよう
rsky
0
150
Vision Frameworkを使ってクレジットカードを スキャンする話
hexarf
0
300
RFC911Xから振り返るHTTPの仕様
seike460
PRO
0
320
Oracle Change Management with SQLcl and Liquibase
thatjeffsmith
0
560
わかった気になれる CRDT を使った共同編集
kentomoriwaki
1
340
なるべくJavaScriptを書かないで
SymfonyのUIをリッチにする Symfony UX
ippey
1
750

Featured

See All Featured
Automating Front-end Workflow
addyosmani
1351
200k
GraphQLの誤解/rethinking-graphql
sonatard
34
7.1k
Visualization
eitanlees
126
12k
A Philosophy of Restraint
colly
193
15k
Web Components: a chance to create the future
zenorocha
303
40k
Support Driven Design
roundedbygravity
87
8.7k
Become a Pro
speakerdeck
PRO
3
2.6k
Streamline your AJAX requests with AmplifyJS and jQuery
dougneiner
127
8.6k
Unsuck your backbone
ammeep
659
55k
Fantastic passwords and where to find them - at NoRuKo
philnash
29
1.7k
Designing with Data
zakiwarfel
91
4k
The Web Native Designer (August 2011)
paulrobertlloyd
75
2k

Transcript

  1. GitHub Gistを使って、アクティビティ を可視化しよう Kanazawa.js Remote #02 2020.04.25 GitHub: kentaro-m /

    Twitter: @_kentaro_m 1

  2. ⾃⼰紹介 Kentaro Matsushita ⾦沢市内のゲーム会社で働 くフロントエンドエンジニ ア 最近はTerraformを書いて るか、チーム開発が円滑に 回るように⾊々やっていま す

    2

  3. ⾃宅で過ごすことが多くなりましたね 私は2⽉20⽇からリモートワークをはじめました 最低限の買い物と運動以外は外に出ない⽣活 最近は⾃宅の作業環境のアップデートにはまってます 4Kディスプレイ/モニターアーム/空気清浄機など購⼊ インドアできることを考えるようになった ゲーム/筋トレ/読書/Netflixなど ⾃分の習慣やアクティビティに⽬が向くように トラッキングや可視化したい 3

  4. アクティビティを可視化したい欲 特に⽬的はないが、アクティビティを⾒える化したい欲に駆られる 何分運動したか 何冊本を読んだか よく聴いているアーティストはなにか よく書いているプログラミング⾔語はなにか プログラミングの⽣産性の⾼い時間は朝か夜か 可視化して、⽬につくところにおいておきたい 4

  5. アクティビティの可視化に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

  6. APIで動的にGistを更新する matchai/awesome-pinned-gists GitHubプロフィールにGistをピン留めするActionを⼀覧化 様々なアクティビティをGitHubプロフィールに可視化できる Spotifyで今週よく聴いたアーティストベスト5を表⽰ ⾃分のTwitterアカウントの最新のツイートを表⽰ WakaTimeで今週のプログラミングした時間を可視化 APIを使⽤し、動的にGistを更新しているところがポイント 6

  7. GitHub Gistでアクティビティを可視化 する 必要なもの GitHub Gist GitHub Actions APIを叩いて、Gistを更新するコード 7

  8. ⾃分の読書状況を可視化してみる 読んだ本や積読本、読んでる本をGitHubのプロフィールに表⽰す る 8

  9. ⾃分の読書状況を可視化してみる Gistのファイル先頭5⾏がプロフィールに表⽰できる 9

  10. ⾃分の読書状況を可視化してみる Google Booksから情報を取得する マイライブラリで読んだ本や積読本、読んでる本を管理できる Google BooksのAPIで上記の情報を取得できる Gist APIを更新して、読書状況を反映する GitHub Actionsをスケジュール実⾏すると、1⽇1回⾃動で更新

    GitHub Actionsとして提供すると、誰もがフォークして同じような ことができる 私が作った読書状況を可視化するGitHub Action kentaro-m/book-box 10

  11. みなさんもGistでアクティビティの可 視化に是⾮試してみてください！ APIがあれば、様々な情報が可視化できると思います！ 11