Firebase Data Connect'i kullanmaya başlama

Bu hızlı başlangıç kılavuzunda, üretim SQL örneğiyle uygulamanızda Firebase Data Connect oluşturmayı öğreneceksiniz.

Firebase konsolunda şunları yapacaksınız:

  • Firebase projenize Firebase Data Connect ekleyin.
  • Firebase konsolunda yapay zeka destekli şema oluşturma özelliğiyle bir uygulama için şema oluşturun ve şemayı dağıtın.
  • Uygulamanız için bir Cloud SQL örneği sağlayın.
  • Firebase'da Gemini ile veritabanınızı örnek verilerle doldurun.
  • Sorgular ve mutasyonlar oluşturun. Yapay zeka destekli işlem oluşturma özelliği sayesinde, istemci kodunu yerel olarak geliştirmek için dağıtabileceğiniz ve kullanabileceğiniz işlemler oluşturabilirsiniz.

Ardından, yerel geliştirme ortamınızda şunları yaparsınız:

  • Üretim örneğinizle çalışmak için Visual Studio Code uzantısı da dahil olmak üzere bir geliştirme aracı ayarlayın.
  • Yerel ortamınızı konsolda oluşturduğunuz öğelerle senkronize edin.
  • Güçlü şekilde türlenmiş SDK'lar oluşturun ve bunları uygulamanızda kullanın.

Konsol akışı: Şemanızı tasarlamak için yapay zeka yardımını kullanın, ardından veritabanınıza dağıtın.

  1. Henüz oluşturmadıysanız bir Firebase projesi oluşturun.
    1. Firebase konsolunda Proje ekle'yi tıklayın ve ekrandaki talimatları uygulayın.
  2. Firebase konsolunun Data Connect bölümüne gidin.
  3. Gemini'ı kullanmaya başlayın düğmesini tıklayın.
  4. Görünen Şema Oluşturucu iş akışı panelinde, Gemini ile birlikte GraphQL şeması oluşturmaya yardımcı olması için bir uygulamayı açıklayın.
  5. GraphQL şemasını inceleyin, ardından Yükselt ve dağıt'ı tıklayın.
  6. Projenizi Blaze planına yükseltin. Bu işlem, PostgreSQL için Cloud SQL örneği oluşturmanıza olanak tanır.

  7. Yeni bir Cloud SQL örneği oluştur'u seçin. Görünen iletişim kutusunda, PostgreSQL için Cloud SQL veritabanınızın konumunu ve adını seçin.

    Uygulama şemanız, bu şemaya karşılık gelen bir PostgreSQL veritabanıyla birlikte dağıtılır.

Konsol akışı: Müşterileriniz için işlemler oluşturmak üzere yapay zeka yardımını kullanma

Şemanız dağıtıldıktan sonra, arka uçta dağıtılacak ve daha sonra istemcilerden çağrılacak sorgu ve mutasyon bağlayıcısı oluşturarak bu verileri istemci uygulamalarınızdan erişilebilir hale getirmek için ilk adımları atabilirsiniz.

Yapay zeka destekli araçlarımız size yardımcı olmaya hazır.

  1. İstendiğinde Gemini ile işlemler oluştur düğmesini tıklayın.

  2. Birkaç dakika sonra, İşlemlerinizi oluşturun iş akışı panelinde, Gemini'ın şemanıza göre sağladığı sorgu ve mutasyon listesini inceleyin.

  3. İşlemi tanımlayan GraphQL kodunu incelemek için her bir işlem satırını tıklayın. Gerekirse çöp kutusu kontrolünü kullanarak ihtiyacınız olmayan işlemleri silebilirsiniz.

  4. İşlem eklemek için + Ekle düğmesini tıklayın. Ardından:

    1. İşleminizi doğal dilde açıklayın.

      Örneğin:

      List all products
      
    2. Oluşturulan GraphQL'i inceleyin.

    3. İşlem kabul edilebilir durumdaysa Ekle'yi tıklayarak işlemler listenize ekleyin.

  5. İşlem kümeniz kabul edilebilir olana kadar kaldırma ve ekleme işlemlerine devam edin.

  6. Bu işlem listesini istemci tarafından çağrılabilir bir bağlayıcı grubu olarak dağıtmak için bağlayıcının adını seçin ve Dağıt'ı tıklayın.

Konsol akışı: Değişiklik oluşturmak ve veritabanınızı doldurmak için Firebase'da Gemini'ı kullanma

Önceki adımları tamamlayarak alakalı öğe türlerinden oluşan bir Data Connect şema oluşturdunuz ve bunu üretime dağıttınız. Bu da ilgili tabloların bulunduğu bir PostgreSQL veritabanının da oluşturulup dağıtıldığı anlamına gelir.

