Mulai menggunakan Firebase Data Connect secara lokal

Catatan: Firebase Data Connect dalam Pratinjau Publik. Data Connect akan tunduk pada "Persyaratan Penawaran Pra-GA" di bagian Persyaratan Khusus Layanan dalam Persyaratan Layanan Google Cloud Platform. Fitur pra-GA tersedia "sebagaimana adanya" dan mungkin memiliki dukungan terbatas. Untuk mengetahui informasi selengkapnya, lihat deskripsi tahap peluncuran.

Catatan: Ikuti panduan memulai cepat lokal ini jika Anda ingin mencoba Data Connect dengan project rencana Spark. Dalam panduan ini, Anda akan membuat prototipe secara lokal dengan emulator dan database lokal. Jika Anda sudah siap untuk menambahkan Data Connect ke project paket Blaze dan menyiapkan layanan serta database Cloud SQL, coba memulai produksi.

Dalam panduan memulai ini, Anda akan mempelajari cara mem-build Firebase Data Connect di aplikasi secara lokal tanpa menyiapkan instance SQL produksi. Anda akan:

• Tambahkan Firebase Data Connect ke project Firebase Anda.
• Siapkan lingkungan pengembangan, termasuk ekstensi Visual Studio Code untuk digunakan dengan instance lokal.
• Kemudian, kami akan menunjukkan cara:
  • Membuat skema untuk aplikasi film
  • Menentukan kueri dan mutasi yang akan digunakan di aplikasi Anda
  • Menguji kueri dan mutasi dengan data sampel terhadap emulator lokal
  • Membuat SDK dengan jenis yang kuat dan menggunakannya di aplikasi
  • Deploy skema, kueri, dan data akhir Anda ke cloud (opsional, dengan upgrade paket Blaze).

Temukan repositori aplikasi panduan memulai dan build aplikasi Data Connect berfitur lengkap dengan mengikuti codelab untuk web kami. Codelab untuk Android dan iOS akan segera hadir.

Memilih alur pengembangan lokal

Data Connect menawarkan dua cara untuk menginstal alat pengembangan dan bekerja secara lokal.

Penginstalan otomatis (macOS atau Linux) Penginstalan manual (Windows)

Prasyarat

Untuk menggunakan quickstart ini, Anda memerlukan hal berikut.

• Project Firebase. Jika Anda belum membuatnya, buat di Firebase console.

Menyiapkan lingkungan pengembangan

1. Buat direktori baru untuk project lokal Anda.

2. Jalankan perintah berikut di direktori baru yang Anda buat.

     curl -sL https://firebase.tools/dataconnect | bash

   Skrip ini mencoba menyiapkan lingkungan pengembangan untuk Anda dan meluncurkan IDE berbasis browser. IDE ini menyediakan alat, termasuk ekstensi VS Code yang dipaketkan sebelumnya, untuk membantu Anda mengelola skema dan menentukan kueri serta mutasi yang akan digunakan dalam aplikasi, dan membuat SDK dengan jenis yang kuat.

   Catatan: Jika Anda sudah menginstal VS Code versi desktop, skrip akan membukanya secara otomatis.
   Catatan: Jika skrip gagal, gunakan langkah-langkah penginstalan manual.

Tips: Secara opsional, Anda dapat menyiapkan alias dengan menambahkan baris berikut ke profil shell (misalnya, ~/.zshrc atau ~/.bash_profile). Tindakan ini memungkinkan Anda mengupgrade alat secara lokal atau meluncurkan ulang IDE berbasis browser hanya dengan mengetik dataconnect.

alias dataconnect='curl -sL https://firebase.tools/dataconnect | bash'

Menyiapkan direktori project

Untuk menyiapkan project lokal, lakukan inisialisasi direktori project. Di jendela IDE, di panel sebelah kiri, klik ikon Firebase untuk membuka UI ekstensi VS Code Data Connect:

1. Klik tombol Sign in with Google.
2. Klik tombol Connect a Firebase project dan pilih project yang Anda buat sebelumnya di konsol.
3. Klik tombol Run firebase init.

4. Klik tombol Start emulators.

   Catatan: Di Terminal terintegrasi, pastikan emulator yang dikonfigurasi mulai berjalan. Setelah berjalan, Anda akan melihat update UI ekstensi dengan detail emulator.

Membuat skema

Di direktori project Firebase, dalam file /dataconnect/schema/schema.gql, mulai tentukan skema GraphQL tentang film.

Film

Di Data Connect, kolom GraphQL dipetakan ke kolom. Film memiliki id, title, imageUrl, dan genre. Data Connect mengenali jenis data primitif: String dan UUID.

Salin cuplikan berikut atau hapus komentar pada baris yang sesuai dalam file.

# By default, a UUID id key will be created by default as primary key.
# If you want to specify a primary key, say title, which you can do through
# the @table(key: "title") directive
type Movie @table {
  id: UUID! @default(expr: "uuidV4()")
  title: String!
  imageUrl: String!
  genre: String
}

MovieMetadata

Salin cuplikan berikut atau hapus komentar pada baris yang sesuai dalam file.

# Movie - MovieMetadata is a one-to-one relationship
type MovieMetadata @table {
  # This time, we omit adding a primary key because
  # you can rely on Data Connect to manage it.

  # @unique indicates a 1-1 relationship
  movie: Movie! @unique
  # movieId: UUID <- this is created by the above reference
  rating: Float
  releaseYear: Int
  description: String
}

Perhatikan bahwa kolom movie dipetakan ke jenis Movie. Data Connect memahami bahwa ini adalah hubungan antara Movie dan MovieMetadata dan akan mengelola hubungan ini untuk Anda.

