Firebase Data Connect'i yerel olarak kullanmaya başlayın

Bu hızlı başlangıç kılavuzu, web ve mobil uygulamalarınızı PostgreSQL veritabanına bağlamak için Firebase Data Connect'yı kullanmaya başlamanıza yardımcı olur. Bu kurstan sonra:

  • VS Code ve Firebase CLI ile yerel Firebase Data Connect proje dizininizi ayarlayın.
  • Uygulama fikirlerinize dayalı olarak doğal dilde Data Connect şemalar, sorgular ve mutasyonlar oluşturun.
  • Data ConnectSorgu ve mutasyon çalıştırmak için uygulamalarınızda kesin tür SDK'larını kullanın.
  • PostgreSQL için Cloud SQL örneği, Data Connect şeması, sorgular ve mutasyonlar sağlama (Blaze planı gerektirir).

Yerel proje dizinini ayarlama

Data Connect için yerel geliştirme araçlarını iki şekilde yükleyebilirsiniz.

  1. Aşağıdaki ön koşulları yükleyin:

  2. Bir proje dizini oluşturun ve Visual Studio Code'da açın.

  3. VS Code Marketplace'ten Firebase Data Connect uzantısını yükleyin.

  4. Google ile oturum aç düğmesini tıklayın.

  5. Firebase projesi bağla düğmesini tıklayın.

  6. Run firebase init (Firebase başlatma işlemini çalıştır) düğmesini tıklayın.

  7. Data Connect emülatörünü yerel bir PGlite veritabanıyla çalıştırmak için Emülatörleri başlat düğmesini tıklayın.

Şemayı inceleme

Firebase Data Connect, veri modelinizi tanımlamak için GraphQL'i kullanır. @table yönergesi, bir GraphQL türünü PostgreSQL tablosuyla eşler. Türdeki alanlar PostgreSQL sütunlarıyla eşlenir. Tablolar arasındaki ilişkileri, birleşik birincil anahtarlara sahip birleştirme tablolarını kullanarak çoktan çoğa ilişkiler de dahil olmak üzere diğer @table türlerine referans veren alanları kullanarak tanımlayabilirsiniz.

Varsayılan kurulumda Data Connect şema dosyalarını dataconnect/schema/ dizininde bulabilirsiniz. Aşağıda, movie şablon şemasından iki örnek tablo verilmiştir. Gemini'ı kullanarak oluşturduysanız şemanız farklı olabilir.

type Movie @table {
  # Every table has an implicit primary key field that looks something like:
  #  id: UUID! @default(expr: "uuidV4()")
  title: String!
  imageUrl: String!
  genre: String
}

type Review @table(key: ["movie", "user"]) {
  user: User!
  movie: Movie!
  rating: Int
  reviewText: String
  reviewDate: Date! @default(expr: "request.time")
}

Veri Bağlantısı şemaları hakkında daha fazla bilgi edinin.

Sorgular ve mutasyonlar geliştirme

Firebase Data Connect, sorgular ve mutasyonlar için GraphQL'i kullanır. Bunları .gql dosyalarında tanımlar ve uygulamanızdan adıyla çağırırsınız. GraphQL söz dizimi, uygulamanızın ihtiyaç duyduğu verileri tam olarak getirmek için kesin olarak türlenmiş SDK'lar ve esnek bir API sağlar.

Veritabanınızdaki başlangıç verileri

Emülatör çalışırken başlangıç verileriyle doldurabilirsiniz. Sağlanan dataconnect/seed_data.gql dosyasını kullanabilir veya kendi mutasyonlarınızı yazabilirsiniz.

Mutasyonları yürütmek ve yerel PGlite veritabanınızı doldurmak için VS Code'daki Run (local) Code Lens düğmesini kullanın.

Firebase Data Connect için CodeLens Çalıştır düğmesi

Sorguları ve mutasyonları inceleme

Varsayılan kurulumda, Data Connect sorgularını ve mutasyonlarını dataconnect/example/ dizininde bulabilirsiniz.

İlişkisel verileri iç içe yerleştirilmiş sorgularla tam olarak sorgulayabilirsiniz.

query ListMovies @auth(level: PUBLIC, insecureReason: "Anyone can list all movies and their reviews.") {
  movies {
    title imageUrl genre
    reviews_on_movie {
      rating reviewDate
      user { username }
    }
  }
}

Data Connect, Firebase Auth ile güvenli sorgular ve mutasyonlar oluşturmanıza yardımcı olur.

Uygulamanızın güvenliğini sağlamak için web ve mobil uygulamalar yalnızca @auth yönergeleri içeren Data Connect sorgularına ve mutasyonlarına erişebilir. Sorgular ve mutasyonlar, {field}_expr: "auth.uid" gibi bir ifade kullanarak Firebase Auth UID'ye güvenli bir şekilde erişebilir.