Veritabanınızı doldurmak için Firebase'da Gemini'ı kullanarak tablolarınızdan birini güncellemek üzere GraphQL mutasyonu ve güncellemelerinizi onaylamak için sorgu tanımlamak üzere doğal dil girişlerinizi kullanabilirsiniz.

  1. Veriler sekmesini açın.

  2. GraphQL yazmama yardım et pen_spark simgesini tıklayın ve açılan kutuya girişinizi yazın.

    Örneğin:

    Add data for three sample products to my app.
    
  3. Oluştur'u tıklayın. Mutasyon döndürülür.

  4. Çıkışı inceleyin. Gerekirse istemi iyileştirmek için Düzenle'yi, ardından Yeniden oluştur'u tıklayın.

  5. Ardından, mutasyonu veri düzenleyiciye eklemek için Ekle'yi tıklayın.

  6. Çalıştır'ı tıklayın.

Mutasyonu çalıştırdığınızda veriler, PostgreSQL veritabanınızdaki uygun tabloya yazılır. Depolanan verileri görüntülemek için konsolda bir sorgu oluşturabilirsiniz:

  1. Sorgu oluşturmak için GraphQL yazmama yardım et pen_spark özelliğini kullanarak önceki adımları tekrarlayın.

  2. Görüntülenen kutuya girişinizi yazın.

    Örneğin:

    Query data for all sample products in my app.
    
  3. Oluştur'u, ardından Çalıştır'ı tıklayın.

Yerel akış: Geliştirme araçlarını seçme

Dağıtılan veritabanınızda verileriniz olduğuna ve bir bağlayıcı dağıttığınıza göre, şemanızın ve bağlayıcılarınızın geliştirilmesine yerel geliştirme ortamınızda devam edebilirsiniz.

Öncelikle yerel bir ortam oluşturmanız gerekir. Data Connect, geliştirme araçlarını yüklemek için iki yöntem sunar.

Ön koşullar

Bu hızlı başlangıç kılavuzunu kullanmak için aşağıdakilere ihtiyacınız vardır.

Yerel akış: Geliştirme ortamını ayarlama

  1. Yerel projeniz için yeni bir dizin oluşturun.
  2. VS Code'u yeni dizinde açın.
  3. Firebase Data Connect uzantısını Visual Studio Code Marketplace'ten yükleyin.

Yerel akış: Yerel projenizi oluşturma

Yerel projenizi ayarlamak için proje dizininizi başlatın. IDE penceresindeki sol panelde Firebase simgesini tıklayarak Data Connect VS Code uzantısı kullanıcı arayüzünü açın:

  1. Google ile oturum aç düğmesini tıklayın.
  2. Firebase projesi bağla düğmesini tıklayın ve konsolda daha önce oluşturduğunuz projeyi seçin.
  3. Run firebase init (Firebase'i başlat) düğmesini tıklayın ve akışı tamamlayın.

  1. Emülatörleri başlat düğmesini tıklayın.

Yerel akış: Şemanızı ve bağlayıcınızı yerel ortamda bulma

Önceki bölümdeki firebase init adımı, öğeleri yerel geliştirme ortamınızla senkronize eder:
  • Dağıttığınız şemayı senkronize eder.
    • Şemanızı bulun: Şema, Firebase proje dizininizdeki /dataconnect/schema/schema.gql dosyasında yer alır.
  • Dağıttığınız bağlayıcıdaki sorguları ve mutasyonları senkronize eder.
    • Bağlayıcınızı bulun: İşlemler, Firebase projenizdeki dizinde, /dataconnect/connector/ dizininde yer alır.

Yerel akış: Şemanızı anlama

Şema örneği: Film

Data Connect içinde GraphQL alanları sütunlarla eşlenir. Movie türünde büyük olasılıkla id, title, imageUrl ve genre bulunur. Data Connect, String ve UUID temel veri türlerini tanır.

# File `/dataconnect/schema/schema.gql`

# By default, a UUID id key will be created by default as primary key.
type Movie @table {
  id: UUID! @default(expr: "uuidV4()")
  title: String!
  imageUrl: String!
  genre: String
}

Şema örneği 1:1 tablosu: MovieMetadata

Filmlerde film meta verilerini modelleyebilirsiniz.

Örneğin, schema.gql içinde Gemini tarafından oluşturulan aşağıdaki snippet'i veya inceleme kodunu ekleyebilirsiniz.

# 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
}

movie alanının Movie türüyle eşlendiğini unutmayın. Data Connect, bu ilişkinin Movie ile MovieMetadata arasında olduğunu anlar ve bu ilişkiyi sizin için yönetir.

Dokümanlarda Data Connect şemaları hakkında daha fazla bilgi edinin.

Yerel akış: Tablolarınıza daha fazla veri ekleme

