kintoneはノンプログラミングで自由にアプリを作れてすごく便利。
ただ!ガントチャートは描きづらい。。。そこでプロジェクト管理ツール「Backlog」との連携を実装してみました。
今回は、ジョイゾーさんが提供されている「Backlog課題連携プラグイン」にチョイ足しをして、kintoneでのプロセス変更時にコメントが追加されるように実装を行なっていきます!
プロジェクト管理ツールBacklog

プロジェクト管理ツールというと、Redmine、Trello、Asana等、世の中にたくさん出回っていますよね。
筆者も色々使った事があるのですが、機能が多すぎて使いこなせなかったり、UIがイマイチだったり、なかなか一長一短なんですよね。

その中でもBacklogは機能もシンプルで、操作性にも優れています。弊社でもタスク管理として利用しているツールです。
もちろんガントチャートも作れちゃいます。
kintone×Backlogの連携プラグインを設置してみる
ジョイゾーさんが提供しているプラグインの設定方法は、こちらの記事にわかりやすくまとめられているので、そちらを参照しましょう。
簡単に手順をまとめると、
- BacklogのAPIキーを発行する
- ジョイゾーさんのWebからプラグインをDLする
- kintoneにプラグインを読み込む
- 連携したいkintoneアプリにプラグインを設置する
- プラグインの基本設定を行う
たったこれだけ!難しいところは特になく、30分もあれば設定できると思います。
実際に使ってみたのがこちら。

kintoneからBacklogにタスクが追加されていますね!
ただ、ここまではkintoneからBacklogにタスクが追加されているだけ。
kintone上で何か更新があった場合には、Backlogにも反映させたいですよね。
そこで、kintoneでプロセス変更のアクションが行われた際に、Backlogにコメントが追加されるようにチョイ足し実装してみましょう!
kintoneのプロセス変更時にBacklogにコメントを追加する
サンプルコードはこちらです。
/* プロセス管理のアクションイベントを取得 */
kintone.events.on('app.record.detail.process.proceed', function(event) {
var status = event.status.value; // 実行前のステータス
var nextStatus = event.nextStatus.value; // 実行後のステータス
var comment = 'ステータスが【' + status + '】から【' + nextStatus + '】に変更されました。'; // 追加するコメントの内容
var taskId = "XXXXX"; // backlogのタスクID
var apiKey = "XXXXX"; // backlogのAPIキー
var url = 'https://XXXXX.backlog.com/api/v2/issues/' + taskId + '/comments?apiKey=' + apiKey;
// backlogにコメントを追加する
var body = { "content": comment };
var xhr = new XMLHttpRequest();
xhr.open('POST', url);
xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onload = function() {
if (xhr.status === 200) {
// success
console.log(JSON.parse(xhr.responseText));
} else {
// error
console.log(JSON.parse(xhr.responseText));
}
};
xhr.send(JSON.stringify(body));
});
このプログラムは、プロセスが実行されkintoneアプリのステータスが更新された事をトリガーに動きます。
Backlogのタスクにコメントを書き込む処理は、BacklogのAPIを用いています。
実際に動かしてみると、

このように、コメントが追加されていますね!
kintone × Backlog連携まとめ
本記事では、kintoneとBacklogの連携方法について記載しました。
ポイントはこちら。
- kintoneからBacklogにタスクを追加するのはプラグインを利用すれば簡単!
- BacklogのAPIを使えばコメント追加もできる!
追加で実装したのはコメントの追加機能ですが、Backlogは様々なAPIを公開しているので、うまく活用すればより使いやすいkintoneアプリを作成することができます。