mutation AddReview($movieId: UUID!, $rating: Int!, $reviewText: String!) @auth(level: USER) {
  review_upsert(
    data: {
      userId_expr: "auth.uid"
      movieId: $movieId
      rating: $rating
      reviewText: $reviewText
    }
  )
}

Data Connect sorguları hakkında daha fazla bilgi edinin Data Connect mutasyonları hakkında daha fazla bilgi edinin Data Connect Auth hakkında daha fazla bilgi edinin.

Sorgu ve mutasyon oluşturma

Data Connect'ı etkili bir şekilde kullanmak için GraphQL uzmanı olmanız gerekmez. Doğal dil açıklamalarından Data Connect sorguları ve mutasyonları oluşturabilirsiniz.

Herhangi bir .gql dosyasında, yorum başlatmak ve sorguyu veya mutasyonu açıklamak için # yazın. Ardından, GraphQL işlemini oluşturmak için Generate/Refine Operation (İşlem Oluştur/İyileştir) Code Lens düğmesini kullanın.

Firebase Data Connect için CodeLens Oluştur düğmesi

Oluşturulan SDK'yı uygulamanızda kullanma

firebase init dataconnect, projenizdeki uygulamalar için tür güvenli SDK'ları otomatik olarak ayarlar. Gerekirse VS Code uzantısındaki Add SDK to app (Uygulamaya SDK ekle) düğmesini kullanarak veya firebase init dataconnect:sdk komutunu çalıştırarak SDK'yı manuel olarak ekleyebilirsiniz.

Web

  1. Firebase'i web uygulamanıza ekleyin.

  2. React uygulamanızın ana dosyasında:

    • Oluşturduğunuz SDK'yı içe aktarın:
    // Update as needed with the path to your generated SDK.
import { listMovies, ListMoviesData } from '@dataconnect/generated';
    • Uygulamanızı Data Connect emülatörüne bağlanacak şekilde yapılandırın:
    import { connectDataConnectEmulator } from 'firebase/data-connect';

const dataConnect = getDataConnect(connectorConfig);
connectDataConnectEmulator(dataConnect, 'localhost', 9399);
    • Data Connect yöntemlerini çağırın.
    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:

    • Data Connect SDK'yı ve oluşturduğunuz SDK'yı içe aktarın:

      import FirebaseDataConnect
// Generated queries.
// Update as needed with the package name of your generated SDK.
import <CONNECTOR-PACKAGE-NAME>

let connector = DataConnect.moviesConnector

    • Uygulamanızı Data Connect emülatörüne bağlanacak şekilde yapılandırın:

      // Connect to the emulator on "127.0.0.1:9399"
connector.useEmulator()

// (alternatively) if you're running your emulator on non-default port:
// connector.useEmulator(port: 9999)

    • Data Connect yöntemlerini çağırın:

      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 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şturduğunuz SDK'dan bir bağlayıcı örneği alın:
    private val connector = com.myapplication.MoviesConnector.instance
    • Uygulamanızı Data Connect emülatörüne bağlanacak şekilde yapılandırın:
    private val connector = com.myapplication.MoviesConnector.instance
  .apply {
    // Connect to the emulator on "10.0.2.2:9399" (default port)
    dataConnect.useEmulator()

    // (alternatively) if you're running your emulator on non-default port:
    // dataConnect.useEmulator(port = 9999)
  }
    • Data Connect yöntemlerini çağırın.
    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şturduğunuz SDK'yı içe aktarın:
    // Generated queries.
// Update as needed with the path to your generated SDK

import 'movies_connector/movies.dart';
    • Uygulamanızı Data Connect emülatörüne bağlanacak şekilde yapılandırın:
    void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  
  MoviesConnector.instance.dataConnect
      .useDataConnectEmulator(Uri.base.host, 443, isSecure: true);
  
  runApp(const MyApp());
}
    • Data Connect yöntemlerini çağırın.
    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();
            }),
      )
    ])));
  }
}

Üretime dağıtma

Şemanızı, sorgularınızı ve mutasyonlarınızı üretimde dağıtmak için:

  1. Blaze planını kullanmak için Firebase projesini yükseltin.

  2. Data Connect VS Code uzantısında Üretime dağıt düğmesini tıklayın veya bir terminalde çalıştırın:

    firebase deploy --only dataconnect

    Dağıtım işleminden sonra, şemanızı görüntülemek ve sorgu ile mutasyon çalıştırmak için Firebase konsolunu ziyaret edin.

dataconnect.yaml hakkında daha fazla bilgi edinin Data Connect'nin Cloud SQL ile nasıl çalıştığı hakkında daha fazla bilgi edinin

Sonraki adımlar

Hızlı başlangıç kılavuzunu tamamladığınıza göre, sonraki adımlar şunlardır: