Glideを使ってノーコードで塾の予約アプリを作りながら、Glideの機能をみてみます。 前回は、実際に塾の予約アプリを作るためのタブとコンポーネントの配置をタブごとに決めていきました。
【自分で作るGlide】５：塾の予約アプリの画面を設計−ノーコードで塾の予約管理アプリを作る
Glideでノーコードアプリを自作してみるシリーズ。ここでは、アプリの画面設計をしていきます。タブやコンポーネントの設定方法を説明します。
今回は、ボタンを押したときの挙動を決めるアクションの設定についてご説明します。塾の予約アプリの要ともなるレッスンの予約を決めるボタンを例にしてみていきます。
アクション
アクションは、コンポーネントごとに設定されるもので、コンポーネントがクリックされた際にどのような動きをするかを規定します。ボタンだけでなく、リストや地図ボタンなどでも設定することができます。
アクションの種類
アクションは用意されているものから選ぶ他、新たに作ることもできます。既成で用意されているものは、
- 現在のテーブルに行を追加してデータを記録する
- メールやSMSを作る、送信する（有料）
- 指定の電話番号に電話する
- タブを移動する
- データの値を増やす
- ウェブページを開く
- バーコードを読み取る
- 指定のテーブルのデータを更新する
- 地図を表示する
- リストのクリックされた行を表示する
- Zapierのツールを呼び出す
などです。これだけでも十分なアクションが用意されていますが、新たに作ることで、条件分岐を追加することができます。
なお、既成のアクションを選んだ場合も、関連するテーブルやデータの指定など、詳細設定をすることができます。
アクションの作成
新たにアクションを作成するには、ドロップダウンの最初に出てくる「Create new action」を押します。
アクション作成画面では、条件分岐とそれに応じたアクションの設定ができます。
なお、作成するアクション一つの中でアクションは複数設定することができますが、条件分岐はアクション開始直後の一回だけです。
作成したアクションは名前（必須）をつけて保存します。
条件分岐
条件分岐の設定はシンプルです。判定対象データと条件、比較対象データを設定します。判定結果が真と偽の場合の両方にその後のアクションを設定することができます。判定条件を複数設定することもできます。
アクションの設定
続いて条件分岐後のアクションの設定を行います。条件分岐につながっているアクションのボタンを押すと詳細を設定することができます。
設定できるアクションは既成のものと同じです。ドロップダウンリストから実行したいアクションを選び、詳細も設定します。
レッスンの予約を予約リストに記録します。
アクションを追加するには、条件分岐やアクションの底に表示されるプラスボタンを押します。出てくるアクションのリストから使いたい機能を選びます。ここでは「Add row」を選び、テーブルに行を追加するアクションを設定します。
Add rowを使ってテーブルに行を追加する
Add rowは現在のテーブル以外のテーブルにも行を追加することができますので、テーブルには「予約リスト」を指定します。そしてテーブルの各列のデータを指定します。
データは、現在のテーブルのデータとユーザー情報データを参照することができます。予約を取ったユーザーのID、予約されたレッスンのIDと予約日時（現在の日時）をデータとして追加します。
これで予約は取れるようになりました。ボタンを押して取れた予約は、予約リストで確認することができます。
予約キャンセルのアクションを設定
塾の予約アプリでは、予約時とキャンセル時にアクションが必要です。予約のキャンセルは、マイページの予約確認画面にキャンセルボタンを配置して行うようにします。
まずはボタンを配置します。
次に、アクションの設定に移ります。
Set columnsを使って列のデータを上書きする
「Create new action」を選び、アクションの作成に進みます。
予約リストの「状況」列を「予約」から「キャンセル」に変更します。これにより予約がキャンセルされたことが確認できます。
アクションの「Set columns」を使って、「状況」列を上書きします。
アクションに名前をつけて保存します。実際に、ボタンを押して挙動を確認してみます。
予約リストの当該行の状況が「キャンセル」に変更になりました。
列の値に数式は入れられない
Set columnsアクションで「受講者数」列を上書きさせることを考えます。受講者数列を参照して値を1減らし、受講者数列に上書きする、という手順です。減らす前の受講者数は一定ではありませんので、都度参照する必要があります。
Set columnsをアクションに指定して詳細設定に進んでみます。Set columnsアクションでは、リレーションのあるテーブルへのデータ上書きもできます。ここでは、「関連レッスン」のリレーションを指定することで、レッスンリストへのデータ上書きが可能になるのです。
従い、レッスンリストの「受講者数」を1名分減らす仕組みを入れれば良いのですが、受講者数列に数式を入れることができません。つまり、列に指定できる値は、他の列の値か定数のみです。
従い、Set columnsアクションを設定するだけでは、受講者数を減らすことはできません。
受講者数のカウントはロールアップで行う
さて、予約をしたりキャンセルした時の受講者数の変化を把握する必要があります。でないと、定員以上の予約で埋まってしまったり、どのレッスンがガラガラなのかわからなくなってしまいます。そこで、ロールアップの機能を使って、受講者数をカウントしてみます。
次回は、ロールアップ機能についてご説明します。
【自分で作るGlide】７：ロールアップ（Rollup）の使い方−ノーコードで塾の予約管理アプリを作る
Glideでノーコードアプリを自作してみるシリーズ。今回は、ロールアップ機能を使ってテーブルのデータの数を数えます。ロールアップを適用した列の、行ごとにデータ数をカウントします。
シリーズ目次
Glideを使ってノーコードでアプリを自作するシリーズ、塾の予約管理アプリを作ってみました。データベースの構築・画面の設計・アクションの設定と、ノーコードでアプリを作成する一通りの作業を確認していきます。シリーズは全１０回です。
Glideを使うのは初めてですが、開発時間は、Glideの導入からアプリ完成まで一日2、3時間使って3、4日といったところです。
目次
第１回：Glideの導入
第２回：Glideの編集画面について
第３回：Glideのテーブルの作り方
第４回：タブとコンポーネントの設定方法
第５回：アプリの画面を設計
第６回：アクションの設定
第７回：ロールアップ（Rollup）の使い方
第８回：計算式とアクションで残りチケット数を管理する
第９回：チケットの販売とBuyボタンで決済
第１０回：アプリを公開する
個別編
リレーション（Relation）について
GlideとZapierを連携する−GlideアプリでZoomミーティングを作る
週末に作るGlideストップウォッチ編
週末時間でできる、簡単ノーコードアプリ開発。Glideのストップウォッチ機能を使って、目的別に整理できるストップウォッチアプリを開発します。
第１回：テーマを設定できるストップウォッチアプリのコンセプト設定とGlideへのログイン
第２回：計測「テーマ」のテーブルと画面の設定
第３回：ストップウォッチコンポーネント設定とテンプレート型を使った経過時間の表示
第４回：グラフで測定結果の見える化とWebアプリのリリース
0 件のコメント:
コメントを投稿