Inizia a utilizzare Firebase Data Connect

In questa guida rapida, imparerai a creare Firebase Data Connect nella tua applicazione con un'istanza SQL di produzione.

Nella console Firebase:

  • Aggiungi Firebase Data Connect al tuo progetto Firebase.
  • Crea uno schema per un'app nella console Firebase utilizzando Schema Assist ed eseguine il deployment.
  • Esegui il provisioning di un'istanza Cloud SQL per la tua app.
  • Con Gemini Code Assist, compila il tuo database con dati di esempio.

Poi, nel tuo ambiente di sviluppo locale:

  • Configura uno strumento di sviluppo, inclusa un'estensione di Visual Studio Code, da utilizzare con l'istanza di produzione.
  • Sincronizza l'ambiente locale con gli asset che hai creato nella console.
  • Utilizza gli strumenti di estensione per implementare una query che verrà utilizzata nella tua app.
  • Genera SDK fortemente tipizzati e utilizzali nella tua app.
  • Esegui il deployment dello schema, delle query e dei dati finali nel cloud.

Flusso della console: progetta lo schema ed esegui il deployment nel database

  1. Se non l'hai ancora fatto, crea un progetto Firebase.
    1. Nella console Firebase, fai clic su Aggiungi progetto, quindi segui le istruzioni sullo schermo.
  2. Vai alla sezione Data Connect della console Firebase.
  3. Fai clic sul pulsante Inizia a utilizzare Gemini.
  4. Nel riquadro del flusso di lavoro di Schema Generator visualizzato, descrivi un'app in modo che Gemini possa aiutarti a creare uno schema GraphQL.
  5. Esamina lo schema GraphQL, quindi fai clic su Esegui l'upgrade e il deployment.

  6. Esegui l'upgrade del progetto al piano Blaze. In questo modo puoi creare un'istanza Cloud SQL per PostgreSQL.

  7. Seleziona Crea una nuova istanza Cloud SQL. Nella finestra di dialogo visualizzata, seleziona una posizione e una denominazione per il tuo database Cloud SQL per PostgreSQL.

    Lo schema dell'app viene disegnato insieme a un database PostgreSQL corrispondente allo schema.

Flusso della console: utilizza Gemini in Firebase per creare una mutazione e compilare il database

Completando il passaggio precedente, hai creato uno Data Connect schema costituito da tipi di entità pertinenti e lo hai disegnato in produzione, il che significa che è stato creato e disegnato anche un database PostgreSQL con le tabelle corrispondenti.

Per compilare il database, puoi utilizzare Gemini in Firebase per aiutarti a elaborare gli input in linguaggio naturale per definire una mutazione GraphQL per aggiornare una delle tue tabelle e una query per confermare gli aggiornamenti.

  1. Apri la scheda Dati.

  2. Fai clic sull'icona Aiutami a scrivere GraphQL pen_spark e, nella finestra visualizzata, digita il tuo input.

    Ad esempio:

    Add data for three sample products to my app.

  3. Fai clic su Genera. La mutazione viene restituita.

  4. Rivedi l'output. Se necessario, fai clic su Modifica per perfezionare il prompt e poi su Rigenera.

  5. Poi, fai clic su Inserisci per inserire la mutazione nell'editor di dati.

  6. Fai clic su Esegui.

Quando esegui la mutazione, i dati vengono scritti nella tabella applicabile nel database PostgreSQL. Puoi creare una query nella console per visualizzare i dati memorizzati:

  1. Ripeti i passaggi precedenti utilizzando Aiutami a scrivere GraphQL pen_spark per creare una query.

  2. Digita il testo nella casella visualizzata.

    Ad esempio:

    Query data for all sample products in my app.

  3. Fai clic su Genera, quindi su Esegui.

Flusso locale: scegli gli strumenti di sviluppo

Ora che hai i dati nel database di cui è stato eseguito il deployment, puoi continuare a sviluppare lo schema e i connettori nel tuo ambiente di sviluppo locale.

Innanzitutto, devi configurare un ambiente locale. Data Connect offre due modi per installare gli strumenti di sviluppo.

