【Todoist→Pixela】Todoistでタスクを完了したら草生やす
Todoistのタスクが完了したら草を生やしたい
Pixelaというサービスを知ってから、私の頭の中は「どう草を生やすか」で持ちきりです。
今回は私が日常的に使っているタスク管理アプリ「Todoist」と連携し、タスクが完了したら草を生やすようにしてみました。
なんでも草を生やしたがるお年頃
— Ikuma_t (@ikumatdkr) 2021年1月8日
ikuma-t/todoist-graph | Pixela https://t.co/2eRIHRZq5W #Pixela
Pixela側の設定
一億総草生やし社会の実現のためには、「いつものそれ」ではいけませんね。というわけで、Pixela側の設定も記載します。
手順としては次の通りです。全部ターミナルからcurlコマンドで実行しています。
- （ユーザー未登録の場合）ユーザー登録
- Todoist用のグラフの作成
- Webhook の登録
1. （ユーザー未登録の場合）ユーザ登録
$ curl -X POST https://pixe.la/v1/users -d '{"token":"{PASSWORD}", "username":"ikuma-t", "agreeTermsOfService":"yes", "notMinor":"yes"}'
tokenの後ろの{PASSWORD}には任意のパスワードを、usernameにはグローバルに一意な自分のユーザIDを設定してください。
※以降も設定した値に置き換えて進めてください。
2. Todoist用のグラフの作成
$ curl -X POST https://pixe.la/v1/users/ikuma-t/graphs -H 'X-USER-TOKEN:{PASSWORD}' -d '{"id":"todoist-graph","name":"todoist-graph","unit":"updates","type":"int","color":"ichou","timezone":"Asia/Tokyo"}'
指定できるパラメータはPOST - /v1/users/
Scrapboxの更新頻度で草を生やす際に芝生色を使ったので、今回はcolorにichouを指定しています。
3. Webhookの登録
$ curl -X POST https://pixe.la/v1/users/ikuma-t/webhooks -H 'X-USER-TOKEN:{PASSWORD}' -d '{"graphID":"todoist-graph","type":"increment"}' | pbcopy
リクエストすると
{"webhookHash":"xxxxx.....xxxxx","message":"Success.","isSuccess":true}
こんな感じの値が返ってくるのですが、これをコピーするためにpbcopyをくっつけています（手動でコピーしてもいいんですけどね）。
実際に使うのは"webhookHash":"xxxxx.....xxxxx"の値だけです。
これでPixelaの設定は完了です！Todoistの設定をしましょう！
Todoist側の設定
Todoistのタスク完了時に草を生やすには2種類の方法があります。
| TodoistAPI | IFTTT | |
|---|---|---|
| 利用可能なTodoistプラン | プレミアム | 制限なし |
| 送信可能なタイミング | タスク（追加、更新、完了、完了解除、削除） メモ（追加、更新、削除） プロジェクト（追加、更新、削除、アーカイブ、アーカイブ解除） ラベル（追加、更新、削除） フィルタ（追加、更新、削除） リマインダー（発火時） |
タスク（追加、完了 ※いずれもPJもしくはラベル指定可能） |
今回はタスクを完了したら草生やすだけなので、どちらを使っても変わらないです。
この記事では両方の方法をご紹介したいと思います。
（ちなみにIFTTTを通さない分、少し反映が早い(?)ので私はTodoistAPIを使っています）
方法1：IFTTTを使う
※IFTTTのアカウントを持っている前提で話を進めます。
こちらから新しいアプリを作成していきます。
流れとしては
- If ThisにTodoistを設定する
- Then ThatにWebhookを設定する
以上です！
1. If ThisにTodoistを設定する
※初めての場合、IFTTTとTodoistの連携が必要です。今回は省略いたします。
1.If Thisからスタートします。
2.連携するサービスにTodoistを設定します。
3.トリガーを設定します。
各トリガーの説明は図の通りです。今回はタスク完了時を想定しているので、「New Completed Task」を設定します
4.Todoistのどのプロジェクトを監視対象にするか設定します。 今回は全部のタスクを監視対象としたいので「Any Project」のままにしておきます。
5.Create triggerを押して設定を完了します。
2. Then ThatにWebhookを設定する
1.Then Thatからスタートします。
2.連携するサービスにWebhooksを設定します。
3.道なりに進みます。
4.リクエストを設定します。
URLには以下の値を設定します。なお{webhookHashの値}は、Pixelaの設定「3. Webhookの登録」で取得したwebhookHashの値に読み替えてください。
https://pixe.la/v1/users/{ユーザID}/webhooks/{webhookHashの値}
Pixelaはリクエストボディを必要としない（セットしても無視される）ので、画像の通り、Bodyは空欄にしておきましょう。
POST - /v1/users/
ここまできたら、Create action > continue > finishと道なりに進んで設定完了です！
試しにtodoistでタスクを完了してみると、草が生えますwwww
方法2：TodoistAPIを使う（※Todoistプレミアムユーザ向け）
次にTodoistAPIを利用した設定方法を説明します。
1.Todoist App Management Consoleにアクセス
2.Create a new appを選択
3.Pixelaをアプリとして登録する。
App display nameはなんでもいいです。わかりやすいように今回はPixelaとし、Create Appを選択します。
4.Webhookの設定をする
下にスクロールすると「Webhooks」の設定欄があるので、以下のように設定しActivate webhooksを選択します。
なお{webhookHashの値}は、Pixelaの設定「3. Webhookの登録」で取得したwebhookHashの値に読み替えてください。
| 項目 | 値 |
|---|---|
| Webhooks callback URL | https://pixe.la/v1/users/{ユーザID}/webhooks/{webhookHashの値} |
| Webhooks version | 8（デフォルト） |
| Watched Events | item:completed |
5.開発用のアクセストークンを発行する
「Webhooks」の少し上にcreate test tokenボタンがあるので、押してください。
ここまでできたら設定完了です！
試しにtodoistでタスクを完了してみると、草が生えますwwww
草はいいよね
草を生やすと、「は！今日も草生やさなきゃ！」とモチベーション維持に繋がって良いですね〜。
次は「Notionを更新したら草を生やす」に挑戦したいのですが、
- Notionからの更新通知受け取り先はSlackしか対応していない
- Slackに投稿されたことをトリガーにしようと思っても、Pixelaへのリクエスト時に
challengeに失敗してしまう
という状況なので、ちょっと難しいかもですね。うまくできたらまたブログにまとめたいと思います！
