kintone

キントーンのgit管理について

はじめに

以前、「キントーン開発環境の構築方法」という記事で、開発環境から本番環境の移送に、gusuku(グスク)を紹介致しました。

ただ、gusukuの利用制限を超えるアプリを管理していることもあり、実際にはソースをgit管理した後、開発環境から本番環境へのアプリ移送を行っています。
当社で行っている、git管理対象および構成について説明します。

git管理対象

大きく分けて以下を管理をしています。
 ①:フォーム定義などのアプリの設計情報
 ②:アプリごとのJS/CSSファイル
 ③:アプリ全体のJS/CSSファイル
 ④:プラグイン(個別に作成したものに限る)

①アプリの設計情報

サイボウズが提供している、RESTAPIを利用して画面で定義した設計情報を取得します。kintone REST API一覧

このうち、下表RESTAPIを利用します。
※APIの利用方法については、下表リンクを参照ください。

API   HTTP
メソッド
URI
フィールドの一覧 取得 GET /k/v1/app/form/fields.json
フォームのレイアウト 取得 GET /k/v1/app/form/layout.json
一覧の設定 取得 GET /k/v1/app/views.json
アプリ情報 取得 GET /k/v1/app.json
一般設定 取得 GET /k/v1/app/settings.json
プロセス管理の設定 取得 GET /k/v1/app/status.json
アプリの条件通知 取得 GET /k/v1/app/notifications/general.json
レコードの条件通知 取得 GET /k/v1/app/notifications/perRecord.json
リマインダーの条件通知 取得 GET /k/v1/app/notifications/reminder.json
アプリのアクセス権 取得 GET /k/v1/app/acl.json
レコードのアクセス権 取得 GET /k/v1/record/acl.json
フィールドのアクセス権 取得 GET /k/v1/field/acl.json
アプリのグラフ設定 取得 GET /k/v1/app/reports.json
アプリのアクション設定 取得 GET /k/v1/app/actions.json

こちらのようなアプリだと


「フォームのレイアウト」の取得結果はこのようになります。
※RESTAPIの取得結果をそのままJSON形式で保存しています。

"layout": [
  {
   "type": "ROW",
   "fields": [
    {
     "type": "SINGLE_LINE_TEXT",
     "code": "文字列__1行_",
     "size": {
      "width": "193"
     }
    },
    {
     "type": "RADIO_BUTTON",
     "code": "ラジオボタン",
     "size": {
      "width": "253"
     }
    }
   ]
  }
 ],
 "revision": "5"
}

これを上述したRESTAPIに全てに対して実行し、JSON形式で保存します。
ご参考までに、当社は以下のようなファイル名にしています。
 ・フィールドの一覧.json
 ・フォームのレイアウト.json
 ・一覧の設定.json
 ・アプリ情報.json
 ・一般設定.json
 ・プロセス管理の設定.json
 ・アプリの条件通知.json
 ・レコードの条件通知.json
 ・リマインダーの条件通知.json
 ・アプリのアクセス権.json
 ・レコードのアクセス権.json
 ・フィールドのアクセス権.json
 ・アプリのグラフ設定.json
 ・アプリのアクション設定.json
 ※{APIの名前}.jsonです。

②アプリごとのJS/CSSファイル

こちらもサイボウズが提供している、customize-uploaderを利用します。
インストール方法や基本的な使い方はこちらを参照ください。

本ツールは主に、ローカルのJS/CSSファイルをキントーン環境にアップロードするのに使いますが、オプションを指定すると、ファイルのエクスポートも可能です。

こちらを実行すると、アプリ名\srcのフォルダにファイルをダウンロードします。
(注)事前にアプリ名\srcのフォルダは作成願います。
また、nodejsで実行しており、事前にcustomize-uploaderをインストール願います。

const fs = require("fs");
const customizeUploader = require("@kintone/customize-uploader/dist/import");

// エクスポート先のディレクトリ
const baseDir = 'サンプルアプリ/src/';

//---------------------------------------------------
//事前にマニュフェストファイルをローカルに作成
//---------------------------------------------------
const manifestFile = `${baseDir}/customize-manifest.json`;
// アプリIDだけ入れてそれ以外は空で問題なし
const manifile ={
    app  : 'xxxxアプリIDを入力xxxx',
    scope: "ALL",
    desktop: {
        js : [],
        css: []
    },
    "mobile": {
        js  : [],
        css : []
    }
};
fs.writeFileSync(manifestFile, JSON.stringify(manifile, '', ' '))

