kintoneでJavaScript開発を行う

kintoneとは

kintoneとは、サイボウズ株式会社が提供しているwebデータベース型のビジネスアプリ構築クラウドサービスです。
システム開発初心者でも簡単にシステムを構築することができ、また豊富なAPIやプラグイン、JavaScript等により細かい用途に沿ったカスタマイズも行うことが出来ます。
更にSNSのようなコミュニケーションツールも搭載しており、チームで使いやすいサービスとして今注目されています。

kintone -- https://kintone.cybozu.co.jp/

本記事の目的

本記事では、kintoneでJacaScript開発を行うための準備、また簡単な処理を行ってみます。
先述の通り、kintoneは開発無しでも利用できるサービスですが、細かい用途に沿ったシステムを構築するためにはJavaScript開発が必要となってきます。

準備するもの

kintoneでJavaScript開発を行うためにプラグインを追加します。
プラグインとは、kintoneをカスタマイズするためのJavaScriptやCSSファイルをパッケージングしたものです。
今回は「JSEdit for kintone」というプラグインを追加します。

kintoneヘルプ : プラグインを追加／削除する(アプリ設定） -- https://jp.cybozu.help/k/ja/user/app_settings/plugin.html
cybozu developer network : JSEdit for kintone -- https://developer.cybozu.io/hc/ja/articles/205452653

JavaScript記述

では、実際にJavaScriptを書いてみます。
JavaScript編集画面は、下記手順で開きます。
「任意のアプリ」⇨「アプリ設定」⇨「設定」⇨「プラグイン」⇨「『JSEdit for kintone』の設定ボタン」

このような画面が開きました。
「新規作成」ボタンから、jsファイルを作成することが出来ます。

次に、kintoneでjavascriptを記述をする際の作法ですが、
下記の流れで記述する必要があります。

イベントを指定（どのタイミングで処理を実行するか、いわゆる発火点）
↓
処理内容を記述

では実際に書いてみましょう。

(function() {
  'use strict'; //お作法のようなものなので気にせずOK

  // レコード一覧画面の表示時のイベント処理
  kintone.events.on('app.record.index.show', function(event) {
    window.alert('おはようございます');
  });

})();

このJavaScriptは、
任意アプリで「レコード一覧画面を開く」というイベント発生時に
ウィンドウに「おはようございます」を表示する、という処理を実行する、
という内容になります。

イベントの詳細については、下記URLを参照して下さい。

cybozu developer network : イベント処理の記述方法 -- https://developer.cybozu.io/hc/ja/articles/201941954

では、このJavaScriptを保存し、
実際にkintoneでレコード一覧画面を開いてみましょう。

無事、表示されました。

まとめ

今回は基礎的な部分を紹介しました。
次回は、応用的な処理を出来ればと思います。