kintoneでプラグインを開発する手順は?簡単な追加方法やおすすめ無料プラグインも紹介

合同会社なまけもの
監修者
合同会社なまけもの 代表社員 金谷 道
最終更新日:2024年07月16日
kintoneでプラグインを開発する手順は?簡単な追加方法やおすすめ無料プラグインも紹介
この記事で解決できるお悩み
  • kintoneでプラグインを開発する手順とは?
  • kintoneでプラグインを簡単に追加する方法とは?
  • kintoneでおすすめの無料プラグインとは?

kintoneでプラグインを開発するにはアイコンファイルをはじめ、各種ファイルの作成が必要です。他にはどのような作業が必要でしょうか。

この記事を読むと、kintoneでプラグインを開発する手順やプラグインを簡単に追加する方法、おすすめの無料プラグインなどについて理解できます。kintoneのユーザビリティ向上を目指している方、業務効率改善を目指している方は、参考にしてください。

システム開発にお困りではありませんか?

もしも今現在、

  • どの開発会社に依頼したらいいかわからない
  • ChatGPTを使ったシステムを開発したい
  • 新たな機能・システムを導入したい

上記のようなお困りがありましたら、比較ビズへお気軽にご相談ください。比較ビズでは、複数のシステム開発会社に一括で見積もりができ、相場感や各社の特色を把握したうえで業者を選定できます。見積もりしたからといって、必ずしも契約する必要はありません。まずはお気軽にご利用ください。

システム開発会社を一覧から探す

kintoneでプラグインを開発する手順

ビジネス_建物

プラグイン開発は既存プラグインを活用するのに比べ、自由度が高い機能拡張をできる点が特徴です。プラグインに必要なファイルのパッケージングと一括適用ができるため、何度もファイルを個別にアップロードする必要はありません。

kintoneでプラグインを開発する場合、以下の手順に沿って作業を進めていきます。

  1. 各種ファイルを準備する
  2. マニフェストファイルを作成する
  3. 各種ファイルのパッケージングをおこなう
  4. 各種ファイルをインストールする

1. 各種ファイルを準備する

アイコンファイルやPC用JavaScriptファイルなど、各種ファイルを作成する工程です。プラグイン開発で必要となるファイルは以下のとおりです。

  概要 備考
アイコンファイル 各ファイルを画像で識別 どのデバイス向けプラグインを開発する場合も不可欠
PC用JavaScriptファイル 実装したい機能をPC画面に記述 スマートフォン向けプラグインを開発する場合、作成は不要
スマートフォン用JavaScriptファイル 実装したい機能をスマートフォン画面に記述 PC向けプラグインを開発する場合、作成は不要
PC用CSSファイル PC画面で使用するスタイルシート スマートフォン向けプラグインを開発する場合、作成は不要
設定画面用JavaScriptファイル プラグインの設定画面で記述 開発するプラグインの内容に応じて準備
設定画面用CSSファイル プラグインの設定画面で使用するスタイルシート 開発するプラグインの内容に応じて準備
設定画面用HTMLファイル 設定画面で文字の装飾や画面の埋め込みなどをおこなうファイル 開発するプラグインの内容に応じて準備

スマートフォン向けプラグインやPC用プラグイン、どちらを開発する場合でもアイコンファイルの作成は欠かせません。アイコンファイルは各種ファイルを画像で識別する役割を担っています。

スマートフォン向けプラグインを開発する場合は、PC用ではなくスマートフォン用スタイルシート(CSS)が必要です。スタイルシートとは文字のフォントや大きさ、色など、文字の見栄えに関する情報を集約したファイルになります。

2. マニフェストファイルを作成する

マニフェストファイルとはパラメータ名や型式など、プラグインに関する情報をまとめたファイルです。ファイルのフォーマットは「JSON形式」を選択します。

