はじめてのFlutterFlow

FlutterFlow始めました

FlutterFlowを使い始めて約1ヶ月が経ちました。
最近は毎日のように使い、試行錯誤しながら使い方を学んでいます。
FlutterFlowはプロトタイプ制作を目的に利用し始めました。

使っているうちにテスト版を配布できるようにまでなりました。
これからもFlutterFlowの使い方を学び、共有できればと思います。

FlutterFlowとは

ノーコードやローコードと呼ばれるツールで、自分でFlutterのコードを書かなくてもUI操作でアプリができあがるようなものです。

私はFlutterFlow以外にもノーコードのツールや、Figmaを使っていたためか、最低限の使い方は比較的すぐに覚えることができました。

ただ、正直なところ、やはりプログラミングやFlutterの知識はあった方がより良いと感じることは多いです。
それについては、今後まとめていこうと思います。

FlutterFlowは無料で始められます

プランは3つあり、無料1プラン、有料2プランです。

主な特徴として、Free Plan（無料）ではUIでアプリを制作し、ソースコードを表示することができます。
Standard Plan（有料）では、制作したアプリのソースをダウンロードできます。＊重要
Pro Plan（有料）では、GitHub連携やAPI呼び出しができます。

FlutterFlowはまだ立ち上がったばかりで、おそらくプランはまだ固定されおらず、変化していくような気がします。

私は無料で始めましたが、手元で動作確認したくなりソースをダウンロードしようとStandardに切り替えました。
しかし、いろいろなアプリを試しに作っているうちに、管理やダウンロードの手間を考えたらGitHub連携だなと思うようになり、Proにしました。

2週間のトライアル期間があるのですが、この便利さには敵わず、そのままProでいくことにしました。

アプリ制作の流れ

細かな使い方については後述しますが、まずはFlutterFlowを使った制作の流れを紹介します。

1. Projectを新規作成し、名称とパッケージ名を入力
2. Firebaseと連携＊UIと動作だけなら必須ではないと思います。
3. ウィジェットを配置してUI作成
4. UIにアクションを設定
5. Firebaseと連携していれば、認証やFirestore接続を実装
6. ソースを直接、もしくはGitHubからダウンロード
7. ローカルで動作確認
8. ビルドをテスト配布＊Firebase App Distributorを使うと簡単でした。

本当はもっと細かく書きたいところですが、長くなるのでここまでにしておきます。

今回はFlutterFlowの概要までですが、これから具体的な使い方も書いていきます。