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

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

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

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

Firebase प्रोजेक्ट और Cloud SQL डेटाबेस बनाना

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

3. अपने प्रोजेक्ट को ब्लेज़ प्लान पर अपग्रेड करें. इसकी मदद से, PostgreSQL इंस्टेंस के लिए Cloud SQL बनाया जा सकता है.

4. Cloud SQL for PostgreSQL डेटाबेस के लिए कोई जगह चुनें.

5. बाद में पुष्टि करने के लिए, प्रोजेक्ट, सेवा, और डेटाबेस के नाम और आईडी नोट कर लें.

6. सेटअप के बाकी चरणों को पूरा करें. इसके बाद, हो गया पर क्लिक करें.

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

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

डेवलपमेंट एनवायरमेंट सेट अप करना

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 फ़ील्ड कॉलम पर मैप किए जाते हैं. 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
}

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 स्कीमा के बारे में ज़्यादा जानें

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

जारी रखने से पहले, आपको अपना स्कीमा डिप्लॉय करना होगा.

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

अपने स्कीमा को प्रोडक्शन डेटाबेस में डिप्लॉय करने के बाद, आपको Firebase कंसोल में स्कीमा दिखेगा.

अपनी टेबल में डेटा जोड़ना

IDE एडिटर पैनल में, आपको /dataconnect/schema/schema.gql में मौजूद GraphQL टाइप के ऊपर CodeLens बटन दिख सकते हैं. आपने अपना स्कीमा, प्रोडक्शन में डिप्लॉय कर दिया है. इसलिए, डेटा जोड़ें और चालू करें (प्रोडक्शन) बटन का इस्तेमाल करके, बैकएंड पर अपने डेटाबेस में डेटा जोड़ा जा सकता है.

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

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 बटन का इस्तेमाल करके क्वेरी को लागू करें.

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

SDK टूल जनरेट करना

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

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

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

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

आपने डेवलपमेंट के किसी चरण पर काम किया हो. अब Firebase एक्सटेंशन के यूज़र इंटरफ़ेस (यूआई) या Firebase CLI की मदद से, अपने स्कीमा, डेटा, और क्वेरी को सर्वर पर डिप्लॉय किया जा सकता है. ठीक उसी तरह जैसे आपने स्कीमा को डिप्लॉय किया था.

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

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

दस्तावेज़ में, Data Connect एमुलेटर का इस्तेमाल करने के बारे में ज़्यादा जानें

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

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

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

• स्कीमा, क्वेरी, और म्यूटेशन डेवलपमेंट के बारे में ज़्यादा जानें

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