Flusso locale: configura l'ambiente di sviluppo

  1. Crea una nuova directory per il progetto locale.

  2. Esegui il seguente comando nella nuova directory creata.

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

    Questo script tenta di configurare l'ambiente di sviluppo e di avviare un IDE basato su browser. Questo IDE fornisce strumenti, inclusa un'estensione VS Code precompilata, per aiutarti a gestire lo schema e a definire query e mutazioni da utilizzare nella tua applicazione, nonché a generare SDK fortemente tipizzati.

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

Flusso locale: configura la directory del progetto

Per configurare il progetto locale, inizializza la directory del progetto. Nella finestra IDE, nel riquadro a sinistra, fai clic sull'icona di Firebase per aprire l'interfaccia utente dell'estensione VS Code di Data Connect:

  1. Fai clic sul pulsante Accedi con Google.
  2. Fai clic sul pulsante Collega un progetto Firebase e seleziona il progetto che hai creato in precedenza nella console.

  3. Fai clic sul pulsante Esegui firebase init e completa il flusso.

  4. Fai clic sul pulsante Avvia emulatori.

Flusso locale: trova lo schema nell'ambiente locale

Il passaggio firebase init della sezione precedente ha sincronizzato lo schema di cui hai eseguito il deployment dalla console all'ambiente di sviluppo locale.

Trova lo schema: si trova nella directory del progetto Firebase, nel file /dataconnect/schema/schema.gql.

Flusso locale: lavoro con lo schema

Esempio di schema: Film

In Data Connect, i campi GraphQL vengono mappati alle colonne. Un tipo Movie probabilmente avrà id, title, imageUrl e genre. Data Connect riconosce i tipi di dati primitivi String e UUID.

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

Esempio di schema tabella 1:1: MovieMetadata

Con i film, puoi modellare i metadati dei film.

Ad esempio, in schema.gql, puoi aggiungere il seguente snippet o esaminare il codice generato da Gemini.

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

Tieni presente che il campo movie è mappato a un tipo di Movie. Data Connect è consapevole che si tratta di un rapporto tra Movie e MovieMetadata e gestirà questo rapporto per te.

Scopri di più sugli schemi di Data Connect nella documentazione

Flusso locale: aggiungi altri dati alle tabelle

Nel riquadro dell'editor IDE, puoi vedere i pulsanti CodeLens sopra i tipi GraphQL in /dataconnect/schema/schema.gql. Come hai fatto nella console, puoi creare una mutazione per aggiungere dati al database di produzione.

Per aggiungere dati a una tabella lavorando in locale:

  1. In schema.gql, fai clic sul pulsante Aggiungi dati sopra la dichiarazione di uno dei tuoi tipi (ad esempio Movie, Product, Account, a seconda della natura della tua app).
    Pulsante Aggiungi dati di Code Lens per Firebase Data Connect
  2. Un nuovo file, <type>_insert.qgl, viene aggiunto alla tua directory di lavoro, ad esempio Movie_insert.gql o Product_insert.gql. Hard code i dati nei campi per quel tipo.
  3. Fai clic sul pulsante Esegui (produzione).
    Pulsante Esegui di Code Lens per Firebase Data Connect
  4. Ripeti i passaggi precedenti per aggiungere un record ad altre tabelle.

Per verificare rapidamente che i dati siano stati aggiunti:

  1. Torna in schema.gql e fai clic sul pulsante Leggi dati sopra la dichiarazione del tipo.
  2. Nel file <type>_read.gql risultante, ad esempio Product_read.gql, fai clic sul pulsante Esegui (produzione) per eseguire la query.

Scopri di più sulle mutazioni di Data Connect nella documentazione

Flusso locale: definisci la query

Ora passiamo alla parte divertente, le query. In qualità di sviluppatore, sei abituato a scrivere query SQL anziché query GraphQL, quindi all'inizio può sembrare un po' diverso. Tuttavia, GraphQL è molto più conciso e sicuro dal punto di vista del tipo rispetto a SQL non elaborato. La nostra estensione VS Code semplifica l'esperienza di sviluppo.

