इस शुरुआती लेख में, आपको अपने ऐप्लिकेशन में प्रोडक्शन एसक्यूएल इंस्टेंस का इस्तेमाल करके Firebase Data Connect बनाने का तरीका पता चलेगा.
Firebase कंसोल में, ये काम किए जा सकते हैं:
- अपने Firebase प्रोजेक्ट में Firebase Data Connect जोड़ें.
- Firebase Console में, एआई की मदद से स्कीमा जनरेट करने की सुविधा का इस्तेमाल करके, किसी ऐप्लिकेशन के लिए स्कीमा बनाएं और उसे डिप्लॉय करें.
- अपने ऐप्लिकेशन के लिए Cloud SQL इंस्टेंस का प्रावधान करें.
- Firebase में Gemini की मदद से, अपने डेटाबेस को सैंपल डेटा से पॉप्युलेट करें.
- एआई की मदद से ऑपरेशन जनरेट करने की सुविधा का इस्तेमाल करके, क्वेरी और म्यूटेशन बनाएं. इन्हें डिप्लॉय करके, क्लाइंट कोड को स्थानीय तौर पर डेवलप किया जा सकता है.
इसके बाद, अपने लोकल डेवलपमेंट एनवायरमेंट में, आपको:
- अपने प्रोडक्शन इंस्टेंस के साथ काम करने के लिए, डेवलपमेंट टूल सेट अप करें. इसमें Visual Studio के कोड एक्सटेंशन को भी शामिल करें.
- अपने स्थानीय एनवायरमेंट को, कंसोल में बनाई गई एसेट के साथ सिंक करें.
- स्ट्रोंगली टाइप किए गए SDK टूल जनरेट करें और उनका इस्तेमाल अपने ऐप्लिकेशन में करें.
कंसोल फ़्लो: स्कीमा डिज़ाइन करने के लिए एआई की मदद लें. इसके बाद, उसे अपने डेटाबेस में डिप्लॉय करें
- अगर आपने पहले से कोई Firebase प्रोजेक्ट नहीं बनाया है, तो एक प्रोजेक्ट बनाएं.
- Firebase कंसोल में, प्रोजेक्ट जोड़ें पर क्लिक करें. इसके बाद, स्क्रीन पर दिए गए निर्देशों का पालन करें.
- Firebase कंसोल के Data Connect सेक्शन पर जाएं.
- Gemini का इस्तेमाल शुरू करें बटन पर क्लिक करें.
- इसके बाद, दिखने वाले स्कीमा जनरेटर वर्कफ़्लो पैनल में, किसी ऐप्लिकेशन के बारे में बताएं, ताकि Gemini आपके साथ मिलकर GraphQL स्कीमा बनाने में मदद कर सके.
- GraphQL स्कीमा की समीक्षा करें. इसके बाद, अपग्रेड करें और डिप्लॉय करें पर क्लिक करें.
अपने प्रोजेक्ट को ब्लेज़ प्लान पर अपग्रेड करें. इसकी मदद से, PostgreSQL इंस्टेंस के लिए Cloud SQL बनाया जा सकता है.
नया Cloud SQL इंस्टेंस बनाएं चुनें. इसके बाद, दिखने वाले डायलॉग बॉक्स में, PostgreSQL के लिए Cloud SQL डेटाबेस के लिए कोई लोकेशन और नाम चुनें.
आपके ऐप्लिकेशन स्कीमा को उस स्कीमा से जुड़े PostgreSQL डेटाबेस के साथ डिप्लॉय किया जाता है.
कंसोल फ़्लो: अपने क्लाइंट के लिए ऑपरेशन बनाने के लिए, एआई की मदद लें
स्कीमा डिप्लॉय होने के बाद, अपने क्लाइंट ऐप्लिकेशन से इस डेटा को ऐक्सेस करने के लिए, शुरुआती कदम उठाए जा सकते हैं. इसके लिए, बैकएंड में डिप्लॉय करने के लिए क्वेरी और म्यूटेशन का कनेक्टर बनाएं. इसके बाद, क्लाइंट से कॉल करें.
एआई की मदद से काम करने वाले हमारे टूल आपकी मदद के लिए मौजूद हैं.
जब कहा जाए, तब Gemini की मदद से ऑपरेशन जनरेट करें बटन पर क्लिक करें.
कुछ देर बाद, अपने ऑपरेशन जनरेट करें वर्कफ़्लो पैनल दिखेगा. इसमें, अपने स्कीमा के आधार पर, Gemini की ओर से दी गई क्वेरी और म्यूटेशन की सूची देखें.
हर ऑपरेशन की लाइन पर क्लिक करके, उस ऑपरेशन के बारे में बताने वाले GraphQL कोड की समीक्षा करें. अगर ज़रूरी हो, तो ट्रैशबिन कंट्रोल का इस्तेमाल करके, उन कार्रवाइयों को मिटाएं जिनकी आपको ज़रूरत नहीं है.
कार्रवाइयां जोड़ने के लिए, + जोड़ें बटन पर क्लिक करें. इसके बाद:
अपने ऑपरेशन के बारे में सामान्य भाषा में बताएं.
उदाहरण के लिए:
List all products
जनरेट किए गए GraphQL की समीक्षा करें.
अगर कार्रवाई स्वीकार की जा सकती है, तो उसे अपनी कार्रवाइयों की सूची में जोड़ने के लिए, शामिल करें पर क्लिक करें.
ऑपरेशन को तब तक हटाते और जोड़ते रहें, जब तक आपका ऑपरेशन सेट स्वीकार नहीं कर लिया जाता.
क्लाइंट से कॉल किए जा सकने वाले कनेक्टर सेट के तौर पर, कार्रवाइयों की इस सूची को डिप्लॉय करने के लिए, कनेक्टर का नाम चुनें. इसके बाद, डिप्लॉय करें पर क्लिक करें.
कंसोल फ़्लो: म्यूटेशन बनाने और अपने डेटाबेस को पॉप्युलेट करने के लिए, Firebase में Gemini का इस्तेमाल करना
पिछले चरणों को पूरा करके, आपने काम की इकाई टाइप वाला एक Data Connect स्कीमा बनाया और उसे प्रोडक्शन में डिप्लॉय किया. इसका मतलब है कि उससे जुड़ी टेबल वाला PostgreSQL डेटाबेस भी बनाया और डिप्लॉय किया गया.
अपने डेटाबेस को पॉप्युलेट करने के लिए, Firebase में Gemini का इस्तेमाल किया जा सकता है. इससे आपको अपनी टेबल को अपडेट करने के लिए, GraphQL म्यूटेशन तय करने में मदद मिलेगी. साथ ही, अपडेट की पुष्टि करने के लिए क्वेरी तय करने में भी मदद मिलेगी.
डेटा टैब खोलें.
GraphQL लिखने में मेरी मदद करें pen_spark आइकॉन पर क्लिक करें और दिखने वाले बॉक्स में अपना इनपुट टाइप करें.
उदाहरण के लिए:
Add data for three sample products to my app.
जनरेट करें पर क्लिक करें. म्यूटेशन दिखाया जाता है.
आउटपुट की समीक्षा करें. अगर ज़रूरी हो, तो प्रॉम्प्ट को बेहतर बनाने के लिए, बदलाव करें पर क्लिक करें और फिर फिर से जनरेट करें पर क्लिक करें.
इसके बाद, डेटा एडिटर में म्यूटेशन डालने के लिए, शामिल करें पर क्लिक करें.
चालू करें पर क्लिक करें.
म्यूटेशन चलाने पर, डेटा आपके PostgreSQL डेटाबेस में लागू टेबल में लिखा जाता है. सेव किया गया डेटा देखने के लिए, console में क्वेरी बनाई जा सकती है:
क्वेरी बनाने के लिए, GraphQL लिखने में मेरी मदद करो pen_spark का इस्तेमाल करके, पिछले चरण दोहराएं.
इसके बाद, दिखने वाले बॉक्स में अपना इनपुट टाइप करें.
उदाहरण के लिए:
Query data for all sample products in my app.
जनरेट करें पर क्लिक करें. इसके बाद, चालू करें पर क्लिक करें.
लोकल फ़्लो: डेवलपमेंट टूल चुनना
अब आपके डिप्लॉय किए गए डेटाबेस में डेटा है और आपने एक कनेक्टर डिप्लॉय कर दिया है. अब अपने लोकल डेवलपमेंट एनवायरमेंट में स्कीमा और कनेक्टर का डेवलपमेंट जारी रखा जा सकता है.
सबसे पहले, आपको एक लोकल इनवायरनमेंट सेट अप करना होगा. Data Connect में, डेवलपमेंट टूल इंस्टॉल करने के दो तरीके उपलब्ध हैं.
लोकल फ़्लो: डेवलपमेंट एनवायरमेंट सेट अप करना
- अपने लोकल प्रोजेक्ट के लिए नई डायरेक्ट्री बनाएं.
अपनी बनाई गई नई डायरेक्ट्री में, यह कमांड चलाएं.
curl -sL https://firebase.tools/dataconnect | bash
यह स्क्रिप्ट, आपके लिए डेवलपमेंट एनवायरमेंट सेट अप करने और ब्राउज़र पर काम करने वाले आईडीई को लॉन्च करने की कोशिश करती है. यह IDE, पहले से बंडल किए गए VS Code एक्सटेंशन के साथ-साथ टूल उपलब्ध कराता है. इनकी मदद से, स्कीमा को मैनेज किया जा सकता है. साथ ही, अपने ऐप्लिकेशन में इस्तेमाल की जाने वाली क्वेरी और म्यूटेशन तय किए जा सकते हैं. इसके अलावा, स्ट्रोंग-टाइप वाले SDK टूल जनरेट किए जा सकते हैं.
alias dataconnect='curl -sL https://firebase.tools/dataconnect | bash'
लोकल फ़्लो: अपनी प्रोजेक्ट डायरेक्ट्री सेट अप करना
अपना लोकल प्रोजेक्ट सेट अप करने के लिए, अपनी प्रोजेक्ट डायरेक्ट्री को शुरू करें. IDE विंडो में, बाईं ओर मौजूद पैनल में, Firebase आइकॉन पर क्लिक करके, Data Connect VS Code एक्सटेंशन का यूज़र इंटरफ़ेस (यूआई) खोलें:
- Google से साइन इन करें बटन पर क्लिक करें.
- Firebase प्रोजेक्ट कनेक्ट करें बटन पर क्लिक करें और वह प्रोजेक्ट चुनें जिसे आपने पहले कंसोल में बनाया था.
firebase init चलाएं बटन पर क्लिक करें और फ़्लो पूरा करें.
एमुलेटर शुरू करें बटन पर क्लिक करें.
लोकल फ़्लो: लोकल एनवायरमेंट में अपना स्कीमा और कनेक्टर ढूंढना
पिछले सेक्शन में दिया गया firebase init
चरण, ऐसेट को आपके लोकल डेवलपमेंट एनवायरमेंट से सिंक करता है:
- यह आपके डिप्लॉय किए गए स्कीमा को सिंक करता है
- अपना स्कीमा ढूंढें: यह आपके Firebase प्रोजेक्ट डायरेक्ट्री में,
/dataconnect/schema/schema.gql
फ़ाइल में मौजूद होता है.
- अपना स्कीमा ढूंढें: यह आपके Firebase प्रोजेक्ट डायरेक्ट्री में,
- यह आपके डिप्लॉय किए गए कनेक्टर में क्वेरी और म्यूटेशन सिंक करता है
- अपना कनेक्टर ढूंढें: ऑपरेशन, आपके Firebase प्रोजेक्ट की डायरेक्ट्री में,
/dataconnect/connector/
डायरेक्ट्री में मौजूद होते हैं.
- अपना कनेक्टर ढूंढें: ऑपरेशन, आपके Firebase प्रोजेक्ट की डायरेक्ट्री में,
लोकल फ़्लो: अपने स्कीमा को समझना
स्कीमा का उदाहरण: फ़िल्म
Data Connect में, GraphQL फ़ील्ड कॉलम पर मैप किए जाते हैं. Movie
टाइप में id
, title
, imageUrl
, और genre
शामिल हो सकते हैं.
Data Connect, प्राइमटिव डेटा टाइप String
और 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
}
स्कीमा के उदाहरण के तौर पर 1:1 टेबल: MovieMetadata
फ़िल्मों के लिए, फ़िल्म का मेटाडेटा मॉडल किया जा सकता है.
उदाहरण के लिए, schema.gql
में, 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
}
ध्यान दें कि movie
फ़ील्ड, Movie
टाइप पर मैप किया गया है.
Data Connect को पता है कि यह Movie
और MovieMetadata
के बीच का संबंध है. साथ ही, वह आपके लिए इस संबंध को मैनेज करेगा.
दस्तावेज़ में, Data Connect स्कीमा के बारे में ज़्यादा जानें
लोकल फ़्लो: अपनी टेबल में ज़्यादा डेटा जोड़ना
IDE एडिटर पैनल में, आपको /dataconnect/schema/schema.gql
में मौजूद GraphQL टाइप के ऊपर CodeLens बटन दिख सकते हैं. अपने प्रोडक्शन डेटाबेस में डेटा जोड़ने के लिए, ठीक उसी तरह म्यूटेशन बनाया जा सकता है जिस तरह आपने कंसोल में किया था.
स्थानीय तौर पर काम करते हुए, टेबल में डेटा जोड़ने के लिए:
schema.gql
में, अपने किसी एक टाइप (जैसे,Movie
,Product
,Account
, जो आपके ऐप्लिकेशन के टाइप पर निर्भर करता है) के एलान के ऊपर मौजूद, डेटा जोड़ें बटन पर क्लिक करें.
- आपकी वर्किंग डायरेक्ट्री में एक नई फ़ाइल,
<type>_insert.qgl
जोड़ी जाती है. जैसे,Movie_insert.gql
याProduct_insert.gql
. उस टाइप के लिए, फ़ील्ड में डेटा को हार्ड कोड करें. - चालू करें (प्रोडक्शन) बटन पर क्लिक करें.
- अन्य टेबल में रिकॉर्ड जोड़ने के लिए, पिछले चरण दोहराएं.
डेटा जोड़े जाने की पुष्टि करने के लिए:
schema.gql
में वापस जाकर, टाइप के एलान के ऊपर मौजूद डेटा पढ़ें बटन पर क्लिक करें.Product_read.gql
जैसी<type>_read.gql
फ़ाइल में, क्वेरी को लागू करने के लिए, चालू करें (प्रोडक्शन) बटन पर क्लिक करें.
दस्तावेज़ में, Data Connect म्यूटेशन के बारे में ज़्यादा जानें
लोकल फ़्लो: SDK टूल जनरेट करना
आपके स्कीमा और कनेक्टर के ऑपरेशन, स्थानीय तौर पर सिंक किए जाते हैं. अब iOS, Android, वेब, और Flutter ऐप्लिकेशन में क्वेरी और म्यूटेशन के लिए कॉल लागू करने के लिए, क्लाइंट SDK टूल जनरेट करने के लिए लोकल टूल का इस्तेमाल किया जा सकता है.
- ऐप्लिकेशन में SDK टूल जोड़ें बटन पर क्लिक करें.
इसके बाद, आपको एक डायलॉग दिखेगा. इसमें, अपने ऐप्लिकेशन का कोड वाली डायरेक्ट्री चुनें. Data Connect एसडीके कोड जनरेट होकर वहां सेव हो जाएगा.
अपना ऐप्लिकेशन प्लैटफ़ॉर्म चुनें. इसके बाद, ध्यान दें कि आपकी चुनी गई डायरेक्ट्री में एसडीके टूल का कोड तुरंत जनरेट हो जाता है.
लोकल फ़्लो: किसी ऐप्लिकेशन से अपनी क्वेरी कॉल करने के लिए, SDK टूल का इस्तेमाल करना
अब आपका अपडेट किया गया स्कीमा (अगर लागू हो) और क्वेरी, प्रोडक्शन में डिप्लॉय हो गई है. इसलिए, ListMovies
क्वेरी को कॉल करने के लिए, Data Connect से जनरेट किए गए SDK टूल का इस्तेमाल किया जा सकता है.
वेब
- अपने वेब ऐप्लिकेशन में Firebase जोड़ें.
अपने React ऐप्लिकेशन की मुख्य फ़ाइल में:
- जनरेट किया गया SDK टूल इंपोर्ट करना
- 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 />);
Swift
- अपने iOS ऐप्लिकेशन में Firebase जोड़ें.
जनरेट किए गए SDK टूल का इस्तेमाल करने के लिए, इसे Xcode में डिपेंडेंसी के तौर पर कॉन्फ़िगर करें.
Xcode के सबसे ऊपर मौजूद नेविगेशन बार में, फ़ाइल > पैकेज की डिपेंडेंसी जोड़ें > लोकल जोड़ें को चुनें. इसके बाद, जनरेट किया गया
Package.swift
वाला फ़ोल्डर चुनें.अपने ऐप्लिकेशन के मुख्य डेलीगेट में:
- जनरेट किया गया SDK टूल इंपोर्ट करना
- 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() } }
Kotlin Android
- अपने Android ऐप्लिकेशन में Firebase जोड़ें.
जनरेट किए गए 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") }
आपके ऐप्लिकेशन की मुख्य गतिविधि में:
- जनरेट किया गया SDK टूल इंपोर्ट करना
- 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 } } } }
Flutter
- अपने Flutter ऐप्लिकेशन में Firebase जोड़ें.
- flutterfire सीएलआई
dart pub global activate flutterfire_cli
इंस्टॉल करें. flutterfire configure
चलाएं.- आपके ऐप्लिकेशन के मुख्य फ़ंक्शन में:
- जनरेट किया गया SDK टूल इंपोर्ट करना
- 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();
}),
)
])));
}
}
अगले चरण
डिप्लॉय किए गए प्रोजेक्ट की समीक्षा करें और ज़्यादा टूल खोजें:
- अपने डेटाबेस में डेटा जोड़ें, अपने स्कीमा की जांच करें और उनमें बदलाव करें. साथ ही, Firebase console में अपनी Data Connect सेवा को मॉनिटर करें.
दस्तावेज़ में ज़्यादा जानकारी पाएं. उदाहरण के लिए, आपने शुरू करने के लिए दिया गया तरीका पूरा कर लिया है, तो:
- स्कीमा, क्वेरी, और म्यूटेशन जनरेट करने में मदद पाने के लिए, एआई से जुड़े ज़्यादा टूल और दिशा-निर्देश देखें. एआई की सहायता से जुड़ी गाइड में, प्रॉम्प्ट लिखने के सबसे सही तरीके बताए गए हैं.
- स्कीमा, क्वेरी, और म्यूटेशन डेवलपमेंट के बारे में ज़्यादा जानें
- वेब, Android, iOS, और Flutter के लिए क्लाइंट कोड से क्लाइंट SDK टूल जनरेट करने और क्वेरी और म्यूटेशन को कॉल करने के बारे में जानें.