作業中はJavaScriptファイルとCSSファイルをオンラインストレージに保存し、マニフェストファイルで保存したURLを指定しましょう。コードを記述しながら動作確認が並行して進められるため、記述ミスや不具合を早期に発見できます。

タグ指定を「config.html」で記述するとパッケージングの際にエラーになるため、注意が必要です。

3. 各種ファイルのパッケージングをおこなう

パッケージングとは、プラグイン開発に必要なファイルをzipファイルにまとめていく作業です。「plugin-packer」を活用すると、コマンド指定によってパッケージングを自動化できます。

plugin-packerをインストールし、パッケージングしていく手順は以下のとおりです。

  1. 「npm install -g @kintone/plugin-packer」と書き込む
  2. 作成した各ファイルとマニフェストファイルを配置する
  3. 各ファイルをまとめたディレクトリの1つ上に移動する
  4. 「$ kintone-plugin-packer src」を実行する
  5. 「Succeeded: DIRECTORY_PATH/work/plugin.zip」が表示される
  6. プラグインファイルと秘密鍵ファイルが作られる

参照:cybozu developer network|kintone プラグイン開発手順

plugin-packerを使うには「Node.js」 と「npm」が必要です。Node.jsをインストールすると、npmも自動で付随されるため、別途インストールする必要はありません。

作成した秘密鍵ファイルは2回目以降のパッケージングでも使用するため、大切に保管しましょう。

Node.js とnpmについて

Node.jsはJavaScriptをサーバーサイトで稼働させるためのプラットフォームを指します。npmはNode.jsを管理するパッケージ管理ツールです。

4. 各種ファイルをインストールする

作成したプラグインファイルをkintoneへインストールする工程です。kintoneのシステム管理画面からインストールした場合の手順は以下のとおりです。

  1. kintoneのシステム管理画面を開き、プラグインを選択する
  2. 読み込むを選択する
  3. 参照ボタンをクリックし、作成したプラグインファイルを選択する
  4. 読み込むを選択した後、インストールされたプラグインを確認する
  5. 作成したプラグインが表示されているかを確認する

参照:cybozu developer network|kintone プラグイン開発手順

2回目以降も同じプラグインファイルをパッケージングするケースもあるでしょう。オプションで秘密鍵ファイルを指定すると、kintoneへインストールする際に内容が上書きされます。

kintoneでプラグインを簡単に追加する4つの方法

ビジネス 歯車

kintoneでプラグインを追加する方法は以下の4つです。

  • ファイルからプラグインを読み込む
  • プラグインストアを利用する
  • plugin-uploaderを活用する
  • create-pluginを活用する

専門知識が必要な開発作業を任せられる人材がおらず、困っている方もいるでしょう。プラグインを利用するだけで多くの機能を拡張できます。各手法の手順を把握し、自社に合った方法を選択しましょう。

ファイルからプラグインを読み込む

kintoneのパートナー企業や自社が開発したプラグインを追加する際に選ぶ方法です。ファイルからプラグインを読み込む際の手順は以下のとおりです。

  1. kintoneのシステム管理画面からプラグインを開く
  2. 「読み込む」をクリックする
  3. 「参照」をクリックする
  4. 読み込むプラグインのファイル「***.zip」を選択する
  5. 読み込むをクリックした後、プラグイン名が表示されているかを確認する

参照:kintoneヘルプ|プラグインを追加/削除する(システム管理)

プラグインの内容をアプリへ反映させるには、アプリの設定アイコンから設定内容を更新する必要があります。1つのアプリにプラグインできる数は最大20個までです。ライトコースの場合、プラグインは利用できません。

読み込んだプラグインをアップデートする際は、最新バージョンのファイルを上記の手順で読み込みます。

プラグインストアを利用する

メールワイズ連携やGaroonとのスケジュール連携をプラグインする際の選択肢となります。プラグインストアを利用した場合の手順は以下のとおりです。

  1. kintoneのシステム管理画面からプラグインを開く
  2. 「読み込む」をクリックする
  3. ステータス欄からインストールをクリックする
  4. OKをクリックする