Per implementare una query, puoi adattarne una generata con il nostro CodeLens:

  1. In /dataconnect/schema/schema.gql, sopra un tipo (Movie, Product, Account e così via), fai clic sul pulsante CodeLens Leggi dati.
  2. Nel file <type>_read.gql risultante, testa la query facendo clic sul pulsante Esegui (produzione).
  3. Copia la query funzionante in /dataconnect/connector/queries.gql.

  4. Per rendere questa query divisibile, dichiara un nome univoco.

    Ad esempio, nel seguente esempio generico, query_name potrebbe essere ListMovies, ListProducts o ListAccounts.

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

# @auth() directives control who can call each operation.
query <query_name> @auth(level: PUBLIC) {
   <table_name> {
     <field_1>
     <field_2>
     <field_3>
  }
}

Esegui la query utilizzando il pulsante CodeLens nelle vicinanze.

Scopri di più sulle query di Data Connect nella documentazione

Flusso locale: genera SDK

  1. Fai clic sul pulsante Aggiungi SDK all'app.

  2. Nella finestra di dialogo visualizzata, seleziona una directory contenente il codice per la tua app. Il codice dell'SDK Data Connect verrà generato e salvato lì.

  3. Seleziona la piattaforma della tua app, quindi tieni presente che il codice SDK viene generato immediatamente nella directory selezionata.

Flusso locale: esegui il deployment dello schema e delle query in produzione

Hai completato un'iterazione di sviluppo. Ora puoi eseguire il deployment di schema e query sul server con l'interfaccia utente dell'estensione Firebase o con l'interfaccia a riga di comando Firebase, proprio come hai fatto con lo schema.

Nella finestra dell'IDE, nell'interfaccia utente dell'estensione VS Code, fai clic sul pulsante Esegui il deployment in produzione.

Una volta eseguito il deployment, vai alla console Firebase per verificare che gli aggiornamenti dello schema (se applicabili) e le operazioni siano stati caricati sul cloud. Dovresti essere in grado di visualizzare lo schema ed eseguire le operazioni anche sulla console. L'istanza Cloud SQL per PostgreSQL verrà aggiornata con lo schema e i dati generati di cui è stato eseguito il deployment finale.

Scopri di più sull'utilizzo dell'emulatore Data Connect nella documentazione

Flusso locale: utilizza gli SDK per chiamare la query da un'app

Ora che lo schema aggiornato (se applicabile) e la query sono stati implementati in produzione, puoi utilizzare l'SDK generato da Data Connect per implementare una chiamata alla query ListMovies.

Web Swift Kotlin per Android Flutter
  1. Aggiungi Firebase alla tua app web.

  2. Nel file principale dell'app React:

    • Importa l'SDK generato
    • chiama i metodi Data Connect.
    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 />);
  1. Aggiungi Firebase alla tua app per iOS.

  2. Per utilizzare l'SDK generato, configuralo come dipendenza in Xcode.

    Nella barra di navigazione superiore di Xcode, seleziona File > Aggiungi dipendenze del pacchetto > Aggiungi locale e scegli la cartella contenente il file Package.swift generato.

  3. Nel delegato principale dell'app:

    • Importa l'SDK generato
    • chiama i metodi Data Connect.
    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()
    }
}
  1. Aggiungi Firebase alla tua app Android.

  2. Per utilizzare l'SDK generato, configura Data Connect come dipendenza in Gradle.

    Aggiorna plugins e dependencies in app/build.gradle.kts.

    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. Nell'attività principale dell'app:

    • Importa l'SDK generato
    • chiama i metodi Data Connect.
    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
      }
    }
  }
}
  1. Aggiungi Firebase alla tua app Flutter.
  2. Installa l'interfaccia a riga di comando flutterfire dart pub global activate flutterfire_cli.
  3. Esegui flutterfire configure.
  4. Nella funzione principale dell'app:
    • Importa l'SDK generato
    • chiama i metodi Data Connect.
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();
            }),
      )
    ])));
  }
}

Passaggi successivi

Esamina il progetto di cui è stato eseguito il deployment e scopri altri strumenti:

  • Aggiungi dati al database, controlla e modifica gli schemi e monitora il servizio Data Connect nella console Firebase.

Per ulteriori informazioni, consulta la documentazione. Ad esempio, poiché hai completato la guida rapida: