先日英語で書かれた GitHub 上のドキュメントを日本語訳しました。
この場合、翻訳作業そのものは GitHub でやったほうが効率がいい一方で、多くの人に見てもらうには Qiita がいいなと思いまして、当初は README.md をコピペして Qiita に投稿しました。
ところが翻訳の対象となる英語のドキュメントの方がすごくアクティブに更新されていて、コピペをいちいちやってると大変だし、いまにぶっ壊しそうだったので、GitHub への push をトリガーにして Qiita 上の記事を自動更新するようにしました。
.travis.yml を準備
まず、.travis.yml を travis init コマンド等々の方法で準備して、Travis CI 上でリポジトリを有効化しましょう。
travis コマンドがない場合は gem install travis でインストールしておきましょう。便利ですよ。
Qiita の API トークンを取得
まず Qiita の個人用アクセストークンというものを取得してください。
Qiita に投稿するためのスクリプトを準備
今回は、以下の npm モジュールを使用したので、それらをインストール。
$ npm install bluebird isomorphic-fetch qiita-js -g
qiita-js 以外の2つは、qiita-js のドキュメント上のサンプルがそうなってたので入れただけで、あんま必要性はわかっていません。
次にデプロイ用のスクリプトを以下のような感じで準備します。
global.Promise = require('bluebird');
require('isomorphic-fetch');
const fs = require( 'fs' );
const Qiita = require( 'qiita-js' );
if ( "false" !== process.env.TRAVIS_PULL_REQUEST ) {
console.log( 'Thanks for contribution. :)' );
process.exit();
}
// set your token
Qiita.setToken( process.env.QIITA_TOKEN );
Qiita.setEndpoint( 'https://qiita.com' );
fs.readFile( 'README.md', 'utf8', ( err, readme ) => {
Qiita.Resources.Item.update_item( process.env.QIITA_POST_ID, {
title: process.env.QIITA_POST_TITLE,
body: readme,
private: false,
} ).then( function( res ) {
console.log( res );
} )
} );
このスクリプトでは以下の環境変数を使っています。
-
QIITA_TOKEN- 個人用アクセストークン -
QIITA_POST_ID- 更新したい記事の ID -
QIITA_POST_TITLE更新したい記事のタイトル
これらの環境変数は、.travis.yml 側で定義しますので、多くの場合スクリプトはコピペでいいはず。
今回のユースケースでは、既存の記事を更新するのが目的なので、既存の記事の ID 及びタイトルはあらかじめ確認しておいてください。
（タイトル省略したいんですが、省略するとエラーになってしまいます。。。）
package.json に登録
npm run deploy で Qiita にデプロイできるように、以下のように package.json に記述しました。
"scripts": {
"deploy": "node deploy/deploy.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
depoloy/deploy.js という部分は、先ほど作ったデプロイ用のスクリプトへのパスです。
.travis.yml に環境変数を追加
まず、先ほど取得した Qiita の個人用アクセストークンを暗号化して .travis.yml に追加します。
$ travis encrypt QIITA=xxxx --add
次に、更新したい記事の ID とタイトルも環境変数として追加します。
env:
global:
- QIITA_POST_ID: 8fff46c201bf9eaeba4a
- QIITA_POST_TITLE: "フロントエンドチェックリスト（日本語訳）"
あと、以下のような感じで、先ほどのスクリプトが自動発火するように記述します。
script: ls -al README.md
after_success: npm run deploy
さらに、masterブランチ以外で発火しないようにしておきましょう。じゃないと記事が意図せず書き換わってしまいます。
branches:
only:
- master
以上、トータルでの .travis.yml のサンプルは以下の通りです。
language: node_js
node_js:
- 6
branches:
only:
- master
before_script:
- npm install
script: ls -al README.md
after_success: npm run deploy
env:
global:
- QIITA_POST_ID: 8fff46c201bf9eaeba4a
- QIITA_POST_TITLE: "フロントエンドチェックリスト（日本語訳）"
- secure: xxxx
ローカルでの動作テスト
ローカルで動作テストを行うには、以下のように環境変数を定義してコマンドを実行してください。
$ export QIITA_TOKEN=xxxx
$ export QIITA_POST_ID=xxxx
$ export QIITA_POST_TITLE=xxxx
$ npm run deploy
非公開の記事を先に作っておいて、その記事の ID に対して動作確認をすると安心です。
環境変数の定義がめんどくさい場合は、direnv が超便利です。