参照:kintoneヘルプ

完了後、選択したプラグインのステータスが「インストール済み」と表示されているかを確認してください。表示されている場合、無事にプラグインが完了しています。

プラグインの後はファイルを読み込んだ際と同様、アプリの設定アイコンで更新作業が必要です。プラグインストアから導入した場合はアップデートが自動的におこなわれるため、自社で対応する必要はありません。

plugin-uploaderを活用する

plugin-uploaderは、作成したプラグインファイルをアップロードするためのツールです。kintoneへのアップロードを自動化でき、システム管理者は別の作業に労力を割けます。

plugin-uploaderをインストールした際のプラグイン開発の手順は以下のとおりです。

  1. 「npm install -g @kintone/plugin-uploader」と打ち込む
  2. プラグインファイルを準備しておく
  3. 適用するドメイン名やログイン名を確認しておく
  4. 「https://examle.cybozu.com 」の後にログイン名を入力する
  5. パスワードを入力する
  6. kintoneのシステム管理画面からプラグインを開く
  7. 「読み込んだプラグイン」にサンプルプラグインが追加されているかを確認

参照:cybozu developer network

plugin-uploaderを使う際にも、Node.jsとnpmが必要です。

create-pluginを活用する

create-pluginはプラグインのテンプレートを作成するツールです。plugin-uploaderと同様、使用するにはNode.jsとnpmが必要になります。

create-pluginはプラグイン開発初心者、オリジナル機能を搭載したプラグインを開発したい方におすすめです。create-pluginを使って、テンプレートを作成する手順は以下のとおりです。

  1. 「npm install -g @kintone/create-plugin」と打ち込む
  2. 「create-kintone-plugin sample_plugin_project」と打ち込む
  3. プラグインに関する情報を入力する
  4. プラグインファイルと「sample_plugin_project」ディレクトリが生成される

参照:cybozu developer network

3では対話形式でプラグインの名前や説明文などを入力してます。完了後は「plugin-packer」や「plugin-uploader」を活用し、kintoneへのインストールをスムーズに進めましょう。

kintoneでおすすめの無料プラグイン5選

ビジネスイメージ

無料プラグインは費用をかけなくても、kintoneの機能性を高められる点が魅力です。kintoneでおすすめの無料プラグインを5つ紹介します。

  • 一覧テキスト検索絞り込みプラグイン
  • 文字結合プラグイン
  • カレンダーPlus
  • 一覧画面編集プラグイン
  • 一覧集計プラグイン

複数のプラグインを活用すると、業務効率をより高められるでしょう。

一覧テキスト検索絞り込みプラグイン

kintoneの一覧画面からテキストデータを絞り込めるプラグインです。プラグインによって一覧画面の上部に検索窓が表示され、キーワードを入れると必要な情報を抽出できます。アプリのアイコン画面での設定変更以外、プラグイン後に必要な作業は発生しません。

通常、kintoneの一覧画面には検索窓が表示されておらず、テキストデータの絞り込みがしづらい状況です。一覧テキスト検索絞り込みプラグインの活用によって、無駄な時間を削減できます。

文字結合プラグイン 

最大5つのフィールドに入力された値を結合できるプラグインです。通常の連結機能では対応できないルックアップデータとの結合にも対応しています。

ルックアップとは顧客情報や販売実績など、別のアプリに保存されているデータをコピーして反映させる機能です。通常、ルックアップフィールドからデータを取り込もうとしても、重複不可の設定にkintoneは対応していません。

文字結合プラグインの利用によって、他のアプリから必要なデータをスムーズに取得できます。

カレンダーPlus

カレンダーPlusを導入すると、予定の内容や担当者別に色分けができるため、一目で今後のスケジュールを把握できます。複数日にまたがる予定やリソース別での表示にも対応するなど、機能性が充実している点が特徴です。

