一から始めるローコード開発――タスク管理アプリ作成で分かるkintoneの基本機能：kintoneで始めるローコード開発入門（2）

　続いて、チームの共有タスク管理システムに必要なフィールド（項目）を定義します。以下のような項目が、一般的なタスク管理システムでは必要になりそうです。

1. フィールドを配置する

　これらのフィールドを配置します。画面左側に用意されているパーツから、画面右側のキャンバスに、図4のようにドラッグ＆ドロップして追加してみましょう。

2. フィールドを設定する

　例えば「文字列1行」ボックスを設定するならば、図5のようにマウスオーバーして設定ボタンをクリックします。

　フィールド設定画面（図6）が開くので、フィールド名を「タスク名」と入力し、［保存］をクリックします。

　その他のフィールドも、同じ要領でフィールド名を設定します。なお、［ドロップダウン］フィールドについては、あらかじめ用意した選択肢から選択ボックスの形式で目的のデータを選択できます。図7の要領で選択肢を設定しておきましょう。

　［ドロップダウン］フィールドの選択肢は、［項目と順番］で［＋］ボタンから増やせます。選択肢の値としては、今回は「未着手」「作業中」「完了」を定義しました。

　これで、必要なフィールドがシステムに追加できました。この時点で、図8のような画面ができていることを確認してください。

3. フィールドの配置などを調整する

　ここで、フィールドの配置やデザインも調整しておきます。フィールドの横幅と縦幅は、配置したフィールドの右辺／底辺をドラッグして調整できます（図9〜10）。

　位置を変更する場合は、フィールド中央にマウスオーバーして、ドラッグしたまま移動させます。最終的に図11のようなレイアウトになるよう、各項目の幅や配置を調整しておきましょう。

　好みや慣れもありますが、縦スクロールが少ない方が業務担当者には好まれる傾向があると思われます。視覚的に分かりやすく、間延びしない配置のバランスを考慮できると、システムの使い勝手が向上するでしょう。

4. アプリの動作を確認する

　ここで動作確認をしてみましょう。図12の［アプリを更新］をクリックして、設定内容を本番環境に反映させます。

　続いて、作成したチームのタスク管理アプリに新規のタスクデータを登録してみます。図13のような画面が表示されるので、画面右側の［＋］ボタンから新規レコード登録画面に移動します。

　先ほど設定した入力フォームの画面で、図14のように対応ステータスやタスク名、タスク内容などが入力できるようになりました。データを入力したら、画面上部の［保存］ボタンをクリックすればデータ登録完了です。

マスターデータを引用するための機能――ルックアップフィールド

　基本的なフィールドの設定ができたところで、以降は少し応用的なフィールドの設定に進みます。まずはルックアップフィールドです。ルックアップフィールドとは、他のアプリのデータを参照して、現在のアプリに引用できる仕組みです。マスターデータとの連携などに活用できます。

　本稿ではタスク管理システムを例にしているので、タスクがひも付く親プロジェクトをマスターデータから検索して指定できるように設定します。

1. マスターデータを準備する

　図15のように、タスクがひも付くプロジェクトのマスターデータを、事前に別アプリに用意しました。プロジェクトID、プロジェクト名、プロジェクト概要メモのフィールドを持つシンプルなマスターデータです。前項と同じ手順で、図15のようなフォームを作成しました。

　例えば、ここでは図16のようなデータを登録しておくものとします。

2. ルックアップフィールドを設定する

　1. で作成したマスターデータを利用して、各タスクが属するプロジェクトを表すためのルックアップフィールドを、先ほどのタスク管理アプリに設定します。ルックアップフィールドを、画面左側のパーツからフォームにドラッグ＆ドロップした上でマウスオーバーし、フィールド設定を開きます（図17）。

　フィールド設定では、フィールド名と、どのマスターからデータを参照するのかのひも付けを、図18のような形で設定します。それぞれの項目の意味は、表1の通りです。

項目	指定する内容
関連付けるアプリ	先ほどのマスターデータを用意したアプリ（ここでは「プロジェクトマスタ」）
コピー元のフィールド	どの項目をキーにしてデータを探してくるのか（ここでは「プロジェクト名」）
コピー元のレコードの選択時に表示するフィールド	検索結果に複数のデータがある場合に、どのフィールドを表示してデータを選択していくのか（ここでは「プロジェクト名、プロジェクト概要メモ、プロジェクトID」）
表1　ルックアップフィールドの設定

3. ルックアップフィールドの動作を確認する

　ここまでの内容を、実際に動作させて確認してみましょう。図19で［アプリを更新］をクリックして、設定内容を本番環境に反映させます。

　先ほど作成していたレコードに再度アクセスして、レコード編集モードにします。

　レコード編集画面（図21）右上の［関連プロジェクト］が、ルックアップフィールドです。［取得］ボタンを押して、マスターデータを検索します（あるいは、キーワードを入力して［取得］ボタンをクリックすることで、キーワードを含む選択肢に絞り込むことも可能です）。

　該当するプロジェクトの行から［選択］ボタンをクリックすると、データを取得できます。

　これで、マスターデータからのデータ取得、ひも付けが完了です。データを保存するには［保存］ボタンをクリックします。

タスクに関連するデータを管理する――テーブルフィールド

　もう一つ押さえておきたいのが、［テーブル］フィールドです。アプリ自体が1つのテーブルのようではありますが、レコードデータ1件の中にまた子テーブルのように複数行の情報を加えていける機能です。

