Firebase Data Connect का इस्तेमाल शुरू करना

इस क्विकस्टार्ट की मदद से, Firebase Data Connect को सेट अप किया जा सकता है. इससे, वेब और मोबाइल ऐप्लिकेशन को PostgreSQL डेटाबेस से कनेक्ट किया जा सकता है. आपको ये काम करने होंगे:

  • VS Code और Firebase CLI की मदद से, अपने लोकल Firebase Data Connect प्रोजेक्ट की डायरेक्ट्री सेट अप करना.
  • सामान्य भाषा में, अपने ऐप्लिकेशन के आइडिया के आधार पर, Data Connect स्कीमा, क्वेरी, और म्यूटेशन जनरेट करना.
  • Data Connect Data Connect क्वेरी और म्यूटेशन चलाने के लिए, अपने ऐप्लिकेशन में मज़बूत टाइप वाले SDK टूल का इस्तेमाल करना.
  • PostgreSQL के लिए Cloud SQL इंस्टेंस, एक Data Connect स्कीमा, क्वेरी, और म्यूटेशन उपलब्ध कराना.

लोकल प्रोजेक्ट की डायरेक्ट्री सेट अप करना

Data Connect के लिए, लोकल डेवलपमेंट टूल दो तरीकों से इंस्टॉल किए जा सकते हैं.

  1. किसी प्रोजेक्ट डायरेक्ट्री में, यह कमांड चलाएं.

    स्क्रिप्ट, Firebase CLI और Data Connect VS Code एक्सटेंशन इंस्टॉल करती है. साथ ही, आपके प्रोजेक्ट को सेट अप करने के लिए, firebase init dataconnect के बारे में जानकारी देती है. अगर आपके पास VS Code डेस्कटॉप इंस्टॉल नहीं है, तो स्क्रिप्ट इसे ब्राउज़र में खोलती है.

    curl -sL https://firebase.tools/init/dataconnect | editor=true bash

  2. Visual Studio Code के बाएं पैनल में, Firebase आइकॉन पर क्लिक करके, Data Connect VS Code एक्सटेंशन की स्क्रीन खोलें.

  3. लोकल PGlite डेटाबेस के साथ एम्युलेटर चलाने के लिए, एम्युलेटर शुरू करें पर क्लिक करें.

स्कीमा की समीक्षा करना

Firebase Data Connect आपके डेटा मॉडल की परिभाषा तय करने के लिए GraphQL का इस्तेमाल करता है. @table डायरेक्टिव, GraphQL टाइप को PostgreSQL टेबल पर मैप करता है. टाइप में मौजूद फ़ील्ड, PostgreSQL कॉलम पर मैप होते हैं. अन्य @table टाइप के रेफ़रंस वाले फ़ील्ड का इस्तेमाल करके, टेबल के बीच रिलेशनशिप तय की जा सकती हैं. इनमें, कंपोज़िट प्राइमरी की वाली जॉइन टेबल का इस्तेमाल करके, मेनी-टू-मेनी रिलेशनशिप भी शामिल हैं.

डिफ़ॉल्ट सेटअप में, आप Data Connect स्कीमा फ़ाइलें dataconnect/schema/ डायरेक्ट्री में देख सकते हैं. यहां, मूवी टेंप्लेट स्कीमा से दो उदाहरण टेबल दिए गए हैं. अगर आपने इसे जनरेट करने के लिए Gemini का इस्तेमाल किया है, तो आपका स्कीमा अलग हो सकता है.

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")
}

स्कीमा के बारे में ज़्यादा जानेंData Connect

क्वेरी और म्यूटेशन डेवलप करना

Firebase Data Connect क्वेरी और म्यूटेशन के लिए GraphQL का इस्तेमाल करता है. इन्हें .gql फ़ाइलों में तय किया जाता है और आपके ऐप्लिकेशन से नाम के हिसाब से कॉल किया जाता है. GraphQL सिंटैक्स, मज़बूत टाइप वाले SDK टूल और एक फ़्लेक्सिबल एपीआई उपलब्ध कराता है. इससे, आपके ऐप्लिकेशन को जिस डेटा की ज़रूरत होती है उसे फ़ेच किया जा सकता है.

