जनरेट किए गए Flutter SDK टूल का इस्तेमाल करना

Firebase Data Connect क्लाइंट एसडीके की मदद से, सर्वर-साइड की क्वेरी और म्यूटेशन को सीधे Firebase ऐप्लिकेशन से कॉल किया जा सकता है. स्कीमा, क्वेरी, और म्यूटेशन डिज़ाइन करते समय, कस्टम क्लाइंट एसडीके जनरेट किया जाता है. इन्हें Data Connect सेवा में डिप्लॉय किया जाता है. इसके बाद, इस एसडीके टूल के तरीकों को अपने क्लाइंट लॉजिक में इंटिग्रेट करें.

जैसा कि हमने यहां बताया है, यह ध्यान रखना ज़रूरी है कि Data Connect क्लाइंट कोड, क्वेरी और म्यूटेशन सबमिट नहीं करता है. इन्हें सर्वर पर लागू किया जाता है. इसके बजाय, डिप्लॉय किए जाने पर Data Connect कार्रवाइयों को Cloud Functions जैसे सर्वर पर सेव किया जाता है. इसका मतलब है कि आपको क्लाइंट-साइड में ज़रूरी बदलाव करने होंगे, ताकि मौजूदा उपयोगकर्ताओं को कोई परेशानी न हो. उदाहरण के लिए, ऐप्लिकेशन के पुराने वर्शन पर.

इसलिए, Data Connect आपको डेवलपर एनवायरमेंट और टूलिंग उपलब्ध कराता है. इससे आपको सर्वर पर डिप्लॉय किए गए स्कीमा, क्वेरी, और म्यूटेशन का प्रोटोटाइप बनाने में मदद मिलती है. प्रोटोटाइप बनाते समय, यह क्लाइंट-साइड एसडीके भी अपने-आप जनरेट करता है.

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

क्लाइंट डेवलपमेंट का वर्कफ़्लो क्या है?

अगर आपने शुरू करें सेक्शन में दिए गए निर्देशों का पालन किया है, तो आपको Data Connect के लिए डेवलपमेंट के पूरे फ़्लो के बारे में जानकारी मिल गई होगी. इस गाइड में, आपको अपने स्कीमा से Flutter SDK जनरेट करने के बारे में ज़्यादा जानकारी मिलेगी. साथ ही, क्लाइंट क्वेरी और म्यूटेशन के साथ काम करने के बारे में भी जानकारी मिलेगी.

संक्षेप में कहें, तो अपने क्लाइंट ऐप्लिकेशन में जनरेट किए गए Flutter SDK टूल इस्तेमाल करने के लिए, आपको ये ज़रूरी चरण पूरे करने होंगे:

1. अपने Flutter ऐप्लिकेशन में Firebase जोड़ें.
2. flutterfire सीएलआई dart pub global activate flutterfire_cli इंस्टॉल करें.
3. flutterfire configure रन करें.

इसके बाद:

1. अपने ऐप्लिकेशन का स्कीमा डेवलप करें.

2. एसडीके जनरेशन सेट अप करें:

   • हमारे Data Connect VS Code एक्सटेंशन में मौजूद, ऐप्लिकेशन में SDK जोड़ें बटन की मदद से
   • अपने connector.yaml को अपडेट करके.

3. अपने क्लाइंट कोड को शुरू करें और लाइब्रेरी इंपोर्ट करें.

4. क्वेरी के लिए कॉल लागू करें और म्यूटेशन.

5. Data Connect एम्युलेटर को सेट अप और इस्तेमाल करें और दोहराएं.

अपना Flutter SDK टूल जनरेट करना

ज़्यादातर Firebase प्रोजेक्ट की तरह, आपके Firebase Data Connect क्लाइंट कोड पर काम, लोकल प्रोजेक्ट डायरेक्ट्री में होता है. क्लाइंट कोड जनरेट करने और उसे मैनेज करने के लिए, Data Connect VS Code एक्सटेंशन और Firebase CLI, दोनों ही अहम लोकल टूल हैं.

एसडीके जनरेट करने के विकल्प, dataconnect.yaml आपके प्रोजेक्ट को शुरू करते समय जनरेट हुई फ़ाइल में मौजूद कई एंट्री से जुड़े होते हैं.

एसडीके जनरेट करने की प्रोसेस शुरू करना

connectorId: movies
generate:
  dartSdk:
    outputDir: ../../lib/generated # Feel free to change this to a different path
    package: movies

outputDir यह बताता है कि जनरेट किए गए एसडीके को कहां आउटपुट करना चाहिए. यह पाथ, उस डायरेक्ट्री के हिसाब से तय होता है जिसमें connector.yaml फ़ाइल मौजूद है. आपके पास outputDir का ऐब्सलूट पाथ देने का विकल्प होता है.

package पैकेज का नाम बताता है.

प्रोटोटाइपिंग के दौरान एसडीके अपडेट करना

अगर Data Connect VS Code एक्सटेंशन और इसके Data Connect एम्युलेटर की मदद से इंटरैक्टिव प्रोटोटाइपिंग की जा रही है, तो स्कीमा, क्वेरी, और म्यूटेशन तय करने वाली .gql फ़ाइलों में बदलाव करते समय, एसडीके की सोर्स फ़ाइलें अपने-आप जनरेट और अपडेट हो जाती हैं. यह सुविधा, हॉट (री)लोडिंग वर्कफ़्लो में मददगार हो सकती है.

इसके अलावा, .gql फ़ाइलों में बदलाव होने पर, SDK टूल को फिर से जनरेट करने के लिए, CLI का इस्तेमाल किया जा सकता है:

firebase dataconnect:sdk:generate --watch

इंटिग्रेशन और प्रोडक्शन रिलीज़ के लिए एसडीके जनरेट करना

कुछ मामलों में, जैसे कि सीआई टेस्ट के लिए प्रोजेक्ट सोर्स तैयार करते समय, बैच अपडेट के लिए Firebase सीएलआई को कॉल किया जा सकता है.

ऐसे मामलों में, firebase dataconnect:sdk:generate का इस्तेमाल करें.

क्लाइंट कोड सेट अप करना

Data Connect ऐप्लिकेशन को शुरू करना

सबसे पहले, Firebase को सेटअप करने के लिए दिए गए स्टैंडर्ड निर्देशों का इस्तेमाल करके, अपने ऐप्लिकेशन को शुरू करें.

इसके बाद, Data Connect प्लगिन इंस्टॉल करें:

flutter pub add firebase_data_connect

Data Connect Flutter SDK को शुरू करना

डेटा कनेक्ट को सेट अप करने के लिए इस्तेमाल की गई जानकारी का इस्तेमाल करके, अपने Data Connect इंस्टेंस को शुरू करें. यह जानकारी, Data Connect कंसोल के डेटा कनेक्ट टैब में उपलब्ध है.Firebase

लाइब्रेरी इंपोर्ट करना

क्लाइंट कोड को शुरू करने के लिए, दो तरह के इंपोर्ट की ज़रूरत होती है. पहला, सामान्य Data Connect इंपोर्ट और दूसरा, जनरेट किए गए खास एसडीके इंपोर्ट.

// general imports
import 'package:firebase_data_connect/firebase_data_connect.dart';

// generated queries and mutations from SDK
import 'generated/movies.dart';

क्लाइंट साइड पर क्वेरी का इस्तेमाल करना

जनरेट किए गए कोड में, पहले से तय किए गए क्वेरी रेफ़रंस शामिल होंगे. आपको बस execute को इंपोर्ट करके कॉल करना है.

import 'generated/movies.dart';

await MoviesConnector.instance.listMovies().execute();

एसडीके के क्वेरी वाले तरीकों को कॉल करना

यहां इन ऐक्शन शॉर्टकट फ़ंक्शन का इस्तेमाल करने का एक उदाहरण दिया गया है:

import 'generated/movies.dart';

function onBtnClick() {
  // This will call the generated Dart from the CLI and then make an HTTP request to the server.
  MoviesConnector.instance.listMovies().execute().then(data => showInUI(data)); // == MoviesConnector.instance.listMovies().ref().execute();
}

वैकल्पिक फ़ील्ड

कुछ क्वेरी में वैकल्पिक फ़ील्ड हो सकते हैं. ऐसे मामलों में, Flutter SDK टूल एक बिल्डर मेथड दिखाता है. इसे अलग से सेट करना होगा.

उदाहरण के लिए, createMovie को कॉल करते समय rating फ़ील्ड की वैल्यू देना ज़रूरी नहीं है. इसलिए, आपको इसे बिल्डर फ़ंक्शन में देना होगा.

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi"}).rating(5).execute();

बदलावों की सूचना पाने के लिए सदस्यता लेना