//------------
//接続情報
//------------
//キントーンのドメイン名、ログインするユーザ名とパスワード
const domainName = 'XXXXXXX.cybozu.com' ;
const username = 'xxxxxxxxxxxx';
const password = 'xxxxxxx';

// オプション設定(destDirにエクスポート先のディレクトリを指定)
var option = { watch : false, lang: 'ja' , destDir: baseDir};

// customize-uploaderを利用してエクスポート
customizeUploader.runImport(domainName, username, password, '', '', manifestFile, option);

以下のようなメッセージが出れば、成功です。

実行すると、このような構造でファイルが作成されます。


C:\…\サンプルアプリ.
└─src
    │  customize-manifest.json
    │
    ├─desktop →PC用のJS/CSSファイルが格納
    │  ├─css
    │  │      index.css
    │  │      kintone-ui-component.min.css
    │  │
    │  └─js
    │          index_qa.js
    │          kintone-ui-component.min.js
    │
    └─mobile →スマートフォン用のJS/CSSファイルが格納
        ├─css
        └─js

③アプリ全体のJS/CSSファイル

kintoneシステム管理 -> JavaScript / CSSでカスタマイズ
で管理しているファイルになります。
こちらは頻繁に変更が発生しないため、主に手作業でファイルをダウンロードして、gitに反映しています。

④プラグイン

社内で作成したプラグインを管理しています。
特別なことはしておらず、こちらの手順を利用して、作成したソースおよびzipファイルをgit管理しています。

gitの構成について

当社環境では以下としています。
※現状、アプリごとにフォルダを作成していますが、さらにスペースごとにフォルダ管理するのも良いかと思います。

C:.
├─サンプルアプリ    ※アプリごとにフォルダを作成
│ │
│ ├─form       ※「①アプリの設計情報」
│ │   フィールドの一覧.json
│ │   フォームのレイアウト.json
│ │   一覧の設定.json
│ │   アプリ情報.json
│ │   一般設定.json
│ │   プロセス管理の設定.json
│ │   アプリの条件通知.json
│ │   レコードの条件通知.json
│ │   リマインダーの条件通知.json
│ │   アプリのアクセス権.json
│ │   レコードのアクセス権.json
│ │   フィールドのアクセス権.json
│ │   アプリのグラフ設定.json
│ │   アプリのアクション設定.json
│ │   
│ └─src       ※「②アプリごとのJS/CSSファイル」
│   │ customize-manifest.json
│   │
│   ├─desktop
│   │ ├─css
│   │ │   xxxxx.css
│   │ │   kintone-ui-component.min.css
│   │ └─js
│   │     xxxxx.js
│   │     kintone-ui-component.min.js
│   │
│   └─mobile
│     ├─css
│     └─js
│     
├─kintone全体のカスタマイズ ※「③アプリ全体のJS/CSSファイル」
│ └─src
│   │ customize-manifest.json
│   │
│   └─desktop
│     ├─css
│     │   xxxx.css
│     │
│     └─js
│         xxxx.js
└─plugin          ※「④プラグイン」
  └─common
    │ xxxxxxxxxxxxxxxxxx.ppk
    │ plugin.zip
    │
    └─src
      │ manifest.json
      │
      ├─css
      │   xxxx.css
      │
      ├─html
      │   config.html
      │
      ├─image
      │   icon.png
      │
      └─js
          xxxx.js

注意点

実はgit管理できないものもあります。
「①アプリの設計情報」でのRESTAPIは全ての設計情報を取得可能な状態となっておりません。

プラグイン、サービス連携、その他の設定が取得できない項目となります。
加えて、キントーンの一覧の列幅設定も取得できません。

一部は、本番環境に移送する際にないと非常に困るものもありますが、
現状は以下のような対策を行っております。

キーワード 対策
アプリのプラグインの追加 初回のみのため、本番環境への移送時に手作業で設定
プラグインの設計情報 エクスポート機能のあるプラグインの場合、
設定ファイルをgit管理
その他の設定 初回のみのため、本番環境への移送時に手作業で設定
APIトークン 初回のみのため、本番環境への移送時に手作業で設定
Webhook 基本的に利用しない
キントーンの一覧の列幅 基本的に利用しない

さいごに

ここまでで、キントーンのgit管理を説明いたしましたが、
最終的には本ソースを別環境(本番環境)に移送することが目的ですので、
次回は、移送方法について説明します。

ABOUT ME
Fukunaga
Fukunaga
リードエンジニアしてます。フロントからサーバサイドまで、フルスタックで担当。 DBチューニングが得意。最近はキントーン開発、AI/分析作業など従事しています。