Menggunakan Flutter SDK yang dihasilkan

Dengan SDK klien Firebase Data Connect, Anda dapat memanggil kueri dan mutasi sisi server langsung dari aplikasi Firebase. Anda membuat SDK klien kustom secara paralel saat mendesain skema, kueri, dan mutasi yang di-deploy ke layanan Data Connect. Kemudian, Anda mengintegrasikan metode dari SDK ini ke dalam logika klien Anda.

Seperti yang telah kami sebutkan di tempat lain, penting untuk diperhatikan bahwa kueri dan mutasi tidak dikirimkan oleh kode klien dan dieksekusi di server.Data Connect Sebagai gantinya, saat di-deploy, operasi Data Connect disimpan di server seperti Cloud Functions. Artinya, Anda perlu men-deploy perubahan sisi klien yang sesuai untuk menghindari gangguan pada pengguna yang ada (misalnya, di aplikasi versi lama).

Itulah sebabnya Data Connect menyediakan lingkungan dan alat pengembangan yang memungkinkan Anda membuat prototipe skema, kueri, dan mutasi yang di-deploy server. Selain itu, SDK sisi klien akan dibuat secara otomatis saat Anda membuat prototipe.

Setelah Anda melakukan iterasi pembaruan pada aplikasi layanan dan klien, pembaruan sisi server dan klien siap di-deploy.

Apa alur kerja pengembangan klien?

Jika Anda mengikuti Mulai, Anda telah diperkenalkan dengan alur pengembangan keseluruhan untuk Data Connect. Dalam panduan ini, Anda akan menemukan informasi yang lebih mendetail tentang cara membuat Flutter SDK dari skema Anda dan cara menggunakan kueri dan mutasi klien.

Singkatnya, untuk menggunakan SDK Flutter yang dihasilkan di aplikasi klien, Anda harus mengikuti langkah-langkah prasyarat berikut:

  1. Tambahkan Firebase ke aplikasi Flutter Anda.
  2. Instal flutterfire CLI dart pub global activate flutterfire_cli.
  3. Jalankan flutterfire configure.

Kemudian:

  1. Kembangkan skema aplikasi Anda.

  2. Siapkan pembuatan SDK:

  3. Lakukan inisialisasi kode klien dan impor library.

  4. Terapkan panggilan kekueri dan mutasi.

  5. Siapkan dan gunakan emulator Data Connect dan lakukan iterasi.

Buat Flutter SDK Anda

Gunakan CLI Firebase untuk menyiapkan SDK yang dihasilkan Data Connect di aplikasi Anda. Perintah init akan mendeteksi semua aplikasi di folder saat ini dan menginstal SDK yang dihasilkan secara otomatis.

firebase init dataconnect:sdk

Memperbarui SDK saat membuat prototipe

Jika Anda telah menginstal ekstensi Data Connect VS Code, ekstensi ini akan selalu memperbarui SDK yang dihasilkan.

Jika tidak menggunakan ekstensi Data Connect VS Code, Anda dapat menggunakan Firebase CLI untuk terus memperbarui SDK yang dihasilkan.

firebase dataconnect:sdk:generate --watch

Membuat SDK di pipeline build

Anda dapat menggunakan Firebase CLI untuk membuat SDK Data Connect dalam proses build CI/CD.

firebase dataconnect:sdk:generate

Menyiapkan kode klien

Lakukan inisialisasi aplikasi Data Connect Anda

Pertama, inisialisasi aplikasi Anda menggunakan petunjuk penyiapan Firebase standar.

Kemudian, instal plugin Data Connect:

flutter pub add firebase_data_connect

Menginisialisasi Data Connect Flutter SDK

Lakukan inisialisasi instance Data Connect menggunakan informasi yang Anda gunakan untuk menyiapkan Koneksi Data (semua tersedia di tab Koneksi Data konsol Firebase).

Mengimpor library

Ada dua set impor yang diperlukan untuk melakukan inisialisasi kode klien Anda, impor Data Connect umum dan impor SDK spesifik yang dihasilkan.

// general imports
import 'package:firebase_data_connect/firebase_data_connect.dart';

// generated queries and mutations from SDK
import 'generated/movies.dart';

Menggunakan kueri di sisi klien

Kode yang dihasilkan akan dilengkapi dengan Referensi Kueri yang telah ditentukan sebelumnya. Yang perlu Anda lakukan hanyalah mengimpor dan memanggil execute pada objek tersebut.

