FlutterFlowではなんとGitHubと連携できます。
プロジェクトを GitHub アカウントに接続し、Flutter コードベース全体を GitHub リポジトリにプッシュできるようです。
他のノーコードツールにはあまりみられない機能なのでこれは嬉しいですよね。
さっそく試してみたので紹介してみたいと思います。
GitHubアカウントの作成
まだGitHubアカウントがない方は、まずは https://github.com/ よりGitHubアカウントを作りましょう。

新規リポジトリの作成
GitHubに入ったら、右上のプラスボタンからNew repositoryより新規作成します。

以下のようにリポジトリ名などの設定を書き、Create Repositoryします。

FlutterFlow GitHub Appをインストール
https://github.com/apps/flutterflow-github-app をクリックし、以下のような画面から必要なリポジトリを選択しインストールします。

FlutterFlow側でGitHubのURLの設定
FlutterFlowのAppSettingsのIntegrationsのGitHubのFull Repository URLに、さっき作ったGitHubリポジトリのURLを設定します。

Pushしてみる
これで準備は完了なのでPushしてみましょう。
以下のPush to Repositoryをおし、

以下のようにポップアップが上がるので、変更内容についてなどのコミットメッセージを書いてPushを押しましょう。

すると、以下のようにmainの下にFlutteFlowブランチが追加されているはずです。

FlutterFlowブランチにはこんな感じでFlutterのソースコードが連携されていますね。

もちろん以下のように変更点の差分を見ることもできるようになりました。

Youtube動画での解説はこちら
FlutterFlowとGitHub連携についてこちらの動画でも解説してるので興味のある方はこちらもどうぞ。
気を付けるポイント
また、FlutterFlowのドキュメントには以下のような記載がありました。
Here are a few tips and tricks:
FlutterFlow pushes any changes to a branch called flutterflow, it doesn't modify anything present inside your other branches.
You should not make any direct changes to the flutterflow branch.
If you want to make any modifications to the code should be made in a different branch (e.g. main branch).
That way the next time you push from FlutterFlow, it will overwrite the FlutterFlow branch. You can merge these changes into your main branch.
翻訳版
以下にいくつかのヒントとテクニックを示します。
FlutterFlow は、すべての変更を flutterflow と呼ばれるブランチにプッシュします。他のブランチ内に存在するものは何も変更しません。
Flutterflow ブランチに直接変更を加えないでください。
コードに変更を加えたい場合は、別のブランチ (メイン ブランチなど) で行う必要があります。
こうすることで、次回 FlutterFlow からプッシュするときに、FlutterFlow ブランチが上書きされます。 これらの変更をメイン ブランチにマージできます。
FlutterFlow側からPushボタンを押すと、すべてflutterflow と言う名前のブランチにプッシュされるようですね。なのでflutterflow ブランチは直接変更しないでってことみたいですね。
詳細はこちらのGitHubドキュメントを参照してみてください。
アプリ・Webサービスの開発の無料相談はこちら
FlutterFlow、Adalo、bubble、STUDIOなどのノーコード・ローコードツールを使うことで、リスクを抑えて低コストでスピーディにビジネスアイデアを形にすることができます。
弊社はスタートアップ・新規事業向けにコストを抑えた最速のアプリ・Webサービスの開発、さらにはサービス立ち上げのコンサルティングから提案を行なっております。
また、法人向けにノーコードのスクール事業を通して内製化のサポートも行っています。
アプリ、Webサービス、LPなどの構築に興味のある方は、こちらからご気軽にご相談ください。