अपने डेटाबेस में डेटा सीड करना

एम्युलेटर के चालू होने पर, शुरुआती डेटा सीड किया जा सकता है. इसके लिए, दी गई dataconnect/seed_data.gql फ़ाइल का इस्तेमाल किया जा सकता है या अपने म्यूटेशन लिखे जा सकते हैं.

म्यूटेशन को एक्ज़ीक्यूट करने और अपने लोकल PGlite डेटाबेस में डेटा भरने के लिए, VS Code में चलाएं (लोकल) Code Lens बटन का इस्तेमाल करें.

Firebase Data Connect के लिए CodeLens Run बटन

क्वेरी और म्यूटेशन की समीक्षा करना

डिफ़ॉल्ट सेटअप में, Data Connect क्वेरी और म्यूटेशन, dataconnect/example/ डायरेक्ट्री में देखे जा सकते हैं.

नेस्ट की गई क्वेरी की मदद से, रिलेशनल डेटा को सटीक तरीके से क्वेरी किया जा सकता है.

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 की मदद से सुरक्षित क्वेरी और म्यूटेशन बनाने में आपकी मदद करता है.

अपने ऐप्लिकेशन को सुरक्षित रखने के लिए, वेब और मोबाइल ऐप्लिकेशन सिर्फ़ Data Connect क्वेरी और म्यूटेशन को @auth डायरेक्टिव की मदद से ऐक्सेस कर सकते हैं. क्वेरी और म्यूटेशन, Firebase Auth UID को सुरक्षित तरीके से ऐक्सेस कर सकते हैं {field}_expr: "auth.uid" जैसे एक्सप्रेशन का इस्तेमाल करके.

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

क्वेरी के बारे में ज़्यादा जानें म्यूटेशन के बारे में ज़्यादा जानें Auth के बारे में ज़्यादा जानेंData ConnectData ConnectData Connect

क्वेरी और म्यूटेशन जनरेट करना

Data Connect का असरदार तरीके से इस्तेमाल करने के लिए, GraphQL का एक्सपर्ट होना ज़रूरी नहीं है. सामान्य भाषा में दिए गए ब्यौरों से, Data Connect क्वेरी और म्यूटेशन जनरेट किए जा सकते हैं.

किसी भी .gql फ़ाइल में, टिप्पणी शुरू करने के लिए # टाइप करें. इसके बाद, क्वेरी या म्यूटेशन के बारे में बताएं. फिर, GraphQL ऑपरेशन जनरेट करने के लिए, ऑपरेशन जनरेट/बेहतर बनाएं Code Lens बटन का इस्तेमाल करें.

Firebase DataConnect के लिए CodeLens जनरेट बटन

अपने ऐप्लिकेशन में जनरेट किए गए SDK टूल का इस्तेमाल करना

firebase init dataconnect आपके प्रोजेक्ट में मौजूद ऐप्लिकेशन के लिए, टाइप-सेफ़ SDK टूल अपने-आप सेट अप कर देता है. ज़रूरत पड़ने पर, Data Connect VS Code एक्सटेंशन में मौजूद ऐप्लिकेशन में SDK टूल जोड़ें बटन का इस्तेमाल करके या firebase init dataconnect:sdk चलाकर, SDK टूल को मैन्युअल तरीके से जोड़ा जा सकता है.

वेब

  1. अपने वेब ऐप्लिकेशन में Firebase जोड़ें.

  2. अपने React ऐप्लिकेशन की मुख्य फ़ाइल में:

    • जनरेट किए गए SDK टूल को इंपोर्ट करें:
    // Update as needed with the path to your generated SDK.
import { listMovies, ListMoviesData } from '@dataconnect/generated';
    • अपने ऐप्लिकेशन को, Data Connect एम्युलेटर से कनेक्ट करने के लिए इंस्ट्रूमेंट करें:
    import { connectDataConnectEmulator } from 'firebase/data-connect';

