こんにちは。flutterflow、とても便利ですよね。flutterflow x firebaseで高速で開発ができ、かつかなりのクオリティのアプリが開発できます。ノーコード・ローコードとは思えないサクサク動くオシャレなアプリができます。さて、そんなFlutterFlowですが、リリースし長期的に運用していくなら当然dev、stg、prodなどそれぞれの環境が必要ですよね。今日はFlutterFlow x Firebaseの本番環境と開発環境について考えていきたいと思います。現時点ではあまり便利な方法はない残念ながら、私の知る限り今のところあまり良い方法がないように思えます。現在の方法だと、手動でFirebaseのProjectIDを切り替えたりデプロイし直したりが必要となるので、ちょっと運用しにくいです、、、（しかしそれはあくまで2024年5月16日現在の話で、FlutterFlowの成長スピードを鑑みると半年後くらいにはすぐ便利機能がリリースされるのでは、と期待しています）とはいえ、今はそれしかないと思うので、その方法を書いていきたいと思います。↑訂正 ※2024年9月26日追記上記を訂正します。FlutterFlow 5.0がリリースされ、新機能として「Development Environments」が発表されました！これにより、以下のような良く無い方法ではなくもっと簡単に開発環境やステージング環境、本番環境が切り替えられるようになりました。記事にまとめましたのでこちら↓をご覧ください。【FlutterFlow】開発環境と本番環境を切り替える方法（FlutterFlow 5.0の新機能）↓↓↓以下は旧版（2024/05/16時点）の記事になります。↓↓↓準備0.アプリを開発まずは普通にFlutterFlow x Firebase（本番環境）でアプリを開発します。1. アプリをストアにリリース。Apple、Googleのストアにリリースしたりします。2. テスト環境用のFirebase Projectを作る2-1. 以下のAdd Firebase to an existing projectを参考に、新規にテスト環境用のFirebaseプロジェクトを作成します。https://docs.flutterflow.io/data-and-backend/firebase/firebase-setup#add-firebase-to-an-existing-projectまずFirebaseプロジェクトを作ります。その後、以下のようにfirebase@flutterflow.ioのユーザーを作り、あadvanced permissionからcloud function adminやservice account userを追加するのを忘れないようにしましょう。FirestoreデータベースやStorageのcreateも忘れずに。2-2. Push通知の設定Project SettingのCloud MessagingからAPNs Authentication Keyを登録本番環境から開発環境への切り替え方法では準備ができたら以下のような設定をしていきましょう。3. アプリを本番からテスト環境に切り替える3-1. FlutterFlowからFirebase Project IDをRemoveし、テスト環境用のProjectIDを設定する。3-2. Regenerate Config Filesを押下3-3. Firestore Indexes、Delete User References（Functions）、Firestore Rulesをデプロイ3-3. プッシュ通知をデプロイ3-4. クラウドファンクションなどをデプロイ4. AppStoreにあげてtestflightや、APKファイルで動作確認。上記が無事終わればあとは動作確認をするだけです。本番環境に戻す時戻す際は上記と同じことをやるだけです。Firebase Project IDをRemoveして本番用のIDに書き換え、Config FileをRegenerateし、Firestore RuleやPush通知などをデプロイし直しますちょっと手間ですが、こんな感じだと思います。FlutterFlow・Firebaseで本番／テスト環境の切り替えいかがでしたでしょうか。これらの切り替えを手動でやるのはちょっと手間ですよね。。ただ、FlutterFlowはアプリ側のブランチ開発の仕組みも作っていますし、単純な実装できる機能だけにフォーカスしているわけではなく、こういった運用や開発しやすさの改善も強く意識してくれているのを感じます。ですので、遠くない未来にもっと便利な方法が作られることを期待しましょう！Youtube動画での解説はこちらFlutterFlowによるFirebaseの本番環境・開発環境の切り替えについて、Youtube動画でも解説しています。（といっても結構端折って話してるので大した情報量ではないですが...）ご参考まで。%3Ciframe%20width%3D%22560%22%20height%3D%22315%22%20src%3D%22https%3A%2F%2Fwww.youtube.com%2Fembed%2F8kj03Lutn6I%3Fsi%3DVNKALLHSzVLM2i2o%22%20title%3D%22YouTube%20video%20player%22%20frameborder%3D%220%22%20allow%3D%22accelerometer%3B%20autoplay%3B%20clipboard-write%3B%20encrypted-media%3B%20gyroscope%3B%20picture-in-picture%3B%20web-share%22%20referrerpolicy%3D%22strict-origin-when-cross-origin%22%20allowfullscreen%3D%22%22%3E%3C%2Fiframe%3Eアプリ・Webサービスの開発の無料相談はこちらFlutterFlow、bubble、Adalo、STUDIOなどのノーコードツールを使うことで、リスクを抑えて低コストでスピーディにビジネスアイデアを形にすることができます。弊社はスタートアップ・新規事業向けにコストを抑えた最速のアプリ・Webサービスの開発、さらにはサービス立ち上げのコンサルティングから提案を行なっております。また、法人向けにノーコードのスクール事業を通して内製化のサポートも行っています。アプリ、Webサービス、LPなどの構築に興味のある方は、こちらからご気軽にご相談ください。