1. ha_ru_ma_ki

    Posted

    ha_ru_ma_ki
Changes in title
+R3 kintone js deployerを使ってkintoneカスタマイズをハッピーに!
Changes in tags
Changes in body
Source | HTML | Preview
@@ -0,0 +1,59 @@
+[kintone Advent Calender](http://qiita.com/advent-calendar/2016/kintone) 9日目の記事です。
+
+最近、社内で<font color="DeepPink">ハッピー</font>というキーワードがよく使われているようなのでタイトルに入れてみました。
+
+kintoneでJavaScriptのカスタマイズをしていて思うのは、JavaScriptファイルをアップロードするのが面倒なんですよね。
+そこで改善できるツール作りましたよ!って書こうとしたら、[前日の方](http://qiita.com/yhirochick/items/840c95f7472b90cd1491)も同様の記事を書かれていましたw
+
+とは言え、もはや(時間的に)後戻りはできないので、ご紹介させて頂きたいと思います。
+
+# JavaScriptカスタマイズの流れ
+
+kintoneでJavaScriptを使ったカスタマイズを行う場合、だいたい以下のような流れで進めます。
+
+1. JavaScriptプログラムを作る
+2. アプリの設定画面からkintoneへJavaScriptファイルをアップロードする
+3. 動作確認・デバッグする
+
+2を行うためにはkintoneのアプリ設定画面を開いて、ファイルをアップロードする必要があり、結構面倒なわけです。
+
+# 便利ツールを使う
+
+## [JSEdit for kintone](https://cybozudev.zendesk.com/hc/ja/articles/205452653-JSEdit-for-kintone)
+
+kintoneの設定画面上で直接JavaScriptを記述できる便利なプラグインがあります。
+これを使うとファイルをアップロードする手間が無くなるため、非常にお手軽にJavaScriptカスタマイズができます。
+が、kintoneの画面で直接コーディングするという事は、ソースが手元に残らないので、ちょっと不安になる事があります。
+
+## [Dropbox連携](https://cybozudev.zendesk.com/hc/ja/articles/201308690-JavaScript%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA%E3%81%AE%E3%83%87%E3%83%90%E3%83%83%E3%82%B0%E3%82%92%E3%81%8B%E3%82%93%E3%81%9F%E3%82%93%E3%81%AB%E3%81%99%E3%82%8B%E3%82%A6%E3%83%A9%E3%83%AF%E3%82%B6)
+
+Dropboxの同期機能を活用したテクがあります。
+この方法でもアップロードの手間が無くなり、更にオリジナルのソースは手元で管理できるのでとても便利です。
+ですが、ファイルがインターネット上に公開されている状態なので、ちょっと不安になる事があります。
+
+# R3 kintone js deployer で万事解決!?
+
+そこで(僕ではありませんが)作ったのが [R3 kintone js deployer](https://github.com/r3it/r3-kintone-js-deployer) (∩´∀`)∩ワーイ
+
+本ツールはコマンドライン形式で実行するもので、設定ファイルに記述した情報を元に、kintoneへJavaScriptファイルをアップロードしてくれます。(Rubyの実行環境が必要です)
+
+例えば、
+
+``$ ruby deploy.rb dev customerlist``
+
+のような形式で、dev環境に存在するcustomerlistアプリに対してアップロードする事ができます。(devとかcustomerlistの名前は自由に定義できます)
+
+接続先のkintone環境やアプリを細かく設定できるので、開発環境にアップロードしたり、本番環境へアップロードしたり自由自在です( ー`дー´)キリッ
+
+コマンドラインから実行できるという事は、他のツールと連動した使い方も可能になるわけです。
+最近の弊社では、**webpack**と**gulp**と**R3 kintone js deployer**を組み合わせる事で、
+
+- JavaScriptファイルが変更された事を自動で検知
+- ソースを圧縮(Minify)
+- アプリへアップロード
+
+の一連の操作を自動化しています。
+
+ちょっと惜しい点としては、kintoneのデプロイAPIを使っているため、反映までに数秒かかってしまうという事です。
+
+便利なツールを組み合わせて、kintoneカスタマイズをハッピーに!!