みなさんこんにちは！ Ryoです！
普段は学生NoCodeエンジニアとして、Bubbleをメインとした受託開発を行ったり、NoCode学生会という学生限定のNoCodeオンラインサロンの運営をしております。
今回は以下のように、プラグインを用いてテスト用のユーザーを簡単に生成する方法を紹介していきます。
ユーザーのログイン機能を搭載したアプリなどでは、ユーザーを作ってテストする際に役立つプラグインなのでぜひマスターしてみてください。
このプラグインの利用アプリ数も多いだけあって、超便利なプラグインになっています。
では、いきましょう。
プラグインのインストール
まずPluginsタブのところから、[Random User Generator]と検索します。
すると以下の画像のようなプラグインが出てくるので、それをインストールします。
このプラグインはランダムでユーザーを生成してくれるプラグインになっています。
Plugin Contentを見て分かるように、1人のユーザーにも複数のユーザー(リスト)も生成することができます。
このプラグインで生成できるユーザー情報は、大まかには以下のようになっています。
- 性別
- 名前
- 場所
- メールアドレス
- ログイン
- 登録済み
- 身分証
- 電話番号
- 携帯電話
- ID
- 画像
- 出身地
実際に触ってみたら分かりますが、結構細かい情報も設定してくれます。
Repeating Groupの設定
次にエレメントの設定をしていきます。
まずRepeating Groupを適当な場所に配置します。
そして、エディターのType of contentに[Generate List of Users Result]と選択します。
次に、Date sourceから[Get data from an external API]を選択します。
API providerには[Generate List of users]を選択します。
今回はRepeating Groupを使って複数のユーザーを生成するため[Generate List of users]を選んでいます。
この段階で、上記の写真のようにAPI providerの下に項目が3つありますが、
- (path)results→生成するユーザーの数
- (param)gender→生成するユーザーの性別
- (param)nat→生成するユーザーの出身地
を指定することができる項目となっています。
ここでは性別や出身地は指定する必要がないので、ユーザー数のみ[10]と指定しています。
そして、Data sourceの続きに[results]を選択します。
これでRepeating Groupの設定は完了です。
ユーザーデータを指定する方法
次に、ユーザーデータを指定していきます。
まずImageエレメントをRepeating Group内に設置します。
そしてDynamic imageにInsert Dynamic Dataを選び、
[Current cell’s Generate List of Users result(Random User Generator)’s]→[picture large]
と選択します。
次に、表示を分かりやすくするためにテキストエレメントを3つ配置します。
そして、性別、ユーザー名、メールアドレスと入力します。
そして、それらのテキストのしたにテキストエレメントを設置します。
テキストの内容にはInsert dynamic dataから、
[Current cell’s Generate List of Users result(Random User Generator)’s]→[gender]
と選択します。
同じ動作を、ユーザー名、メールアドレスのところにも続けます。
そして、以下のように設定していきます。
これで完成です。
プレビューをしてみると、以下のようになっているはずです。
これらのデータはもちろん、Repeating Groupだけでなくワークフローなどでも扱うことができます。
とにかく、データの指定方法さえ分かれば実際に扱うユーザー情報と同じようにテストすることができるようになります。
以前SNSのフォローフォロワー機能の実装方法について説明しましたが、SNSにもこのプラグインは欠かせないのでぜひ使ってみてほしいと思います。
フォローフォロワー機能の実装方法については以下に貼っておきます。
https://bubble-plugin.tech/follow
あとがき
いかがだったでしょうか？
今回紹介したプラグインはユーザー情報を扱うアプリのテストには必要不可欠なので、ぜひ使い方を覚えていただければ
今後もこんなプラグインの使い方や応用方法、Bubbleの知っておくと便利な情報を発信していますのでぜひ他の記事も読んでみてください。
ためになった方はTwitterやFacebookなどで拡散お願いいたします。
それではまた次回の記事でお会いしましょう！！
