FlutterFlowとFirebaseで開発していて、NoSQLのFirestoreに馴れていなくやりにくさを感じている人も多いのではないでしょうか？特に検索周りで使いにくく困ってる人もいるかと思います。
そんな時、FlutterFlowには代替え手段としてSupabaseがあります。
Supabaseは、Firebaseのオープンソース代替として知られるプラットフォームで、PostgreSQLを基盤にしたデータベースを中心に設計されており、リアルタイムデータベース、認証、ストレージ、サーバーレス機能を提供しているサービスです。
PostgreSQLのため、RDBに慣れている方は使いやすいと思いますし、SQLも書けるので複雑な検索などはSQLを書いてしまえば解決するのでありがたいですよね。
今日は、FlutterFlow x Supabaseの使い方を簡単に説明したいと思います。
Youtube動画で解説もしてますのでこちらのYoutube解説動画もご覧ください。
FlutterFlowについてはこちら
FlutterFlow開発実績はこちら
Supabaseのアカウント登録
まずはhttps://supabase.com/ よりアカウントを登録します。
ダッシュボードからNew Projectでプロジェクトを作成します。
テーブルの作成
Create a new tableから新規テーブルを作れます。
Enable Row Level Security（RLS）というチェックがあります。基本的にはこれはONとします。これを外すと誰でもこのテーブルを触ることを許可することになってしまうためです。ただ今回はテストのために一旦チェックをOFFにします。
以下の箇所からカラムをどんどん追加していくことができます。また、リンクマークから外部キーも設定可能です。
注意点：Auth ProvidersのEmailでConfirm EmailとSecure email changeをOFFに
FlutterFlow公式の動画によると、以下のAuthenticationのProvidersの中のAuth ProvidersのEmailでConfirm EmailとSecure email changeをOFFにする必要があるようです。これがないと動かない模様。
逆に、Confirm Emailなどの機能が必要な場合はFlutterFlow側で作成すると良いそうです。
FlutterFlow側でAPIキーなどの設定
以下のキーをコピーします。
FlutterFlow側で以下のようにSupabaseの設定をONにし、各キーをコピペします。
AuthenticationのところでSupabaseを選択すれば準備完了です。
FlutterFlow側で認証、一覧取得、登録などを実装
あとは、FlutterFlow側で各機能を実装していくだけです。この記事では割愛しますが、細かくはYoutube動画にて説明しています。
FlutterFlow x SupabaseのYoutube動画はこちら
以下の動画でFlutterFlowとSupabaseの接続を細かく解説していますので、興味のある方はぜひご覧ください。
アプリ・Webサービスの開発の無料相談はこちら
FlutterFlow、bubble、Adalo、STUDIOなどのノーコードツールを使うことで、リスクを抑えて低コストでスピーディにビジネスアイデアを形にすることができます。
弊社はスタートアップ・新規事業向けにコストを抑えた最速のアプリ・Webサービスの開発、さらにはサービス立ち上げのコンサルティングから提案を行なっております。
また、法人向けにノーコードのスクール事業を通して内製化のサポートも行っています。
アプリ、Webサービス、LPなどの構築に興味のある方は、こちらからご気軽にご相談ください。