IDE düzenleyici panelinde, /dataconnect/schema/schema.gql içindeki GraphQL türlerinin üzerinde CodeLens düğmelerinin göründüğünü görebilirsiniz. Konsolda yaptığınız gibi, üretim veritabanınıza veri eklemek için bir mutasyon oluşturabilirsiniz.

Yerel olarak çalışırken tabloya veri eklemek için:

  1. schema.gql bölümünde, türlerinizden birinin (ör. uygulamanızın türüne bağlı olarak Movie, Product, Account) bildirimin üzerinde Veri ekle düğmesini tıklayın.
    Firebase Data Connect için Code Lens veri ekleme düğmesi
  2. Çalışma dizininize <type>_insert.qgl gibi yeni bir dosya eklenir (ör. Movie_insert.gql veya Product_insert.gql). Bu tür için alanlardaki verileri sabit kodlayın.
  3. Run (Production) [Çalıştır (Üretim)] düğmesini tıklayın.
    Firebase Data Connect için Code Lens Çalıştır düğmesi
  4. Diğer tablolara kayıt eklemek için önceki adımları tekrarlayın.

Verilerin eklendiğini hızlıca doğrulamak için:

  1. schema.gql'ya geri dönün ve tür bildiriminin üzerindeki Verileri oku düğmesini tıklayın.
  2. <type>_read.gql gibi sonuçta elde edilen Product_read.gql dosyasında sorguyu yürütmek için Çalıştır (Üretim) düğmesini tıklayın.

Dokümanlarda Data Connect mutasyonları hakkında daha fazla bilgi edinin.

Yerel akış: SDK oluşturma

Şema ve bağlayıcı işlemleriniz yerel olarak senkronize edilir.

Artık iOS, Android, web ve Flutter uygulamalarında sorgulara ve mutasyonlara yönelik çağrıları uygulamaya başlamak için istemci SDK'ları oluşturmak üzere VS Code uzantısını kullanabilirsiniz.

  1. Uzantı kullanıcı arayüzünde SDK'yı uygulamaya ekle düğmesini tıklayın.
  2. Görünen iletişim kutusunda, uygulamanızın kodunu içeren bir dizin seçin. Data Connect SDK kodu oluşturulup buraya kaydedilir.

  3. Uygulama platformunuzu seçin. Ardından, SDK kodunun seçtiğiniz dizinde hemen oluşturulduğunu unutmayın.

Yerel akış: Sorgunuzu bir uygulamadan çağırmak için SDK'ları kullanın

Daha önce şemanızı ve işlemlerinizi Firebase konsolunda dağıtmış olmanız gerekir. Uygulamanızdan işlemleri çağırmak için Data Connect tarafından oluşturulan SDK'yı kullanarak ListMovies sorgunuzu çağırabilirsiniz.

Web

  1. Firebase'i web uygulamanıza ekleyin.
  2. React uygulamanızın ana dosyasında:

    • Oluşturulan SDK'nızı içe aktarın
    • Data Connect yöntemlerini çağırın.
    import React from 'react';
    import ReactDOM from 'react-dom/client';
    
    // Generated queries.
    // Update as needed with the path to your generated SDK.
    import { listMovies, ListMoviesData } from '@movie-app/movies';
    
    function App() {
      const [movies, setMovies] = useState<ListMoviesData['movies']>([]);
      useEffect(() => {
        listMovies.then(res => setMovies(res.data));
      }, []);
      return (
        movies.map(movie => <h1>{movie.title}</h1>);
      );
    }
    
    const root = ReactDOM.createRoot(document.getElementById('root'));
    root.render(<App />);
    