import 'generated/movies.dart';

await MoviesConnector.instance.listMovies().execute();

Memanggil metode kueri SDK

Berikut adalah contoh penggunaan fungsi pintasan tindakan ini:

import 'generated/movies.dart';

function onBtnClick() {
  // This will call the generated Dart from the CLI and then make an HTTP request to the server.
  MoviesConnector.instance.listMovies().execute().then(data => showInUI(data)); // == MoviesConnector.instance.listMovies().ref().execute();
}

Kolom opsional

Beberapa kueri mungkin memiliki kolom opsional. Dalam kasus ini, Flutter SDK mengekspos metode builder, dan harus ditetapkan secara terpisah.

Misalnya, kolom rating bersifat opsional saat memanggil createMovie, jadi Anda harus memberikannya dalam fungsi builder.

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi"}).rating(5).execute();

Berlangganan perubahan

Anda dapat berlangganan perubahan (yang akan diperbarui setiap kali Anda menjalankan kueri).

QueryRef<ListMoviesData, void> listRef = MoviesConnector.instance.listMovies().ref();

// subscribe will immediately invoke the query if no execute was called on it previously.
listRef.subscribe().listen((data) {
  updateUIWithMovies(data.movies);
});

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi" }).rating(5).execute();
await listRef.execute(); // will update the subscription above`

Menangani perubahan pada kolom enumerasi

Skema aplikasi dapat berisi enumerasi, yang dapat diakses oleh kueri GraphQL Anda.

Saat desain aplikasi berubah, Anda dapat menambahkan nilai yang didukung enum baru. Misalnya, bayangkan bahwa di kemudian hari dalam siklus proses aplikasi, Anda memutuskan untuk menambahkan nilai LAYAR PENUH ke enum AspectRatio.

Dalam alur kerja Data Connect, Anda dapat menggunakan alat pengembangan lokal untuk memperbarui kueri dan SDK.

Namun, sebelum Anda merilis versi terbaru klien, klien lama yang di-deploy mungkin rusak.

Contoh penerapan yang tangguh

SDK yang dihasilkan memaksa penanganan nilai yang tidak diketahui. Artinya, kode klien harus membuka objek EnumValue menjadi Known atau Unknown.

final result = await MoviesConnector.instance.listMovies().execute();

if (result.data != null && result.data!.isNotEmpty) {
  handleEnumValue(result.data![0].aspectratio);
}

void handleEnumValue(EnumValue<AspectRatio> aspectValue) {
  if (aspectValue.value != null) {
    switch(aspectValue.value!) {
      case AspectRatio.ACADEMY:
        print("This movie is in Academy aspect");
        break;
      case AspectRatio.WIDESCREEN:
        print("This movie is in Widescreen aspect");
        break;
      case AspectRatio.ANAMORPHIC:
        print("This movie is in Anamorphic aspect");
        break;
      case AspectRatio.IMAX:
        print("This movie is in IMAX aspect");
    }
  } else {
    print("Unknown aspect ratio detected: ${aspectValue.stringValue}");
  }
}

Menggunakan mutasi di sisi klien

Mutasi dapat diakses dengan cara yang sama seperti kueri.

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi" }).rating(5).execute();

Membuat prototipe dan menguji aplikasi Flutter

Menginstrumentasi klien untuk menggunakan emulator lokal

Anda dapat menggunakan emulator Data Connect, baik dari ekstensi VS Code Data Connect maupun dari CLI.

Pengukuran aplikasi untuk terhubung ke emulator sama untuk kedua skenario.

import 'package:firebase_data_connect/firebase_data_connect.dart';
import 'generated/movies.dart';

MoviesConnector.instance.dataConnect
          .useDataConnectEmulator('127.0.0.1', 9399);

// Make calls from your app
QueryRef<ListMoviesData, void> ref = MoviesConnector.instance.listMovies.ref();

Untuk beralih ke resource produksi, beri komentar pada baris untuk menghubungkan ke emulator.

Jenis data di Dart SDK

Server Data Connect menampilkan jenis data GraphQL umum. Ini ditampilkan di SDK sebagai berikut.

Jenis Koneksi Data Dart
Stempel waktu firebase_data_connect.Timestamp
Int (32-bit) int
Tanggal DateTime
UUID string
Int64 int
Float double
Boolean bool
Semua firebase_data_connect.AnyValue