const dataConnect = getDataConnect(connectorConfig);
connectDataConnectEmulator(dataConnect, 'localhost', 9399);
    • Data Connect तरीके कॉल करें.
    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. अपने iOS ऐप्लिकेशन में Firebase जोड़ें.

  2. जनरेट किए गए SDK टूल का इस्तेमाल करने के लिए, इसे Xcode में डिपेंडेंसी के तौर पर कॉन्फ़िगर करें.

    Xcode में सबसे ऊपर मौजूद नेविगेशन बार में, फ़ाइल > पैकेज डिपेंडेंसी जोड़ें > लोकल जोड़ें को चुनें. इसके बाद, जनरेट की गई Package.swift वाली फ़ोल्डर को चुनें.

  3. अपने ऐप्लिकेशन के मुख्य डेलिगेट में:

    • Data Connect SDK टूल और जनरेट किए गए SDK टूल को इंपोर्ट करें:

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

let connector = DataConnect.moviesConnector

    • अपने ऐप्लिकेशन को, Data Connect एम्युलेटर से कनेक्ट करने के लिए इंस्ट्रूमेंट करें:

      // 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 तरीके कॉल करें:

      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. अपने Android ऐप्लिकेशन में Firebase जोड़ें.

  2. जनरेट किए गए SDK टूल का इस्तेमाल करने के लिए, Data Connect को Gradle में डिपेंडेंसी के तौर पर कॉन्फ़िगर करें.

    अपनी app/build.gradle.kts में, plugins और dependencies को अपडेट करें.

    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. अपने ऐप्लिकेशन की मुख्य गतिविधि में:

    • जनरेट किए गए SDK टूल से, कनेक्टर इंस्टेंस पाएं:
    private val connector = com.myapplication.MoviesConnector.instance
    • अपने ऐप्लिकेशन को, Data Connect एम्युलेटर से कनेक्ट करने के लिए इंस्ट्रूमेंट करें:
    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 तरीके कॉल करें.
    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. अपने Flutter ऐप्लिकेशन में Firebase जोड़ें.
  2. flutterfire CLI dart pub global activate flutterfire_cli इंस्टॉल करें.
  3. flutterfire configure चलाएं.

  4. अपने ऐप्लिकेशन के मुख्य फ़ंक्शन में:

    • जनरेट किए गए SDK टूल को इंपोर्ट करें:
    // Generated queries.
// Update as needed with the path to your generated SDK

import 'movies_connector/movies.dart';
    • अपने ऐप्लिकेशन को, Data Connect एम्युलेटर से कनेक्ट करने के लिए इंस्ट्रूमेंट करें:
    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 तरीके कॉल करें.
    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();
            }),
      )
    ])));
  }
}

प्रोडक्शन में डिप्लॉय करना

अपने स्कीमा, क्वेरी, और म्यूटेशन को प्रोडक्शन में डिप्लॉय करने के लिए:

  1. कीमत वाले पेज पर, कीमत और बिना किसी शुल्क के आज़माने की सुविधा से जुड़ी जानकारी की समीक्षा करें. आपका प्रोजेक्ट, Firebase Data Connect को आज़माने के विकल्पों में से किसी एक के लिए ज़रूरी शर्तें पूरी कर सकता है.

  2. Data Connect VS Code एक्सटेंशन में मौजूद प्रोडक्शन में डिप्लॉय करें बटन पर क्लिक करें या टर्मिनल में यह कमांड चलाएं:

    firebase deploy --only dataconnect

    डिप्लॉय करने के बाद, अपना स्कीमा देखने और क्वेरी और म्यूटेशन चलाने के लिए, Firebase कंसोल पर जाएं.

dataconnect.yaml के बारे में ज़्यादा जानें Cloud SQL के साथ Data Connect के काम करने के तरीके के बारे में ज़्यादा जानें

अगले चरण

क्विकस्टार्ट पूरा करने के बाद, यहां कुछ अगले चरण दिए गए हैं: