今回は、ver.2.23のアップデート機能を、よくある利用例のアプリに組み込むデモ実演を行いました。
開発初心者の方にも使いやすいと感じていただける機能が多くあります。
非エンジニアが設定に挑戦してみた感想にもご注目ください！
＼ver.2.23のアップデートを「まだ確認していない」「おさらいしたい」方はこちら／
2023年4月14日（金）更新
MKupdate vol.19「セキュアでスマート！ver.2.23【基本編】
登壇者紹介
CRE部で内製化支援を担当している山本です。SPIRALver.2の良さを広めたいと思っています！
事業推進部 広報販促チームの佐竹です。
SPIRAL営業を6年経験し、今年3月から当部のメンバーとなりました！SE経験は0です。
SPIRAL営業を6年経験し、今年3月から当部のメンバーとなりました！SE経験は0です。
商品購入アプリ概要説明
今回は、佐竹さんに事前に設定いただいたアプリに対して、ver.2.23でアップデートされた新機能を組み込んでいただく過程を通して
”セキュアでスマートなローコード開発体験”をしていただこうと考えています！
よろしくお願いします！まず事前に設定したアプリですが、商品購入アプリです。
商品選択ボタンを押すと商品一覧が表示され、そこから商品を選択して購入できるフォームです。
ナレッジサイトの開発記事を参考に作りました。
商品選択ボタンを押すと商品一覧が表示され、そこから商品を選択して購入できるフォームです。
ナレッジサイトの開発記事を参考に作りました。
開発情報・ナレッジ
ver.2
high
レコードリスト（一覧表）からの複数情報をフォームへ反映する方法
この商品購入アプリにver.2.23のアップデートの新機能を追加していきましょう！
追加の要件は以下の2つです。
・商品マスタDBの価格をルックアップして取得し、購入した商品の個数に合わせて自動で合計金額を計算する。
・アクセス日時と比較して、「商品販売開始日」以降、かつ、「商品販売終了日」以内の設定条件に合う商品データのみ、一覧表に表示する。
ではさっそく始めていきましょう！
・商品マスタDBの価格をルックアップして取得し、購入した商品の個数に合わせて自動で合計金額を計算する。
・アクセス日時と比較して、「商品販売開始日」以降、かつ、「商品販売終了日」以内の設定条件に合う商品データのみ、一覧表に表示する。
ではさっそく始めていきましょう！
DBトリガレコードアクション（参照先DBの値取得）
まずは、商品マスタDBの価格をルックアップして商品購入DBに引き渡す設定をしましょう。
これはDBトリガのレコードアクション という機能を利用します。
これはDBトリガのレコードアクション という機能を利用します。
既存の機能かと思いますが、今回のアップデートでどう新しく変わったんですか？
今回のアップデートでは、”参照先DBの値を”ルックアップして取得し、
参照元DBに格納することができるようになりました。
レコードアクションの処理マッピングの設定箇所で、「アクション先DBフィールド」を設定します。
次に「格納値」の設定ですが、参照先に設定したDBのフィールドがプルダウンに表示されているので「価格」を選択しましょう。
（事前に、商品購入DBに、商品マスタDBを参照先とする参照フィールドの設定が必須です）
次に「格納値」の設定ですが、参照先に設定したDBのフィールドがプルダウンに表示されているので「価格」を選択しましょう。
（事前に、商品購入DBに、商品マスタDBを参照先とする参照フィールドの設定が必須です）
商品マスタの「商品ID1」の「価格」の値を、商品購入DBの「価格1」に格納するよ
ってことですね！
この機能、例えばイベント管理アプリでは、”イベント申し込みDBに会員DBにある会員情報を引き渡して格納する”という要件でも使えますね。
この機能、例えばイベント管理アプリでは、”イベント申し込みDBに会員DBにある会員情報を引き渡して格納する”という要件でも使えますね。
DBトリガレコードアクション（関数設定）
次に、購入した商品の個数に合わせて自動で合計金額を計算する処理を設定します。
こちらもDBトリガレコードアクションの関数設定機能を使います。
こちらもDBトリガレコードアクションの関数設定機能を使います。
関数設定がクリック操作で行えますので、佐竹さんおひとりでやってみますか？
はい、やってみます！税込みの合計金額の計算式は「価格1×商品1個数×1.08」と...。
電卓を触っている感覚でクリック操作でできました！
電卓を触っている感覚でクリック操作でできました！
開発担当者として、バックエンドで値のルックアップや計算が可能であることは、改ざん防止につながり、セキュアな開発を実現する上で重要ですね。
レコードリストブロック フィルタ設定（アクセス日時との比較抽出）
続いて、商品一覧のフィルタ設定をしていきましょう。
レコードリストブロック設定画面で、 日時系フィールドの値と、アクセス日との比較による動的な抽出の設定ができるようになっています。
レコードリストブロック設定画面で、 日時系フィールドの値と、アクセス日との比較による動的な抽出の設定ができるようになっています。
今回は、商品販売開始日と商品販売終了日のフィールドを使って抽出設定をします。
販売中の商品を一覧表に表示する設定をしてみてください。
販売中の商品を一覧表に表示する設定をしてみてください。
商品販売開始日以降、かつ、商品販売終了日以前、のデータを抽出 と。
自分の設定がどうなっているのか、テキストでガイドがでるので安心ですね。
本当にこの設定で正しいのかな？と不安になることもあると思いますが、こういった機能があると安心な気持ちで開発できていいですよね。
おまけ①ソース設定時のフィールド挿入
ソース設定では、ソースコードを書かずにフィールドソースの挿入ができます。
挿入したい箇所にカーソルをおいて、追加したいフィールドをエディター上で選択してみてください。
挿入したい箇所にカーソルをおいて、追加したいフィールドをエディター上で選択してみてください。
入りました！ソースと一緒にフィールド名も入るので正しく挿入されたかが目視確認できますね。
おまけ②デザイン変更（コピペCSS）
フォームやレコードリスト等のデザインをリッチにしたいと思ったことはありませんか？
ナレッジサイトにある「コピペCSS」を使えば、コピーアンドペーストの操作だけで、簡単にリッチなデザインを充てることができます。
ナレッジサイトにある「コピペCSS」を使えば、コピーアンドペーストの操作だけで、簡単にリッチなデザインを充てることができます。
ここのコードをコピーしてCSS記述箇所に貼り付けると・・・
あっという間にデザインがリッチになりました！
CSS記述箇所が分かれているUIだったので、安心して作業できました。
CSS記述箇所が分かれているUIだったので、安心して作業できました。
開発情報・ナレッジ
ver.2
low
レコードリストで使えるコピペCSS 「カスタムデザイン」
開発情報・ナレッジ
ver.2
low
フォームで使えるコピペCSS 「シンプルモダン」
非エンジニアの感想
無事、全ての設定が完了できましたね！
トリガからデザインまで多伎に渡る実装をしましたが、佐竹さん、ここまでやってみてどうでしたか？
トリガからデザインまで多伎に渡る実装をしましたが、佐竹さん、ここまでやってみてどうでしたか？
非エンジニアの私でも、コードを使わずに高度な設定が簡単にできました！
ノーコードの範囲が広いことは本当にありがたいなと感じました！
ノーコードの範囲が広いことは本当にありがたいなと感じました！
まとめ
ver.2は、プラットフォーム側で手際よく安全に開発を行うことができる機能だったり、
レコードアクションの演算トリガや、フィールドソースの追加、HTML、CSSなどのソース設置場所が独立しているUIなど、開発のしやすさを意識した便利な機能をたくさん用意しております。
開発に慣れている方はもちろん、初めて開発を行う方にもセキュアでスマートな操作ができるプラットフォーム環境に成長してきています！
開発に慣れている方はもちろん、初めて開発を行う方にもセキュアでスマートな操作ができるプラットフォーム環境に成長してきています！
ver.2を使用して自社でWEBアプリ開発を完結できるため、
多くの方に「自社開発」を身近に感じていただき、WEBアプリ開発の選択肢に「自社開発」を入れてもらえれば嬉しく思います。
そして、スパイラルでは安心してver.2での自社開発をしていただけるよう、支援サービスや支援サイトを用意しており、
今後もより良くしていく所存です。
内製化・開発支援サービスのほうも、どうぞよろしくお願いいたします！
内製化・開発支援サービスのほうも、どうぞよろしくお願いいたします！
①SPIRALver.2は、これまでもこれからもセキュアでスマートな環境に成長中！
②WEBアプリ開発において「自社開発」を選択肢に。
③内製化・開発支援サービスを提供中。
②WEBアプリ開発において「自社開発」を選択肢に。
③内製化・開発支援サービスを提供中。
2023年4月14日（金）更新
MKupdate vol.19「セキュアでスマート！ver.2.23【基本編】
