Firebase Data Connect का इस्तेमाल स्थानीय तौर पर शुरू करना

संग्रह की मदद से व्यवस्थित रहें अपनी प्राथमिकताओं के आधार पर, कॉन्टेंट को सेव करें और कैटगरी में बांटें.

इस शुरुआती लेख में, आपको प्रोडक्शन SQL इंस्टेंस सेट अप किए बिना, अपने ऐप्लिकेशन में Firebase Data Connect को स्थानीय तौर पर बनाने का तरीका पता चलेगा. आपको:

• अपने Firebase प्रोजेक्ट में Firebase Data Connect जोड़ें.
• स्थानीय इंस्टेंस के साथ काम करने के लिए, Visual Studio कोड एक्सटेंशन के साथ डेवलपमेंट एनवायरमेंट सेट अप करें.
• इसके बाद, हम आपको बताएंगे कि:
  • मूवी ऐप्लिकेशन के लिए स्कीमा बनाना
  • अपने ऐप्लिकेशन में इस्तेमाल की जाने वाली क्वेरी और म्यूटेशन तय करें
  • लोकल एमुलेटर के सैंपल डेटा की मदद से, अपनी क्वेरी और म्यूटेशन की जांच करना
  • स्ट्रोंगली टाइप किए गए SDK टूल जनरेट करना और उन्हें अपने ऐप्लिकेशन में इस्तेमाल करना
  • अपने फ़ाइनल स्कीमा, क्वेरी, और डेटा को क्लाउड पर डिप्लॉय करें. हालांकि, ऐसा करना ज़रूरी नहीं है. ऐसा करने के लिए, Blaze प्लान को अपग्रेड करना होगा.

स्थानीय डेवलपमेंट फ़्लो चुनना

Data Connect में, डेवलपमेंट टूल इंस्टॉल करने और स्थानीय तौर पर काम करने के दो तरीके उपलब्ध हैं.

ज़रूरी शर्तें

इस क्विकस्टार्ट का इस्तेमाल करने के लिए, आपके पास ये चीज़ें होनी चाहिए.

• एक Firebase प्रोजेक्ट. अगर आपने पहले से कोई खाता नहीं बनाया है, तो Firebase कंसोल में जाकर ऐसा करें.

लोकल फ़्लो: डेवलपमेंट एनवायरमेंट सेट अप करना

1. अपने लोकल प्रोजेक्ट के लिए एक नई डायरेक्ट्री बनाएं.

2. अपनी बनाई गई नई डायरेक्ट्री में, यह कमांड चलाएं.

     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 एक्सटेंशन का यूज़र इंटरफ़ेस (यूआई) खोलें:

1. Google से साइन इन करें बटन पर क्लिक करें.
2. Firebase प्रोजेक्ट कनेक्ट करें बटन पर क्लिक करें और वह प्रोजेक्ट चुनें जिसे आपने पहले कंसोल में बनाया था.
3. firebase init चलाएं बटन पर क्लिक करें.

4. एमुलेटर शुरू करें बटन पर क्लिक करें.

स्कीमा बनाना

अपने Firebase प्रोजेक्ट डायरेक्ट्री में, /dataconnect/schema/schema.gql फ़ाइल में, फ़िल्मों के बारे में GraphQL स्कीमा तय करना शुरू करें.

मूवी

Data Connect में, GraphQL फ़ील्ड कॉलम पर मैप किए जाते हैं. मूवी में id, title, imageUrl, और genre है. Data Connect, प्राइमिटिव डेटा टाइप को पहचानता है: String और UUID.

नीचे दिया गया स्निपेट कॉपी करें या फ़ाइल में मौजूद उससे जुड़ी लाइनों से कम्यूट हटाएं.

# By default, a UUID id key will be created by default as primary key.
# If you want to specify a primary key, say title, which you can do through
# the @table(key: "title") directive
type Movie @table {
  id: UUID! @default(expr: "uuidV4()")
  title: String!
  imageUrl: String!
  genre: String
}

MovieMetadata

नीचे दिया गया स्निपेट कॉपी करें या फ़ाइल में मौजूद उससे जुड़ी लाइनों से कम्यूट हटाएं.

# 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 बटन दिखेंगे. डेटा जोड़ें और चालू करें (लोकल) बटन का इस्तेमाल करके, अपने लोकल डेटाबेस में डेटा जोड़ा जा सकता है.

Movie और MovieMetadata टेबल में रिकॉर्ड जोड़ने के लिए:

1. schema.gql में, Movie टाइप के एलान के ऊपर मौजूद, डेटा जोड़ें बटन पर क्लिक करें.
   
2. जनरेट की गई Movie_insert.gql फ़ाइल में, तीन फ़ील्ड के लिए डेटा को हार्ड कोड करें.
3. चालू करें (लोकल) बटन पर क्लिक करें.
   
4. MovieMetadata टेबल में रिकॉर्ड जोड़ने के लिए, पिछले चरण दोहराएं. इसके लिए, जनरेट किए गए MovieMetadata_insert म्यूटेशन में बताए गए तरीके के मुताबिक, movieId फ़ील्ड में अपनी फ़िल्म का id डालें.

डेटा जोड़े जाने की पुष्टि तुरंत करने के लिए:

1. schema.gql में वापस जाकर, Movie टाइप के एलान के ऊपर मौजूद, डेटा पढ़ें बटन पर क्लिक करें.
2. क्वेरी को लागू करने के लिए, Movie_read.gql फ़ाइल में चालू करें (लोकल) बटन पर क्लिक करें.

दस्तावेज़ में, Data Connect म्यूटेशन के बारे में ज़्यादा जानें

