FlutterFlow(フラッターフロー)で開発環境と本番環境を切り替えたい場合、今まではあまり良い方法がありませんでした。しかし、ついに今回のフラッターフロー 5.0の発表により、新機能として開発環境と本番環境を切り替える、あるいはステージング環境や他の環境を追加して切り替えることが可能になりました。

この機能、待ち望んでいた方も多いと思います。(僕は待ち望んでました!)

これで本格的なサービスシステムの運用が可能になったと思います。
このように本格的なサービス運用を意識してくれているところが、FlutterFlow(フラッターフロー)の素晴らしい点であり、これからも期待できる部分ですよね。では、これからその内容を記事にまとめていきたいと思います。

Development Environments(開発環境)

まず、開発環境についてのFlutterFlow公式のドキュメントはこちらです。

https://docs.flutterflow.io/testing/dev-environments/

そこに記載の通り、以下の画像のように、firebaseの環境を、開発環境、ステージング環境、本番環境、その他環境などを切り替えて開発を行えるようになります。

FlutterFlow:Development Environments(開発環境)

では早速使ってみた感想を書いていきたいと思います。

Dev Environmentsから環境を追加

まず、以下のように「Dev Environments」という項目が増えており、デフォルトでは「Production」という環境だけが設定されています。そこにプラスボタンから、自分の好きな名前で環境をどんどん追加していくことができます。

以下の図では「Dev」環境を追加したので、「Dev」が表示されていますよね。しかし、それだけではなく、ステージング環境も追加できますし、好きな名前でどんな環境でも、何個でも追加できるようになっています。素晴らしいですよね。本当にありがたい機能です。

FlutterFlow:Dev Environmentsから環境を追加

環境ごとに変数を持てる

さらに、環境ごとに変数を持つことができます。

例えば、環境ごとに利用しているAPIのURLが環境ごとに異なる場合など良くありますよね。本番環境では本番用のAPIを使わなければいけないけど、テスト環境ではテスト用のAPIを使いたいということは、よくあるシチュエーションだと思います。そういったことを自由に設定できるように、環境ごとの変数を定義することができます。これも非常にありがたい機能追加ですね。

FlutterFlow:環境ごとに変数を持てる

簡単に環境ごとにFirebase Projectを切り替えられる

Firebaseの設定画面に以下のように、右上に「Current Environment」というドロップダウンが追加されました。

Current Environmentが取れる

また、「Current Environment」が取得できるというのも便利ですよね。
アプリ側のロジックで、本番環境には表示させたく無いけど、テスト環境にはテスト用のメッセージを表示させたい、というようなケースもあるかと思います。Current Environmentを使うことでこのように、環境ごとに条件分岐を行うことができるようになります。

現時点ではFirebaseのみで、Supabaseには非対応

現時点(2024年9月26日現在)ではFirebaseのみに対応していて、Supabaseには非対応のようです。ただそのうち対応されるとの噂もありますので、Supabase派の人も楽しみに待っていて良いかもしれません。

FlutterFlowの開発環境機能についてのYoutube動画

ちょっと触ってみた内容を動画にもまとめてみたので興味のある方はこちらもどうぞ

FlutterFlow:新機能「開発環境」まとめ

この機能は本当に待ち望んでいた方も多かったのでは無いでしょうか?
本格的なシステム開発・アプリ開発をするならば、dev環境・ステージング環境・本番環境が無いと運用・アップデートができないですよね。今回のアップデートでFlutterFlowが本格的な、そして中規模以上の開発にも耐えられる「Visual開発環境」にいよいよなってきた気がします。

FlutterFlowは今後もどんどん拡張を続けていくと思うので、今後も楽しみにしていきたいと思います。

FlutterFlowについて詳しくはこちら

FlutterFlowについて詳しく知りたい方はこちらの記事もご覧ください。

【FlutterFlow】ネイティブアプリを10倍速で作れるノーコード(ローコード)ツールFlutterFlowとは?

また、FlutterFlowの開発事例については以下に書きましたので興味がある方はこちらも併せてご覧ください。

FlutterFlowの国内開発実績を紹介【ノーコードアプリ・Web開発】

アプリ・Webサービスの開発の無料相談はこちら

FlutterFlow、Adalo、bubble、STUDIOなどのノーコードツールを使うことで、リスクを抑えて低コストでスピーディにビジネスアイデアを形にすることができます。

弊社はスタートアップ・新規事業向けにコストを抑えた最速のアプリ・Webサービスの開発、さらにはサービス立ち上げのコンサルティングから提案を行なっております。

また、法人向けにノーコードのスクール事業を通して内製化のサポートも行っています。

アプリ、Webサービス、LPなどの構築に興味のある方は、こちらからご気軽にご相談ください。