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

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

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

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

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

  1. ये ज़रूरी शर्तें पूरी करें:

  2. एक प्रोजेक्ट डायरेक्ट्री बनाएं और उसे Visual Studio Code में खोलें.

  3. VS Code Marketplace से, Firebase Data Connect एक्सटेंशन इंस्टॉल करें.

  4. Google से साइन इन करें बटन पर क्लिक करें.

  5. Firebase प्रोजेक्ट कनेक्ट करें बटन पर क्लिक करें.

  6. Run firebase init बटन पर क्लिक करें.

  7. स्थानीय PGlite डेटाबेस के साथ Data Connect इम्यूलेटर चलाने के लिए, इम्यूलेटर शुरू करें बटन पर क्लिक करें.

समीक्षा स्कीमा

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

डिफ़ॉल्ट सेटअप में, आपको Data Connect डायरेक्ट्री में 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")
}

डेटा कनेक्ट स्कीमा के बारे में ज़्यादा जानें

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

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

आपके डेटाबेस में मौजूद सीड डेटा

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

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

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

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

डिफ़ॉल्ट सेटअप में, आपको 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 के साथ सुरक्षित क्वेरी और म्यूटेशन बनाए जा सकते हैं.

अपने ऐप्लिकेशन को सुरक्षित रखने के लिए, वेब और मोबाइल ऐप्लिकेशन सिर्फ़ @auth डायरेक्टिव के साथ Data Connect क्वेरी और म्यूटेशन को ऐक्सेस कर सकते हैं. क्वेरी और म्यूटेशन, {field}_expr: "auth.uid" जैसे एक्सप्रेशन का इस्तेमाल करके, Firebase 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
    }
  )
}

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

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

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

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

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

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

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

वेब

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

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

    • जनरेट किए गए एसडीके को इंपोर्ट करें:
    // 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. जनरेट किए गए एसडीके टूल का इस्तेमाल करने के लिए, इसे Xcode में डिपेंडेंसी के तौर पर कॉन्फ़िगर करें.

    Xcode के सबसे ऊपर मौजूद नेविगेशन बार में, File > Add Package Dependencies > Add Local को चुनें. इसके बाद, जनरेट की गई 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 टूल का इस्तेमाल करने के लिए, Gradle में Data Connect को डिपेंडेंसी के तौर पर कॉन्फ़िगर करें.

    अपने 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 सीएलआई dart pub global activate flutterfire_cli इंस्टॉल करें.
  3. flutterfire configure रन करें.

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

    • जनरेट किए गए एसडीके को इंपोर्ट करें:
    // 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 प्रोजेक्ट को अपग्रेड करें.

  2. डेटा कनेक्ट VS Code एक्सटेंशन में मौजूद, Deploy to production बटन पर क्लिक करें या टर्मिनल में यह कमांड चलाएं:

    firebase deploy --only dataconnect

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

dataconnect.yaml के बारे में ज़्यादा जानें इस बारे में ज़्यादा जानें कि Data Connect, Cloud SQL के साथ कैसे काम करता है

अगले चरण

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