ノーコード ラボ

NoCode 関連のツールの紹介、使い方などをやさしく説明しています。Chatbot の運用実験は終了しました。ご協力いただいたみなさん、ありがとうございました。

Bubble で作るシンプルなマッチングサイト(初級者向け)2:Data types の作成と Privacy の設定

この記事は 【 Bubble で作るシンプルなマッチングサイト(初級者向け) 】の第2回です。 本シリーズが初めての方は、以下の記事でコンテンツの説明をしていますので、ご確認いただければと思います。

blog.nocodelab.jp

前回の第1回では、アプリのページ構成や全体の仕様についてざっくりとご紹介しました。今回は、アプリに必要なデータベースを作成していきます。では、早速はじめていきましょう!

1. アプリ作成の準備

まずは、Bubble エディタでアプリを Create an app で新規作成します。アプリ名は適宜お好きな名前で設定してください。

2. Option sets の作成

アプリの準備ができたら、Data type を作成する前に、まずは Data field の Type(型)として使う Option sets を先に定義しておきましょう。今回使用する Option sets は以下の8つです。

各 Option sets の設定画面と設定値を以下に載せておきますので、参考に設定してみてください。実際の設定を直接確認したい場合は、こちらのエディタをご参考ください。

また、Option sets とは?といった詳しい解説については今回割愛しますが、必要な場合は以下の記事をご参考くださいね。

blog.nocodelab.jp

2.1. Category

この Option sets は仕事検索の際に使用します。Category はさらに細かく分類された SubCategory をリストで持っています。今回はカテゴリーの保存に Option sets を使用しましたが、Data type で作成しても基本的に考え方は同じです。

設定画面

設定値

2.2. Occupation

この Option sets はワーカーが自分のプロフィールで設定する職種の一覧です。

設定画面・設定値

2.3. Progress

Progress はマッチング時の進捗状況を管理する Option sets です。今回は「応募」と「契約成立」の2つしかありませんが、例えば「条件合意」や「契約終了」など別のステータスを作成することで、より細かな管理ができるようになるかと思います。

設定画面・設定値

2.4. Remarks

仕事募集の際に登録する特記事項の Option sets です。

設定画面・設定値

2.5. Status

募集中の仕事か、募集が終了した仕事かを管理します。こちらも Progress のように今回は値が2つです。もし値が2つしかないことが確実なのであれば、Data type に yes/no 型の Data field で管理する方法もありですが、別の値が増える可能性があるといった場合は、Option sets にしておくと便利です。

設定画面・設定値

2.6. SubCategory

仕事検索の時に使用します。SubCategory はいずれかの Category に属し、データは Category Option sets の中で紐づけられています。

設定画面

設定値

2.7. Type

Type は主に「クライアントか、ワーカーか」を判断する際に使用します。

設定画面

設定値

2.8. Page Title

Page title という Option sets については Field type として使うことはありませんが、非ユーザーの場合は、管理画面から閉め出しをするなどの、リダイレクト設定などに使用します。

設定画面

設定値

※ Login Check については、チェックがオンのものが「yes」、オフが「no」で登録してください。

3. Data types の作成

Option sets の設定ができたら、Data types を定義していきます。今回作成する Data types は全部で5つです。

各 Data types の設定は以下の図を参考に作成してみてください。エディタはこちらです。

3.1. Contact

Contact type は、ワーカーが仕事に応募してきたタイミングで作成される「応募・契約情報」のテーブルです。Member field にクライアントとワーカーの User type を保存し、やり取りした Message type のデータが add されていきます。

3.2. Job

Job type は「仕事情報」テーブルです。クライアントにより新規作成されます。_Count Bookmark_Count Contract のように_(アンダーバー)」が名前の先頭に付いているものは、Privacy rule の関係で必要な field です。目印としてアンダーバーを使用しているだけですので、分かりやすければ何でもOKです。

_Count Bookmark(気になる!で登録している人の数)、_Count Contract(契約した人数)、_Count Entry(応募してきた人数)は、同テーブルの Contract Workers(契約ワーカー) や Entry Workers(応募ワーカー)で登録されている User type の「:count」で取得できる数と同じものですが、これらの field は、この仕事を応募したクライアントしか見えないように制限する為に定義しています。

Client がこの仕事を作成した人で、Creator と同じ値となりますが、今回は検証の際に利用しやすいように Client field を作成しています。Num は応募人数です。

3.3 Message