बदलावों के लिए सदस्यता ली जा सकती है. इससे क्वेरी चलाने पर, बदलावों के बारे में आपको सूचना मिलती रहेगी.

QueryRef<ListMoviesData, void> listRef = MoviesConnector.instance.listMovies().ref();

// subscribe will immediately invoke the query if no execute was called on it previously.
listRef.subscribe().listen((data) {
  updateUIWithMovies(data.movies);
});

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi" }).rating(5).execute();
await listRef.execute(); // will update the subscription above`

गिनती वाले फ़ील्ड में हुए बदलावों को हैंडल करना

किसी ऐप्लिकेशन के स्कीमा में गिनती की जानकारी शामिल हो सकती है. इसे आपकी GraphQL क्वेरी ऐक्सेस कर सकती हैं.

ऐप्लिकेशन के डिज़ाइन में बदलाव होने पर, इस्तेमाल की जा सकने वाली नई enum वैल्यू जोड़ी जा सकती हैं. उदाहरण के लिए, मान लें कि ऐप्लिकेशन के लाइफ़साइकल में बाद में, आपने AspectRatio enum में FULLSCREEN वैल्यू जोड़ने का फ़ैसला किया.

Data Connect वर्कफ़्लो में, स्थानीय डेवलपमेंट टूलिंग का इस्तेमाल करके अपनी क्वेरी और एसडीके अपडेट किए जा सकते हैं.

हालांकि, क्लाइंट के अपडेट किए गए वर्शन को रिलीज़ करने से पहले, हो सकता है कि पहले से डिप्लॉय किए गए क्लाइंट काम न करें.

रीसाइलेंट तरीके से लागू करने का उदाहरण

जनरेट किया गया एसडीके, ऐसी वैल्यू को मैनेज करने के लिए मजबूर करता है जिनकी पहचान नहीं हो पाती. इसका मतलब है कि क्लाइंट कोड को EnumValue ऑब्जेक्ट को Known या Unknown में अनरैप करना होगा.

final result = await MoviesConnector.instance.listMovies().execute();

if (result.data != null && result.data!.isNotEmpty) {
  handleEnumValue(result.data![0].aspectratio);
}

void handleEnumValue(EnumValue<AspectRatio> aspectValue) {
  if (aspectValue.value != null) {
    switch(aspectValue.value!) {
      case AspectRatio.ACADEMY:
        print("This movie is in Academy aspect");
        break;
      case AspectRatio.WIDESCREEN:
        print("This movie is in Widescreen aspect");
        break;
      case AspectRatio.ANAMORPHIC:
        print("This movie is in Anamorphic aspect");
        break;
      case AspectRatio.IMAX:
        print("This movie is in IMAX aspect");
    }
  } else {
    print("Unknown aspect ratio detected: ${aspectValue.stringValue}");
  }
}

क्लाइंट साइड पर म्यूटेशन का इस्तेमाल करना

म्यूटेशन को क्वेरी की तरह ही ऐक्सेस किया जा सकता है.

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi" }).rating(5).execute();

अपने Flutter ऐप्लिकेशन का प्रोटोटाइप बनाना और उनकी जांच करना

लोकल एम्युलेटर का इस्तेमाल करने के लिए क्लाइंट को इंस्ट्रूमेंट करना

Data Connect एम्युलेटर का इस्तेमाल किया जा सकता है. इसे Data Connect VS Code एक्सटेंशन या सीएलआई से ऐक्सेस किया जा सकता है.

ऐप्लिकेशन को एम्युलेटर से कनेक्ट करने के लिए, दोनों ही स्थितियों में एक ही तरीका इस्तेमाल किया जाता है.

import 'package:firebase_data_connect/firebase_data_connect.dart';
import 'generated/movies.dart';

MoviesConnector.instance.dataConnect
          .useDataConnectEmulator('127.0.0.1', 9399);

// Make calls from your app
QueryRef<ListMoviesData, void> ref = MoviesConnector.instance.listMovies.ref();

प्रोडक्शन रिसॉर्स पर स्विच करने के लिए, एम्युलेटर से कनेक्ट करने वाली लाइनों को टिप्पणी के तौर पर मार्क करें.

Dart SDK में डेटा टाइप

Data Connect सर्वर, सामान्य GraphQL डेटा टाइप दिखाता है. इन्हें एसडीके में इस तरह दिखाया जाता है.