March 4, 2013

GitLabとGitHubのhook通知をGoogle Chrome Extensionで受信する仕組みを作ってみた

GitLabとGitHubのhook通知を受信して送信する「Pubotage
https://github.com/mp-php/pubotage
* Node.js
* Socket.IO

Pubotageの通知を受信する「Subotage」(Chrome Extension)
https://github.com/mp-php/subotage
* Socket.IO
* Backbone.js
* Local Storage

を作ってみました。所謂「社内ツール」の想定です。とりあえずはGitLabだけに対応する予定でしたが、その他のサービスとも連携が取れるような作りにしておきたく、ソース構成の確認目的で、GitHubも一緒に対応させました。


以下、Pubotageのインストールと起動方法です。サーバ(非公開サーバを想定)にインストールします。Node.jsはインストール済の想定です。

(1-1) インストール
* wgetとかでも構いません。
$ git clone git://github.com/mp-php/pubotage.git pubotage
$ cd pubotage
$ sudo npm install # 必要なモジュールのインストール
$ cp config.js.default config.js
config.jsでportの設定をして下さい。デフォルトは"1337"になっています。


(1-2) 起動
* foreverを推奨します。
$ sudo npm install -g forever # グローバルインストール
$ forever start pubotage.js # 起動
* nodeコマンドの場合は以下で起動します。(停止はCtrl + C)
$ node pubotage.js

(1-3) 確認
http://example.com:port/
の形式でアクセスして、起動を確認して下さい。(ファイアウォールの設定に注意して下さい。)

(1-4) hookの設定
GitLabあるいはGitHubのhookで指定するURLの形式は、それぞれ
* http://example.com:port/gitlab
* http://example.com:port/github
になります。


以下、Subotageのインストール方法です。

(2-1) インストール
https://github.com/mp-php/subotage を適当な場所にgit cloneあるいはダウンロード。
ツール > 拡張機能 > パッケージ化されていない拡張機能を読み込む...
と進んで、Subotageのディレクトリを選択します。

(2-2) 設定
オプションから、Subotageの設定を行います。
Pubotage Urlの形式は
* http://example.com:port/
になります。

(2-3) 確認
GitLabあるいはGitHubにpushします。Subotageのアイコンが変わることを確認します。受信できない場合、Subotageをリロードしてみて下さい。


Subotageで受信することを「サボる」と呼びたいです。


以下、TODOです。。。
* アイコン
* ユニットテスト

アイコンはまあ、言わずもがなですね。サボテンのアイコンにしたいです。(受信した時に花が咲く感じ。)ユニットテストは、ホントは込み込みで公開したかったのですが、「Chrome Extension + Backbone.js + Local Storage + JSのユニットテストに慣れていない自分」の組み合わせから、今日の朝までには終わりそうにもないし、後回しにしました。(飽きないうちに作ってしまいたかった。。。)

全体的な感想としては、Node.js + Socket.IO + Backbone.js( + Chrome Extension + Local Storage)という初物尽くしで、面白かったです。(ちょこっと調べたことはありました。)


以下、おまけ。

Beastie Boys - Sabotage
(Subotageの由来は「Subscriber + Sabotage」で、そこからPubotageという名前も決まりましたw)


No comments:

Post a Comment