ドラッグ&ドロップで編集作業が進められるため、従業員のITリテラシーに左右される心配はありません。操作性に戸惑うことなく、直感的に操作できます。

一覧画面編集プラグイン

一覧画面編集プラグインはエクセルと同じような感覚で操作できる点が特徴です。プラグインとアプリでの設定を終えると、自動で一括編集画面が作成されます。

通常、kintoneの一覧画面にはレコードの絞り込みやグラフ表示機能が搭載されている一方、データの一括編集機能は搭載されていません。一覧画面編集プラグインの導入によって、データ抽出や編集作業の手間を大幅に削減できます。

一覧集計プラグイン

一覧集計プラグインはエクセルの操作時と同様、平均値や合計値を簡単に計算できるプラグインです。集計パターンや端数の切り捨て可否、小数点以下の表示など、設定条件を入力するだけで任意の範囲を自動計算できます。

データを集計する際、毎回アプリのグラフマークから条件を指定する必要もありません。一覧画面編集プラグインとの併用すると、よりデータ分析を効率化できます。

kintoneでプラグイン開発前に整理しておくべき5つのポイント

ビジネス_握手

kintoneのプラグイン開発を決断する前に、以下5つの点を整理しておきましょう。

  1. サンプルアプリで代用できないかを確認する
  2. 外部サービスとの連携を検討する
  3. サイボウズ社品との連携を検討する
  4. 専門知識を持った人材がいるかを確認する
  5. 外注先を探す際はビジネスマッチングを活用する

ポイント1. サンプルアプリで代用できないかを確認する

アプリに実装を検討している機能が、サンプルアプリで代用できないかを確認しておくことが重要です。導入後すぐに運用できるよう、kintoneには部署や用途別に100種類以上のサンプルアプリが用意されています。

サンプルアプリの例は、以下のとおりです。

  • 商品見積書
  • 旅費精算申請
  • 備品管理
  • 購買支援
  • ワークフロー
  • アルコールチェック記録

仮にサンプルアプリで代用できた場合、各種ファイルの作成やツールのインストールをおこなう必要はありません。手間をかけずに業務の効率性と正確性を高められます。サンプルアプリ同士でのデータ連携も可能です。

プラグイン開発に取り組む前にサンプルアプリの活用を検討しましょう。

ポイント2. 外部サービスとの連携を検討する

API連携やWebhookを利用すると、外部サービスとスムーズにデータ連携ができ、業務効率改善を図れます。

kintoneとの連携が可能な外部サービスの一例は、以下のとおりです。

  • GoogleWorkSpace
  • Microsoft 365
  • AWS
  • Box
  • LINEWorks
  • slack
  • freee

GoogleWorkSpaceやMicrosoft 365など、業務で使用頻度の高いツールと連携が望める点が魅力です。上記以外にも200種類以上の拡張機能をkintone上から搭載できるため、スムーズに利便性を高められます。

ポイント3. サイボウズ社製品との連携を検討する

kintoneと同じくサイボウズ社が提供する「Garoon」や「メールワイズ」とも連携できるため、プラグイン開発の前に求める機能が搭載されているかを確認しましょう。

Garoonは社内ポータルサイトやファイル管理など、さまざまな機能を搭載したグループウェアです。kintoneとGaroonを連携させた場合はスケジュールや資料、連絡事項などをスムーズに共有でき、従業員間のコミュニケーション活性化を図れます。

メールワイズは1ユーザー月額550円から利用できるメールシステムです。kintoneと連携した場合、エクセルで作成したデータから顧客リストを簡単に作成できます。

ポイント4. 専門知識を持った人材がいるかを確認する

プラグイン開発の前に、プログラミングに精通した人材が社内にいるかを確認しましょう。各種ファイルを作成して1からプラグイン開発をおこなう場合、コーディングやプラグイン同士の親和性など、幅広い分野の知識が必要です。