Swift

  1. Firebase'i iOS uygulamanıza ekleyin.
  2. Oluşturulan SDK'yı kullanmak için Xcode'da bağımlılık olarak yapılandırın.

    Xcode'un üst gezinme çubuğunda File > Add Package Dependencies > Add Local'ı (Dosya > Paket Bağımlılıkları Ekle > Yerel Ekle) seçin ve oluşturulan Package.swift'yi içeren klasörü belirleyin.

  3. Uygulamanızın ana temsilcisinde:

    • Oluşturulan SDK'nızı içe aktarın
    • Data Connect yöntemlerini çağırın.
    import SwiftUI
    
    import FirebaseDataConnect
    // Generated queries.
    // Update as needed with the package name of your generated SDK.
    import <CONNECTOR-PACKAGE-NAME>
    
    let connector = DataConnect.moviesConnector
    
    struct ListMovieView: View {
    @StateObject private var queryRef = connector.listMovies.ref()
    
        var body: some View {
            VStack {
                Button {
                    Task {
                        do {
                            try await refresh()
                        } catch {
                            print("Failed to refresh: \(error)")
                        }
                    }
                } label: {
                    Text("Refresh")
                }
    
                // use the query results in a view
                ForEach(queryRef.data?.movies ?? []) { movie in
                        Text(movie.title)
                    }
                }
        }
        @MainActor
        func refresh() async throws {
            _ = try await queryRef.execute()
        }
    
        struct ContentView_Previews: PreviewProvider {
        static var previews: some View {
            ListMovieView()
        }
    }
    

Kotlin Android

  1. Firebase'i Android uygulamanıza ekleyin.
  2. Oluşturulan SDK'yı kullanmak için Gradle'da Data Connect öğesini bağımlılık olarak yapılandırın.

    plugins ve dependencies öğelerini app/build.gradle.kts hizmetinizde güncelleyin.

    plugins {
      // Use whichever versions of these dependencies suit your application.
      // The versions shown here were the latest as of March 14, 2025.
      // Note, however, that the version of kotlin("plugin.serialization") must,
      // in general, match the version of kotlin("android").
      id("com.android.application") version "8.9.0"
      id("com.google.gms.google-services") version "4.4.2"
      val kotlinVersion = "2.1.10"
      kotlin("android") version kotlinVersion
      kotlin("plugin.serialization") version kotlinVersion
    }
    
    dependencies {
      // Use whichever versions of these dependencies suit your application.
      // The versions shown here were the latest versions as of March 14, 2025.
      implementation("com.google.firebase:firebase-dataconnect:16.0.0-beta04")
      implementation("org.jetbrains.kotlinx:kotlinx-coroutines-core:1.10.1")
      implementation("org.jetbrains.kotlinx:kotlinx-serialization-core:1.7.3")
    
      // These dependencies are not strictly required, but will very likely be used
      // when writing modern Android applications.
      implementation("org.jetbrains.kotlinx:kotlinx-coroutines-android:1.9.0")
      implementation("androidx.appcompat:appcompat:1.7.0")
      implementation("androidx.activity:activity-ktx:1.10.1")
      implementation("androidx.lifecycle:lifecycle-viewmodel-ktx:2.8.7")
      implementation("com.google.android.material:material:1.12.0")
    }
    
  3. Uygulamanızın ana etkinliğinde:

    • Oluşturulan SDK'nızı içe aktarın
    • Data Connect yöntemlerini çağırın.
    import android.os.Bundle
    import android.widget.TextView
    import androidx.appcompat.app.AppCompatActivity
    import androidx.lifecycle.Lifecycle
    import androidx.lifecycle.lifecycleScope
    import androidx.lifecycle.repeatOnLifecycle
    import kotlinx.coroutines.launch
    
    
    private val connector = com.myapplication.MoviesConnector.instance
    
    class MainActivity : AppCompatActivity() {
    
      override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val textView: TextView = findViewById(R.id.text_view)
    
        lifecycleScope.launch {
          lifecycle.repeatOnLifecycle(Lifecycle.State.STARTED) {
            
            val result = connector.listMovies.runCatching { execute { } }
            
            val newTextViewText = result.fold(
              onSuccess = {
                val titles = it.data.movies.map { it.title }
                "${titles.size} movies: " + titles.joinToString(", ")
              },
              onFailure = { "ERROR: ${it.message}" }
            )
            textView.text = newTextViewText
          }
        }
      }
    }
    

Flutter

  1. Firebase'i Flutter uygulamanıza ekleyin.
  2. flutterfire CLI'yı yükleyin dart pub global activate flutterfire_cli.
  3. Koşu flutterfire configure.
  4. Uygulamanızın ana işlevinde:
    • Oluşturulan SDK'nızı içe aktarın
    • Data Connect yöntemlerini çağırın.
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
import 'firebase_options.dart';

// Generated queries.
// Update as needed with the path to your generated SDK

import 'movies_connector/movies.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  
  
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            body: Column(children: [
      ConstrainedBox(
        constraints: const BoxConstraints(maxHeight: 200),
        child: FutureBuilder(
            future: MoviesConnector.instance.listMovies().execute(),
            builder: (context, snapshot) {
              if (snapshot.connectionState == ConnectionState.done) {
                return ListView.builder(
                  scrollDirection: Axis.vertical,
                  itemBuilder: (context, index) => Card(
                      child: Text(
                    snapshot.data!.data.movies[index].title,
                  )),
                  itemCount: snapshot.data!.data.movies.length,
                );
              }
              return const CircularProgressIndicator();
            }),
      )
    ])));
  }
}

Sonraki adımlar

Dağıtılan projenizi inceleyin ve diğer araçları keşfedin:

  • Veritabanınıza veri ekleyin, şemalarınızı inceleyip değiştirin ve Firebase konsolunda Data Connect hizmetinizi izleyin.

Belgelerden daha fazla bilgi edinebilirsiniz. Örneğin, hızlı başlangıcı tamamladığınız için: