इस शुरुआती लेख में, आपको अपने ऐप्लिकेशन में प्रोडक्शन एसक्यूएल इंस्टेंस का इस्तेमाल करके Firebase Data Connect बनाने का तरीका पता चलेगा.
Firebase कंसोल में, ये काम किए जा सकते हैं:
- अपने Firebase प्रोजेक्ट में Firebase Data Connect जोड़ें.
- Firebase कंसोल में, किसी ऐप्लिकेशन के लिए स्कीमा बनाएं. इसके लिए, स्कीमा असिस्ट का इस्तेमाल करें और उसे डिप्लॉय करें.
- अपने ऐप्लिकेशन के लिए Cloud SQL इंस्टेंस का प्रावधान करें.
- Gemini Code Assist की मदद से, अपने डेटाबेस को सैंपल डेटा से पॉप्युलेट करें.
इसके बाद, अपने लोकल डेवलपमेंट एनवायरमेंट में, आपको:
- अपने प्रोडक्शन इंस्टेंस के साथ काम करने के लिए, डेवलपमेंट टूल सेट अप करें. इसमें Visual Studio के कोड एक्सटेंशन को भी शामिल करें.
- अपने स्थानीय एनवायरमेंट को, कंसोल में बनाई गई एसेट के साथ सिंक करें.
- एक्सटेंशन टूल का इस्तेमाल करके, ऐसी क्वेरी लागू करें जिसका इस्तेमाल आपके ऐप्लिकेशन में किया जाएगा.
- स्ट्रोंगली टाइप किए गए SDK टूल जनरेट करें और उनका इस्तेमाल अपने ऐप्लिकेशन में करें.
- अपने आखिरी स्कीमा, क्वेरी, और डेटा को क्लाउड पर डिप्लॉय करें.
कंसोल फ़्लो: अपना स्कीमा डिज़ाइन करना और उसे अपने डेटाबेस में डिप्लॉय करना
- अगर आपने पहले से कोई Firebase प्रोजेक्ट नहीं बनाया है, तो एक प्रोजेक्ट बनाएं.
- Firebase कंसोल में, प्रोजेक्ट जोड़ें पर क्लिक करें. इसके बाद, स्क्रीन पर दिए गए निर्देशों का पालन करें.
- Firebase कंसोल के Data Connect सेक्शन पर जाएं.
- Gemini का इस्तेमाल शुरू करें बटन पर क्लिक करें.
- इसके बाद, दिखने वाले स्कीमा जनरेटर वर्कफ़्लो पैनल में, किसी ऐप्लिकेशन के बारे में बताएं, ताकि Gemini आपके साथ मिलकर GraphQL स्कीमा बनाने में मदद कर सके.
- GraphQL स्कीमा की समीक्षा करें. इसके बाद, अपग्रेड करें और डिप्लॉय करें पर क्लिक करें.
अपने प्रोजेक्ट को ब्लेज़ प्लान पर अपग्रेड करें. इसकी मदद से, PostgreSQL इंस्टेंस के लिए Cloud SQL बनाया जा सकता है.
नया Cloud SQL इंस्टेंस बनाएं चुनें. इसके बाद, दिखने वाले डायलॉग बॉक्स में, PostgreSQL के लिए Cloud SQL डेटाबेस के लिए कोई लोकेशन और नाम चुनें.
आपके ऐप्लिकेशन स्कीमा को उस स्कीमा से जुड़े PostgreSQL डेटाबेस के साथ डिप्लॉय किया जाता है.
कंसोल फ़्लो: म्यूटेशन बनाने और अपने डेटाबेस को पॉप्युलेट करने के लिए, 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 में, डेवलपमेंट टूल इंस्टॉल करने के दो तरीके उपलब्ध हैं.
ज़रूरी शर्तें
इस क्विकस्टार्ट का इस्तेमाल करने के लिए, आपके पास ये चीज़ें होनी चाहिए.
- Visual Studio Code.
- Node.js इंस्टॉलेशन, जिसमें Windows के लिए nvm-windows या macOS या Linux के लिए nvm का इस्तेमाल किया गया हो.
- एक Firebase प्रोजेक्ट. अगर आपने पहले से कोई खाता नहीं बनाया है, तो Firebase कंसोल में जाकर ऐसा करें.
लोकल फ़्लो: डेवलपमेंट एनवायरमेंट सेट अप करना
- अपने लोकल प्रोजेक्ट के लिए एक नई डायरेक्ट्री बनाएं.
- नई डायरेक्ट्री में VS Code खोलें.
- Visual Studio Code Marketplace से Firebase Data Connect एक्सटेंशन इंस्टॉल करें.
लोकल फ़्लो: अपनी प्रोजेक्ट डायरेक्ट्री सेट अप करना
अपना लोकल प्रोजेक्ट सेट अप करने के लिए, अपनी प्रोजेक्ट डायरेक्ट्री को शुरू करें. IDE विंडो में, बाईं ओर मौजूद पैनल में, Firebase आइकॉन पर क्लिक करके, Data Connect VS Code एक्सटेंशन का यूज़र इंटरफ़ेस (यूआई) खोलें:
- Google से साइन इन करें बटन पर क्लिक करें.
- Firebase प्रोजेक्ट कनेक्ट करें बटन पर क्लिक करें और वह प्रोजेक्ट चुनें जिसे आपने पहले कंसोल में बनाया था.
firebase init चलाएं बटन पर क्लिक करें और फ़्लो पूरा करें.
एमुलेटर शुरू करें बटन पर क्लिक करें.
लोकल फ़्लो: लोकल एनवायरमेंट में अपना स्कीमा ढूंढना
पिछले सेक्शन में बताए गए firebase init
चरण में, Console से डिप्लॉय किए गए स्कीमा को आपके लोकल डेवलपमेंट एनवायरमेंट के साथ सिंक किया गया था.
अपना स्कीमा ढूंढें: यह आपके Firebase प्रोजेक्ट डायरेक्ट्री में, /dataconnect/schema/schema.gql
फ़ाइल में मौजूद होता है.
लोकल फ़्लो: अपने स्कीमा के साथ काम करना
स्कीमा का उदाहरण: फ़िल्म
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 म्यूटेशन के बारे में ज़्यादा जानें
लोकल फ़्लो: अपनी क्वेरी तय करना
अब मज़ेदार हिस्सा, क्वेरी. डेवलपर के तौर पर, आपको GraphQL क्वेरी के बजाय SQL क्वेरी लिखने की आदत होती है. इसलिए, शुरुआत में आपको यह थोड़ा अलग लग सकता है. हालांकि, GraphQL, रॉ SQL की तुलना में ज़्यादा कम शब्दों में और टाइप-सेफ़ है. साथ ही, हमारा VS Code ऐप्लिकेशन, डेवलपमेंट का अनुभव आसान बनाता है.
किसी क्वेरी को लागू करने के लिए, CodeLens की मदद से जनरेट की गई क्वेरी में बदलाव किया जा सकता है:
/dataconnect/schema/schema.gql
में, किसी टाइप (Movie
,Product
,Account
वगैरह) के ऊपर, डेटा पढ़ें CodeLens बटन पर क्लिक करें.- इसके बाद,
<type>_read.gql
फ़ाइल में, चालू करें (प्रोडक्शन) बटन पर क्लिक करके क्वेरी की जांच करें. - काम करने वाली क्वेरी को
/dataconnect/connector/queries.gql
में कॉपी करें. इस क्वेरी को डिप्लॉय करने के लिए, इसके लिए कोई यूनीक नाम डालें.
उदाहरण के लिए, नीचे दिए गए सामान्य उदाहरण में,
query_name
के तौर परListMovies
,ListProducts
या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>
}
}
आस-पास मौजूद CodeLens बटन का इस्तेमाल करके क्वेरी को लागू करें.
दस्तावेज़ में, Data Connect क्वेरी के बारे में ज़्यादा जानें
लोकल फ़्लो: SDK टूल जनरेट करना
- ऐप्लिकेशन में SDK टूल जोड़ें बटन पर क्लिक करें.
इसके बाद, आपको एक डायलॉग दिखेगा. इसमें अपने ऐप्लिकेशन का कोड वाली डायरेक्ट्री चुनें. Data Connect एसडीके कोड जनरेट होकर वहां सेव हो जाएगा.
अपना ऐप्लिकेशन प्लैटफ़ॉर्म चुनें. इसके बाद, ध्यान दें कि आपकी चुनी गई डायरेक्ट्री में एसडीके टूल का कोड तुरंत जनरेट हो जाता है.
लोकल फ़्लो: अपने स्कीमा और क्वेरी को प्रोडक्शन में डिप्लॉय करना
आपने डेवलपमेंट के किसी चरण पर काम किया हो. अब Firebase एक्सटेंशन के यूज़र इंटरफ़ेस (यूआई) या Firebase सीएलआई की मदद से, अपने स्कीमा और क्वेरी को सर्वर पर डिप्लॉय किया जा सकता है. ठीक उसी तरह जैसे आपने स्कीमा को डिप्लॉय किया था.
IDE विंडो में, VS Code एक्सटेंशन यूज़र इंटरफ़ेस (यूआई) में, प्रोडक्शन में डिप्लॉय करें बटन पर क्लिक करें.
डिप्लॉय होने के बाद, Firebase कंसोल पर जाएं और स्कीमा अपडेट (अगर लागू हो) की पुष्टि करें. साथ ही, यह भी देखें कि ऑपरेशन को क्लाउड पर अपलोड किया गया है या नहीं. आपके पास स्कीमा देखने और कंसोल पर भी अपने ऑपरेशन चलाने का विकल्प होना चाहिए. 'PostgreSQL के लिए Cloud SQL' इंस्टेंस को, डिप्लॉय किए गए आखिरी स्कीमा और डेटा के साथ अपडेट किया जाएगा.
दस्तावेज़ में, 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 टूल जनरेट करने और क्वेरी और म्यूटेशन को कॉल करने के बारे में जानें.