　タスク管理であれば、各タスクの進捗記録や成果物のファイルを時系列で記録するなどの活用が可能です。その他に契約書管理システムなどであれば、契約書の内容を変更していった背景や注意点などを、変更を加えたファイルとともに記録しておくようなこともできるでしょう。

1. テーブルを追加する

　では、テーブルフィールドを設定していきましょう。フォーム設定画面で、画面左のパーツの中から［テーブル］フィールドをキャンバスに配置します（図24）。

　続いて、テーブルとして管理すべきフィールドを、入れ子で配置していきます。それぞれの項目と追加したフィールドタイプは、以下の通りです。

　最終的には、図25のようなテーブルが出来上がります。

　これで各タスクに関して、誰がどのような対応をしたかという内容や、成果物のファイルなどを記録できるようになりました。

2. テーブルの動作を確認する

　ここまで設定した内容を［アプリを更新］から本番環境に反映し、テーブル機能の動きを見てみましょう。

　先ほどと同じ要領で、作成済みのレコードにアクセスします。

　レコード編集ボタンをクリックして編集可能な状態にしたら、［テーブル］機能を使って入力していきます。

　編集状態にすると、図28のような表示となります。［テーブル］機能では、右端の［＋］／［−］ボタンから行の追加と削除ができます。3段ほど進捗を記入したいので、［＋］ボタンを2回押して行を加えます。

　図29のように行が増えたので、内容を記入して、ファイルも添付してみます。ファイルを添付するには、［参照］ボタンから選択するか、添付ファイルフィールドの領域にファイルを直接ドラッグ＆ドロップしても構いません。

　このように、進捗内容や成果物のファイルなどをタスクにひも付けて記録できました。画面上部の［保存］ボタンをクリックして変更内容を保存して、動作確認は完了です。

レコード一覧ビューを作成する

　これで、タスク管理アプリのデータ登録に関わる部分は一通り完成です。ただし、アプリではデータを単に出し入れするばかりではありません。登録されたデータを一覧した上で、さまざまな条件で絞り込んだり、ソートしたりすることで、業務をより効率的なものにすることができます。

　本稿のタスク管理アプリでも、各メンバーの役割などによって見たい項目や絞り込みの指定などは異なります。それぞれに合わせた条件で、複数のレコード一覧画面を作成してみましょう。

タスク未完了レコードを絞り込むレコード一覧を作成

　まず、タスクのステータスが未完了のものだけを絞り込んで表示する一覧画面を作成してみます。

1. 新規の一覧画面を作成する

　設定には図32のようにアプリの管理画面の［一覧］タブから、画面右の［＋］ボタンから新しい一覧画面を作成します。

　一覧の設定画面が表示されるので、まず［一覧名］に用途や条件が分かりやすい名称を入力しましょう。今回は「未完了のタスク」としておきます。

2. 一覧に加えるフィールドを設定する

　次に、どのフィールドをその一覧に表示するのかを設定します。画面左側の既存のフィールドの一覧から、ドラッグ＆ドロップで追加していきましょう。

　フィールドの並び順は、図35のようにフィールドをドラッグして移動することで変更することも可能です。

3. 絞り込みとソート条件を設定する

　図36のように、絞り込み条件、ソート条件を設定します。

　［条件］欄には、左から「ステータス」「次のいずれかを含む」「未着手／作業中」をそれぞれ選択します。これで、ステータスが完了になったタスクだけを除外できます。

　［ソート］欄には、左から［期限日］「降順」を選択しました。これで期限日が新しいものから並ぶようになります。

4. 一覧画面を確認する

　最後に［保存］−［アプリを更新］をクリックして、一覧の設定は完了です。実際に一覧の表示を確認するに当たって、完了ステータスも含めたデータを追加登録しておきましょう。

　今回は、対応ステータスを「完了」、期限日を「2025年4月27日」、タスク名は「4月本部会資料作成」でデータを登録してみます。［保存］をクリックしてレコードを保存します。

　この状態で、まずは全てのレコードを表示してみます。これには、一覧画面に戻り、プルダウンから［（すべて）］のレコード一覧を選択します。

　対応ステータスが完了であるかどうかにかかわらず、全てのレコードが表示されます。続いて、一覧のプルダウンから［未完了のタスク］の一覧を選択して表示したのが、図40です。

　完了ステータスのレコードは除外され、それ以外の未完了のタスクのレコードが絞り込まれて表示されます。

5. データの絞り込みやソート条件を変更

　既存のデータの絞り込みやソート条件を確認したり、変更したりすることもできます。これには、一覧画面から漏斗（ろうと）のボタンをクリックしてください。

　現在の一覧で設定されているフィルターやソート条件が、図42のように確認できます。ここから条件を変えて、自分の作業したいデータを絞り込んだり、並べ替えての作業も可能です。

　以上で一覧の基本的な操作を含めて動作が確認できました。今回設定してみた一覧の設定以外にも、チームのタスク管理システムであれば、自分が担当者になっているタスクだけを表示する一覧や、期限日が7日前以内に迫ってきているタスクのみを絞り込んだ一覧などを用意しておくことも考えられるでしょう。最初から全てを網羅するのは難しいかもしれませんが、チームメンバーの役割などに合わせて複数の一覧を作成することで、全体の業務効率を向上させていけると理想的です。

まとめ

　今回は、主要なフィールドの設定、一覧の作成などを学びました。これで、kintoneでのローコード開発に必要な基本の機能は半分ほどカバーできました。

　次回はアクセス権限と通知設定、モバイル利用などを見ていきます。引き続きkintoneを例にローコード開発を習得していきましょう。