Pelajari skema Data Connect lebih lanjut dalam dokumentasi

Menambahkan data ke tabel

Di panel editor IDE, Anda akan melihat tombol CodeLens muncul di atas jenis GraphQL di /dataconnect/schema/schema.gql. Anda dapat menggunakan tombol Tambahkan data dan Jalankan (Lokal) untuk menambahkan data ke database lokal.

Untuk menambahkan kumpulan data ke tabel Movie dan MovieMetadata:

1. Di schema.gql, klik tombol Tambahkan data di atas deklarasi jenis Movie.
   
2. Dalam file Movie_insert.gql yang dihasilkan, hard code data untuk tiga kolom.
3. Klik tombol Run (Local).
   
4. Ulangi langkah sebelumnya untuk menambahkan data ke tabel MovieMetadata, dengan menyediakan id Film Anda di kolom movieId, seperti yang diminta dalam mutasi MovieMetadata_insert yang dihasilkan.

Untuk memverifikasi dengan cepat bahwa data telah ditambahkan:

1. Kembali ke schema.gql, klik tombol Baca data di atas deklarasi jenis Movie.
2. Pada file Movie_read.gql yang dihasilkan, klik tombol Run (Local) untuk menjalankan kueri.

Pelajari mutasi Data Connect lebih lanjut dalam dokumentasi

Menentukan kueri

Sekarang bagian yang menyenangkan: mari kita tentukan kueri yang akan Anda perlukan dalam aplikasi. Sebagai developer, Anda terbiasa menulis kueri SQL, bukan kueri GraphQL, sehingga hal ini mungkin terasa sedikit berbeda pada awalnya.

Namun, GraphQL jauh lebih ringkas dan aman dari jenis daripada SQL mentah. Selain itu, ekstensi VS Code kami memudahkan pengalaman pengembangan.

Mulai edit file /dataconnect/connector/queries.gql. Jika Anda ingin mendapatkan semua film, gunakan kueri seperti ini.

# File `/dataconnect/connector/queries.gql`

# @auth() directives control who can call each operation.
# Anyone should be able to list all movies, so the auth level is set to PUBLIC
query ListMovies @auth(level: PUBLIC) {
  movies {
    id
    title
    imageUrl
    genre
  }
}

Jalankan kueri menggunakan tombol CodeLens di dekatnya.

Fitur yang sangat menarik di sini adalah kemampuan untuk memperlakukan hubungan database seperti grafik. Karena data MovieMetadata memiliki kolom movie yang mereferensikan film, Anda dapat menyusun bertingkat ke dalam kolom dan mendapatkan informasi tentang info film kembali. Coba tambahkan jenis movieMetadata_on_movie yang dihasilkan ke kueri ListMovies.

query ListMovies @auth(level: PUBLIC) {
  movies {
    id
    title
    imageUrl
    genre
    movieMetadata_on_movie {
        rating
    }
  }
}

Pelajari kueri Data Connect lebih lanjut dalam dokumentasi

Membuat SDK dan menggunakannya di aplikasi

Di panel kiri IDE, klik ikon Firebase untuk membuka UI ekstensi VS Code Data Connect:

1. Klik tombol Tambahkan SDK ke aplikasi.

2. Pada dialog yang muncul, pilih direktori yang berisi kode untuk aplikasi Anda. Kode SDK Data Connect akan dibuat dan disimpan di sana.

   Catatan: Jika belum memiliki direktori aplikasi, Anda dapat membuat dan memilih direktori baru untuk kode SDK untuk saat ini dan menautkannya ke aplikasi Anda nanti.

3. Pilih platform aplikasi Anda, lalu perhatikan bahwa kode SDK langsung dibuat di direktori yang Anda pilih.

Pelajari cara menggunakan SDK yang dihasilkan untuk memanggil kueri dan mutasi dari aplikasi klien (web, Android, iOS, Flutter).

Men-deploy skema dan kueri ke produksi

Setelah menyiapkan lokal di aplikasi, sekarang Anda dapat men-deploy skema, data, dan kueri ke cloud. Anda memerlukan project paket Blaze untuk menyiapkan instance Cloud SQL.

1. Buka bagian Data Connect di konsol Firebase dan buat instance Cloud SQL uji coba gratis.

   Catatan: Penyediaan instance Cloud SQL untuk PostgreSQL dapat memerlukan waktu hingga 15 menit. Anda tidak akan dapat men-deploy hingga instance siap.

2. Di Terminal terintegrasi IDE, jalankan firebase init dataconnect dan pilih Region/Service ID yang baru saja Anda buat di konsol.

3. Pilih "Y" saat diminta dengan "File dataconnect/dataconnect.yaml sudah ada, Ganti?".

4. Di jendela IDE, di UI Ekstensi VS Code, klik tombol Deploy to production.

5. Setelah di-deploy, buka konsol Firebase untuk memverifikasi bahwa skema, operasi, dan data telah diupload ke cloud. Anda akan dapat melihat skema, dan menjalankan operasi di konsol juga. Instance Cloud SQL untuk PostgreSQL akan diperbarui dengan skema dan data akhir yang dihasilkan dan di-deploy.

Langkah berikutnya

Tinjau project yang di-deploy dan temukan alat lainnya:

• Tambahkan data ke database, periksa dan ubah skema, serta pantau layanan Data Connect di Firebase console.

Akses informasi selengkapnya dalam dokumentasi. Misalnya, karena Anda telah menyelesaikan panduan memulai:

• Pelajari lebih lanjut pengembangan skema, kueri, dan mutasi
• Pelajari cara membuat SDK klien dan memanggil kueri serta mutasi dari kode klien untuk web, Android, iOS, dan Flutter.