3つのステップと
ウィジェットで開発
Valence App Builderは、IBM i上のライブラリやファイルを利用するWebアプリケーションを、「ローコード」と呼ばれる手法で開発するツールである（図表1）。
ローコード開発とは、Webベースのビジュアルな開発、ウィジェットやテンプレートなどの活用、最小限のコード（コーディング）の追加、などを特徴とし、従来からの手法と比較して、より高速かつ簡単に開発を行える手法を指す。
では、Valence App Builderのどのような点が「ローコード」なのか、ツールを操作してみよう。
Valence App Builderは、データソースの作成、ウィジェットの作成、アプリケーションの作成という3つのステップで開発を進める（図表2）。ここでは、IBM i上の「取引先マスター」と「担当者マスター」を利用して「取引先マスターメンテナンス」というアプリケーションを作成してみる（図表3）。
7つの工程をナビで進む
データソースの作成
Valence App Builderを起動後、ファースト画面の左横のタブが「データソース＆ウィジェット」（図表4）になっていることを確認して右下の「+」をクリックすると、「データソースの追加」ステップがスタートする。
［図表4］「データソースの作成」の開始
「データソースの追加」ステップでは、「①ファイル」の作業を終えると、次の「②結合」の設定画面が表示され、最後の「⑦プレビュー」まで順番に自動でナビゲートしてくれるので（図表5）、開発者は表示される画面の指示に従い、ファイル名を入力したり項目を選択するだけで済む。
［図表5］ファイルの選択とライブラリ名の入力
「①ファイル」は、IBM i上にあるファイル名の入力とライブラリの指定である（図表5）。ここでは取引先マスターと担当者マスターを利用するので、ライブラリ名のVALALLLIBを選択し、M_TORHKI、M_TANTOと入力する。これを終えると「②結合」へ移る。
②の画面中の［マッピングの追加］でファイルの結合条件を指定する。［送信元フィールド］では担当者マスターの担当者CD（コード）であるT_TANTO_CDを、次の［送信先フィールド］では取引先マスターの担当者CDであるR_TANTO_CDを選択する（図表6）。
［図表6］ファイルの結合（結合条件の指定）
「③カラム」は、ウィジェットの作成に必要なフィールドの設定である。今回は取引先マスターの全フィールドと担当者マスターの担当者名を対象とするので、VALAPPLIB/M_TORHKIの全フィールドと、VALAPPLIB/M_TANTOのT_TANTO_NM（担当者名）を選択する（図表7）。
［図表7］カラム（フィールドの選択）
次に、特定の担当者の絞り込み（④フィルタ）や取引先ごとのグループ化（⑤グループ分け基準）などを行う手順へ移るが、今回は何も設定しないので、④と⑤はパスした。
「⑥順序付け基準」は、データの並び順の指定である。ここでは取引先CDの昇順に並べるので、「取引先CD」を選択し、［方向］がASCになっていることを確認して（図表8）、最後の「⑦プレビュー」へと進む。
［図表8］順序付け基準（データの並び順の指定）
⑦プレビューでは、作成結果のデータソースが正しいか、左側の［サンプル結果］で確認できる（図表9）。確認できたら名前を付け（今回は「取引先DS01」）保存して、データソースの作成は終了である。
［図表9］プレビュー
ウィジェットを選択し
表示項目や動作内容などを設定
データソースの作成の次は、「ウィジェットの作成」ステップである。作成したデータソース名（取引先DS01）の左横の「…」をクリックして［ウィジェットの作成］を選択すると、ウィジェットの一覧が表示される（図表10）。ここから、レコードの編集や新規追加が可能な［Edit Grid］を選択し、Edit Gridの設定画面を表示させる。
［図表10］ウィジェットのタイプを選択
Edit Gridの設定も、左列の［カラム］［設定］［編集］［フィルタ］の順にナビゲートされるので、開発者は表示される画面の指示に従い入力や選択を行うだけである。
［カラム］ではGridに表示する項目を選択する。ここでは、FAXは不要なのでチェックを外し、それ以外はすべてチェックを付ける（図表11）。
［図表11］ウィジェットの設定（グリッドに表示する項目の選択）
次の［設定］はウィジェットの動作設定である。今回はExcelのダウンロードを許可したいため、画面右側・下の［データ］の［+］をクリック。すると［データ］画面がポップアップされるので、［ダウンロード］にチェック（図表12）。これで次の［編集］へ移る。
［図表12］ウィジェットの設定（動作設定）
［編集］は、レコードを追加・編集・削除するための条件の定義である。それぞれ必要な項目にチェックを入れれば設定は済む（図表13）。次の［フィルタ］では、アプリケーション実行時にユーザーが指定可能な絞り込み条件の指定を行う。今回は、［フィールド］欄のF1_R_TRHKI_NM（取引先名）とF1_R_TAN TO_CD（担当者CD）にチェックを入れ、チェックを付けた行の［演算子］欄を「含む」と［＝（一致）］に設定した（図表14）。これで「取引先一覧W01」とファイル名を付けて保存すれば、ウィジェットの作成は終了である。
［図表13］ウィジェットの設定（編集）
［図表14］フィルタ（実行時の絞り込み条件の定義）
テンプレートを使い
RPGプログラムを開発・連携
ウィジェットの作成の次は、「アプリケーションの作成」ステップである。図表15（上）からアプリケーション作成画面に入ると、［ウィジェットの追加］画面が開く（図表15・下）。作成したウィジェット（取引先一覧W01）を選択すると、ワークスペース上に選択したウィジェットが配置される。今回はウィジェットが1つなので、「取引先マスターメンテナンス」とアプリケーション名を付けて保存すれば作業は終了である（図表16）。Valence Portal画面へ戻ると、作成したアプリケーションがメニューに表示されている（図表17）。メニューを選択すると、作成した「取引先マスターメンテナンス」が実行できる。
［図表15］アプリケーションの作成
［図表16］ワークスペース上へのウィジェットの配置
［図表17］Valence Portalへの作成アプリケーションの追加
今回はシンプルなアプリケーションを作成したが、ユーザーが指定と異なる入力をしたときに、エラーメッセージを返すようなプログラムが必要になる場合がある。
そうしたエラーチェックは、Valence App BuilderではフリーフォームRPGプログラムを呼び出して行う。ただし、そのプログラムは一からコーディングするのではなく、Valence App Builderが用意しているテンプレートをRPGプログラムにコピー＆ペーストし、指定の箇所を書き替えるだけで済む。
「Valence App BuilderからRPGプログラムを呼び出す設定は、［ウィジェットの追加］中の［編集］画面でRPGプログラムのIDを指定するだけで行えます（画面18）。そのRPGプログラムはテンプレートの一部を書き替えるだけで済み、ビジネスロジック部分は固定長フォームで開発可能です」と、ミガロ.の尾崎浩司氏（RAD事業部 営業・営業推進課 専任）は説明する。
［図表18］ボタンのクリック時に呼び出すRPGプログラムを設定
＊
今回の「取引先マスターメンテナンス」は、コーディングをまったく必要としないノー・コードで開発できた。これなら筆者のような開発経験の乏しい人間にも十分に使いこなせそうだ。最後に補足したように、テンプレートを使ってRPGプログラムを追加すれば、さらにきめ細かい複雑な作り込みも可能である。ミガロ.はValence App Builderが「ローコード対応」であることを強調しているが、説得力がある。
［i Magazine 2018 Winter（2018年11月）掲載］
