さてそれでは前回に続きアプリを作っていきましょう。
前回の記事はこちら→【初心者向け】FlutterFlowで簡単なアプリを作ってみよう（開発準備・firebase接続編）
FlutterFlowについて詳しくはこちら→ ネイティブアプリを10倍速で作れるノーコードツールFlutterFlowとは？Adaloとの違いも合わせて解説
まず、前回firebaseと接続し、テンプレートを利用してSignInページとHomeページを作りました。
今日はその続きからやっていきましょう。
まずはエラーを解消しよう。
前回の記事の最後までやると、画面右上に以下のような赤丸でErrorsというエラーが出ています。僕の場合5件出ていますね。
この赤丸のエラーをまず消したいと思います。
全部細かく説明すると大変なのでざっくり言うと、
Max lines must be 1 for password fields.というエラーは、パスワードは最大１行なので最大１行って設定してよー
と言ってます。
なのでこんな感じで、MaxLinesを1に設定しましょう。
ToggleIcon requires its value to be set from a Firestore or Local State variable.みたいなエラーは、トグルボタンがあるけど設定されてないよーみたいな感じなんですが、今はまだ要らないので、テンプレートに最初からあるトグルボタンとかは削除してしまいましょう。
以下の場合はハートボタンを削除しちゃえば取り合えず解決です。
という感じで、まずは頑張ってエラーを削除しちゃってみてください。
SignUp画面で次の画面への遷移を設定
次に、SignUpした時に次の画面に遷移するように設定します。
まずは以下の赤枠のところをクリックして、SignUp画面のCreateAccountボタンのアクションの設定画面を開きます。
以下のスクショのように、すでにアクションが一つ（Action1 Auth create accountとかかれているやつですね）設定されていますよね？これはテンプレートがデフォルトで用意してくれているサインインするアクションです。
しかし、このままだとサインインはするものの、同じ画面に留まったままになってしまうので、サインインしたらすぐ次のHOME画面に飛ぶように設定したいと思います。
上記＋ボタンからあAdd Actionを押します。すると右側にメニューが現れますので、そこの「Navigate To」から「Home」を選択しましょう。
これでHome画面に遷移できるようになりました。
ビルドして動かしてみよう
では、エラーが取れて、SignUp画面もできたところでビルドして動かしてみます。
画面右上の雷マークをクリックします。すると別タブが開きビルドが始まります。
これが結構時間がかかります。２〜３分、あるいはもう少し待ちましょう。
しばらくすると画面が動き、SignUp画面が立ち上がります。
ここにメールアドレスとパスワードなどを入れてSignUpしてみましょう。
SignUpしてホーム画面が表示されることが確認できたと思います。
動画での解説はこちら
動画で見た方がわかりやすいと思う方はこちらをどうぞ。
FlutterFlowのプロジェクトの作成・Firebase側の設定・構築からリストにデータを表示させるところまでをゼロから説明しています。
【初心者向け】FlutterFlowで簡単なアプリを作ってみよう（ビルド〜SignUpまで編）：まとめ
今日はFlutterFlowでのアプリ作成のビルドからSignUpまでの流れを説明してみました。
いかがでしたでしょうか？
なかなかわかりにくいところも多く、難しいと感じる人も多いのではないでしょうか？
とはいえFlutterFlowできることが圧倒的に多く、強力なノーコードツールであり、コード出力もできるのでそのままFlutterでのプログラミング開発もできるという優れものですので、学習する価値はあると思いますし、おすすめです。
反面、やはり難易度が高いので、難しすぎると感じる方はノーコードAdaloもおすすめです。
FlutterFlowに比べ機能に制限がある反面、遥かに短期間で学習も可能です。
用途に応じたノーコードツールの選択を検討してみてくださいね。
アプリ・Webサービスの開発の無料相談はこちら
Adalo、bubble、STUDIOなどのノーコードツールを使うことで、リスクを抑えて低コストでスピーディにビジネスアイデアを形にすることができます。
弊社はスタートアップ・新規事業向けにコストを抑えた最速のアプリ・Webサービスの開発、さらにはサービス立ち上げのコンサルティングから提案を行なっております。
また、法人向けにノーコードのスクール事業を通して内製化のサポートも行っています。
アプリ、Webサービス、LPなどの構築に興味のある方は、こちらからご気軽にご相談ください。