Scrapboxに草を生やす
最近自分のメモ書き用にScrapboxを使用しており、結構使い心地が良くなってきました。ブログと違い、気軽にまとめたり小さな単位でアウトプットできることが良いなと思っています。
利用頻度がある程度増えてきたので、Scrapboxに草を生やすことにしました。
Pixela
Githubのグラフのような物を提供してくれるWebAPIです。 今回はScrapboxの投稿を可視化するのに利用しました。
手順
Pixelaにユーザー登録
$ curl -X POST https://pixe.la/v1/users -d '{"token":"XXXXX", "username":"chiroru", "agreeTermsOfService":"yes", "notMinor":"yes"}' =>{"message":"Success. Let's visit ~~~ , it is your profile page!","isSuccess":true}
今回利用するグラフの作成
$ curl -X POST https://pixe.la/v1/users/chiroru/graphs -H 'X-USER-TOKEN:XXXXX' -d '{"id":"scrapbox-graph", "name":"my-scrapbox-graph", "unit":"updates", "type":"int", "color":"shibafu", "timezone":"Asia/Tokyo"}' =>{"message":"Success.","isSuccess":true}
Webhook作成
Webhookとは、あるアプリケーションの更新情報を、他のアプリに提供する仕組みのことで、今回でいうとScrapboxの投稿情報を、Pixelaに提供してグラフの草を生やすのに利用します。
$ curl -X POST https://pixe.la/v1/users/chiroru/webhooks -H 'X-USER-TOKEN:XXXXX' -d '{"graphID":"scrapbox-graph", "type":"increment"}' =>{"message":"Success.","isSuccess":true,"webhookHash":"~~~~~"}
※ 参考:Webhookとは?
ScrapboxでNotificationsに設定する
Project settings/Notificationsに、以下を追加する。
https://pixe.la/v1/users/chiroru/webhooks/webhookHash
Scrapboxで表示する
以下のようにURLを追加します。
https://pixe.la/v1/users/chiroru/graphs/scrapbox-graph.svg
するとこんな感じで表示できます↓あっという間!