専門知識を持つ人材が社内に不在の場合は、システム開発会社を活用しましょう。安定志向の高まりやフリーランスへの転向などが原因でIT人材は人手不足が続いており、優秀な人材を短期間で採用するのは難しい状況です。

システム開発会社にプラグイン開発を依頼すると、従業員の業務負担を軽減しつつkintoneのユーザビリティ向上を実現できます。

ポイント5. 外注先を探す際はビジネスマッチングを活用する

システム開発会社を選定する際、ビジネスマッチングの活用を検討してみましょう。ビジネスマッチングとは「仕事の発注先を探す企業」と「仕事の受注先を探す企業」をつなげるサイトです。

業種や地域など必要な情報を入力するだけで、自社の条件に合致した企業が提示されます。得意分野や実績、対応可能な業務など、各企業ごとの特徴がコンパクトにまとめられている点も魅力です。

まとめ

今回の記事では以下の4点に関して述べてきました。

  • kintoneでプラグインを開発する手順
  • kintoneでプラグインを簡単に追加する方法
  • kintoneでおすすめの無料プラグイン
  • プラグイン開発の前に整理しておくべきポイント

kintoneで1からプラグインを開発するには、アイコンファイルやPC用JavaScriptファイルなど、各種ファイルの作成が必要です。ファイルの作成にはプログラミング言語やプラグイン同士の互換性など、幅広い知識が求められます。

プログラミングに精通した人材が社内に不在の場合は、システム開発会社にプラグイン開発を依頼しましょう。「比較ビズ」を利用すると、必要事項を入力する2分程度で条件に合ったシステム開発会社を探し出せます。

kintoneのプラグイン開発に対応可能な外注先を探している方は「比較ビズ」を利用してみてください。

監修者のコメント
合同会社なまけもの
代表社員 金谷 道

組み込みエンジニアからキャリアをスタートし、Techベンチャー数社と大手SIerで技術責任者と事業開発を経験。技術とデザインの両面から設計が出来ることが強み。現在は各社の経営層の相談相手・新規事業企画をメイン業務としている。大手金融機関のポータルサイト、AIを使用したタレントマネジメントツール、ウェビナーメディアの立ち上げなどの実績がある。

kintoneはプログラミング無しでも様々な業務アプリケーションを実装することが出来、非常に強力なツールです。既存機能で物足りない、という部分で出番があるのがプラグインです。プラグインはJavascript/cssで作成することが出来ます。

プラグイン開発自体は難易度は高くないのですが、「kintoneでどう実現するか」の部分である程度の知識が必要となります。プラグイン開発を得意としている会社であれば様々なケースを体験しているため、ベストな解決方法を提供してくれるでしょう。

注意点としては、業務系アプリ全般にいえることですが「出来るだけシステムに合わせる」ことも重要です。カスタマイズは確かに目先の使いやすさをアップしてくれますが、コストもかかりますしアップデートへの対応も必要です。

本当に必要なカスタムだけを行うためにも、業務自体の設計を整理することも非常に重要です。
比較ビズ編集部
執筆者

比較ビズ編集部では、BtoB向けに様々な業種の発注に役立つ情報を発信。「発注先の選び方を知りたい」「外注する際の費用相場を知りたい」といった疑問を編集部のメンバーが分かりやすく解説しています。

システム開発にお困りではありませんか?

もしも今現在、

  • どの開発会社に依頼したらいいかわからない
  • ChatGPTを使ったシステムを開発したい
  • 新たな機能・システムを導入したい

上記のようなお困りがありましたら、比較ビズへお気軽にご相談ください。比較ビズでは、複数のシステム開発会社に一括で見積もりができ、相場感や各社の特色を把握したうえで業者を選定できます。見積もりしたからといって、必ずしも契約する必要はありません。まずはお気軽にご利用ください。

システム開発会社を一覧から探す