Menghubungkan aplikasi FlutterFlow Anda dengan Supabase lokal memungkinkan pengembangan dan pengujian yang efisien sebelum penerapan ke lingkungan produksi. Berikut adalah langkah-langkah sederhana untuk melakukan integrasi ini:
1. Instalasi Docker
Docker memungkinkan Anda menjalankan Supabase secara lokal dalam container.
- Unduh dan Instal Docker Desktop:
Kunjungi situs resmi Docker dan unduh Docker Desktop sesuai dengan sistem operasi Anda. Pastikan WSL 2 diaktifkan untuk pengguna Windows. - Verifikasi Instalasi:
Setelah instalasi, buka terminal atau command prompt dan jalankan:
docker --version
Perintah ini akan menampilkan versi Docker yang terinstal.
2. Instalasi Supabase CLI
Supabase CLI memudahkan pengelolaan proyek Supabase Anda.
- Instalasi melalui Node.js:
Pastikan Node.js telah terinstal. Kemudian, jalankan:
npm install supabase --save-dev
- Inisialisasi Proyek Supabase:
Di direktori pilihan Anda, inisialisasi dan mulai Supabase dengan:
supabase init
supabase start
Jika menghadapi masalah, coba perintah berikut:
npx supabase start --ignore-health-check
3. Integrasi FlutterFlow dengan Supabase
Setelah Supabase berjalan secara lokal, hubungkan dengan FlutterFlow:
- Dapatkan API URL dan Anon Key:
Dari dashboard Supabase lokal Anda, salin API URL dan Anon Key. - Konfigurasi di FlutterFlow:
- Navigasi ke Settings and Integrations > Integrations > Supabase.
- Aktifkan Supabase dan tempelkan API URL serta Anon Key yang telah disalin.
- Klik Get Schema untuk memuat struktur tabel dari Supabase.
4. Pengelolaan Basis Data dengan Supabase CLI
Untuk mengelola basis data Anda:
- Melihat Struktur Tabel:
npx supabase db diff -f initial_structure --linked
- Membuat Cadangan Data:
npx supabase db dump --data-only -f supabase/seed.sql --linked
- Mereset Basis Data:
npx supabase db reset
Dengan mengikuti langkah-langkah di atas, Anda dapat mengembangkan dan menguji aplikasi FlutterFlow Anda secara lokal menggunakan Supabase sebelum menerapkannya ke produksi.
Untuk informasi lebih lanjut, kunjungi panduan lengkap di: FlutterFlow Devs Blog