अपनी क्वेरी तय करें

अब मज़ेदार हिस्सा: चलिए, उन क्वेरी के बारे में बताते हैं जिनकी आपको अपने ऐप्लिकेशन में ज़रूरत होगी. डेवलपर के तौर पर, आपको GraphQL क्वेरी के बजाय SQL क्वेरी लिखने की आदत होती है. इसलिए, शुरुआत में आपको यह थोड़ा अलग लग सकता है.

हालांकि, GraphQL, रॉ SQL की तुलना में ज़्यादा कम शब्दों में और टाइप-सेफ़ है. साथ ही, हमारा VS Code ऐप्लिकेशन, डेवलपमेंट का अनुभव आसान बनाता है.

/dataconnect/connector/queries.gql फ़ाइल में बदलाव करना शुरू करें. अगर आपको सभी मूवी चाहिए, तो इस तरह की क्वेरी का इस्तेमाल करें.

# File `/dataconnect/connector/queries.gql`

# @auth() directives control who can call each operation.
# Anyone should be able to list all movies, so the auth level is set to PUBLIC
query ListMovies @auth(level: PUBLIC) {
  movies {
    id
    title
    imageUrl
    genre
  }
}

आस-पास मौजूद CodeLens बटन का इस्तेमाल करके क्वेरी को लागू करें.

यहां एक बहुत ही दिलचस्प सुविधा है, जिसमें डेटाबेस के संबंधों को ग्राफ़ की तरह दिखाया जा सकता है. MovieMetadata रिकॉर्ड में एक movie फ़ील्ड होता है, जिसमें किसी फ़िल्म का रेफ़रंस होता है. इसलिए, फ़ील्ड में नेस्ट करके, फ़िल्म की जानकारी वापस पाई जा सकती है. जनरेट किए गए movieMetadata_on_movie टाइप को ListMovies क्वेरी में जोड़कर देखें.

query ListMovies @auth(level: PUBLIC) {
  movies {
    id
    title
    imageUrl
    genre
    movieMetadata_on_movie {
        rating
    }
  }
}

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

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

IDE के बाएं पैनल में, Firebase आइकॉन पर क्लिक करके, Data Connect VS Code एक्सटेंशन का यूज़र इंटरफ़ेस (यूआई) खोलें:

1. ऐप्लिकेशन में SDK टूल जोड़ें बटन पर क्लिक करें.

2. इसके बाद, आपको एक डायलॉग दिखेगा. इसमें अपने ऐप्लिकेशन का कोड वाली डायरेक्ट्री चुनें. Data Connect एसडीके कोड जनरेट होकर वहां सेव हो जाएगा.

3. अपना ऐप्लिकेशन प्लैटफ़ॉर्म चुनें. इसके बाद, ध्यान दें कि आपकी चुनी गई डायरेक्ट्री में एसडीके टूल का कोड तुरंत जनरेट हो जाता है.

किसी ऐप्लिकेशन से अपनी क्वेरी को कॉल करने के लिए, SDK टूल का इस्तेमाल करना

ListMovies क्वेरी के लिए कॉल लागू करने के लिए, Data Connect के जनरेट किए गए एसडीके टूल का इस्तेमाल किया जा सकता है. इसके बाद, 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,
  );
  
  MoviesConnector.instance.dataConnect
      .useDataConnectEmulator(Uri.base.host, 443, isSecure: true);
  
  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();
            }),
      )
    ])));
  }
}

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

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

1. Firebase कंसोल के 'डेटा कनेक्ट' सेक्शन पर जाएं और मुफ़्त में आज़माने के लिए Cloud SQL इंस्टेंस बनाएं.

2. IDE में इंटिग्रेट किए गए टर्मिनल में, firebase init dataconnect चलाएं और Console पर अभी-अभी बनाया गया क्षेत्र/सेवा आईडी चुनें.

3. "फ़ाइल dataconnect/dataconnect.yaml पहले से मौजूद है, क्या इसे बदलना है?" के लिए पूछे जाने पर, "हां" चुनें.

4. IDE विंडो में, VS Code एक्सटेंशन यूज़र इंटरफ़ेस (यूआई) में, प्रोडक्शन में डिप्लॉय करें बटन पर क्लिक करें.

5. डिप्लॉय करने के बाद, Firebase कंसोल पर जाकर, पुष्टि करें कि स्कीमा, कार्रवाइयां, और डेटा को क्लाउड पर अपलोड किया गया है. आपको स्कीमा देखने के साथ-साथ, Console पर भी अपने ऑपरेशन चलाने की सुविधा मिलनी चाहिए. 'PostgreSQL के लिए Cloud SQL' इंस्टेंस को, डिप्लॉय किए गए आखिरी स्कीमा और डेटा के साथ अपडेट किया जाएगा.

अगले चरण

डिप्लॉय किए गए प्रोजेक्ट की समीक्षा करें और ज़्यादा टूल खोजें:

• अपने डेटाबेस में डेटा जोड़ें, अपने स्कीमा की जांच करें और उनमें बदलाव करें. साथ ही, Firebase कंसोल में अपनी Data Connect सेवा को मॉनिटर करें.

दस्तावेज़ में ज़्यादा जानकारी पाएं. उदाहरण के लिए, आपने शुरू करने के लिए दिया गया तरीका पूरा कर लिया है, तो:

• स्कीमा, क्वेरी, और म्यूटेशन डेवलपमेंट के बारे में ज़्यादा जानें
• वेब, Android, iOS, और Flutter के लिए क्लाइंट SDK टूल जनरेट करने और क्लाइंट कोड से क्वेरी और म्यूटेशन को कॉल करने के बारे में जानें.