Message type は、クライアントとワーカー同士でやり取りするメッセージが保存されます。Job 同様、_From_To は誰が見れるメッセージか?を判断する Privacy rule で使います。

3.4. Notice

Notice type はお知らせ一覧の情報を管理します。ワーカーが応募したタイミングや、クライアントがメッセージを送信したタイミングなどで登録されます。isRead は開封フラグです。お知らせ一覧から確認したら isRead は yes に更新されるようにします。

3.5. User

User type には、クライアントとしてのプロフィールや、ワーカーとしてのプロフィールをそれぞれ持っています。また、ユーザーが自分の公開設定(isPublic)を「非公開(no)」とした場合でも、これまでに契約した関係の人であれば、その人の情報は確認できる必要があるので、その制限に必要な Privacy rule 用の field も持っています。

その他には Bookmark で自分が「気になる!」に登録した仕事を、Notice で自分に送信された通知をリストで持っています。また View type で、現在表示しているメニューが、クライアント用のものか、ワーカー用のものかを判断します。

4. Privacy の設定

次に設定した Data types に対して、Privacy の設定を行います。Privacy を設定することで、データの安全性を高めることができますが、逆に設定しなければ、誰でも閲覧することができる公開されたデータとなります。

Privacy は基本的に、Everyone に対しては基本的には権限を付与せず、閲覧できる条件や人に対して見えるデータに穴を開けていくようなイメージで追加していきます。

4.1. Contract

Contact type は応募や契約の際に、クライアントとワーカーがやり取りするデータとなりますので、自分に関するデータであれば見えるように設定します。

4.2. Job

Job type は、その仕事が自分の募集しているものであれば、全てのデータに対して権限を持っています。

また、この仕事に対して契約したり応募したワーカーの場合は、Contract Workers と Entry Workers のデータ以外は権限を持っています。

この仕事が公開設定(isPublic)されている場合は、仕事検索でヒットするように、Contract Workers と Entry Workers、Contact データ以外の権限を誰でも持っています。

公開されていないデータ(isPublic is no)の場合や、権限を持たない人は閲覧することもできません。

4.3. Message

Message type では、自分に関係するデータだけに対して権限を持ちます。

4.4. Notice

Notice type は自分に対して通知されたデータに対してだけ権限を持ちます。

4.5. User

自分がユーザーのクライアントの場合は、プロフィールなどの必要な情報に対して権限を持ちます。

自分がユーザーのワーカーである場合は、プロフィールなどの必要な情報に対して権限を持ちます。

サインアップ時に登録するアカウントが他の人と重複していないかをチェックするため、サインアップユーザーは Slug field に対して権限を持ちます。

自身のプロフィールを公開しているユーザーは、誰でもプロフィールを確認することができます。

ユーザーデータが自分のデータである場合は、権限を持ちます。

サインアップしていないユーザーでも公開設定(isPublic)だけは誰でも参照することができます。

以上で Privacy の設定が完了です!

Privacy を設定すると、データの安全性は保障されますが、開発中の動作確認では不便なこともあります。例えば、表示されるはずと思っていたデータが思ったように表示されないといった場合、もしかすると Privacy の設定が影響を受けていることがあるかもしれません。Privacy を設定した場合、開発中はデバッガーを利用するなどして、取得データの確認を進めるようにしましょう。

デバッガーの使い方については以下の記事でも取り上げていますので、あわせてご参考ください。

blog.nocodelab.jp

次回

今回はここまでです。次回は、サインアップなどのログイン周りと、プロフィール画面を作成していきます!それでは、次回もどうぞよろしくお願いいたします😌

コンテンツ

0:Bubble で作るシンプルなマッチングサイト(初級者編)

1:ncworks の全体像と仕様

2:Data types の作成と Privacy の設定

3:サインアップ周りとプロフィール画面の作成

4:Reusable element の作成①

5:【クライアント】仕事情報の新規登録と編集画面

6:Reusable element の作成②

7:【ワーカー】仕事検索と仕事紹介ページの作成

8:【ワーカー】応募ページと応募管理ページの作成

9:【クライアント・ワーカー共通】コンタクトページの作成

10:【クライアント・ワーカー共通】マイページとお知らせページの作成

11:【クライアント】仕事管理と契約ワーカーページの作成

12:【クライアント】契約ワーカーページの作成

13:【クライアント・ワーカー共通】クライアント詳細、ワーカー詳細ページの作成

13:【クライアント・ワーカー共通】クライアント紹介、ワーカー紹介ページの作成

※全11回予定でしたが、全13回に変更になりました。