Firebase Data Connect (iOS / Swift) का इस्तेमाल करके बनाना

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

1. खास जानकारी

इस कोडलैब में, Firebase Data Connect को Cloud SQL डेटाबेस के साथ इंटिग्रेट करने की प्रोसेस के बारे में बताया गया है. इससे, SwiftUI का इस्तेमाल करके iOS के लिए, मूवी की समीक्षा करने वाला ऐप्लिकेशन बनाया जा सकता है

इस ट्यूटोरियल में, Firebase Data Connect का इस्तेमाल करके अपने iOS ऐप्लिकेशन को Cloud SQL डेटाबेस से कनेक्ट करने का तरीका बताया गया है. इससे, मूवी की समीक्षाओं के लिए डेटा को आसानी से सिंक किया जा सकता है.

इस कोडलैब के आखिर तक, आपके पास एक ऐसा iOS ऐप्लिकेशन होगा जिसमें उपयोगकर्ता, फ़िल्में ब्राउज़ कर पाएंगे और उन्हें पसंदीदा के तौर पर मार्क कर पाएंगे. यह ऐप्लिकेशन, Firebase Data Connect की मदद से Cloud SQL डेटाबेस का इस्तेमाल करता है.

आपको क्या सीखने को मिलेगा

इस कोडलैब से आपको इनके बारे में जानकारी मिलेगी:

• Firebase Emulator Suite का इस्तेमाल करके, Firebase Data Connect को सेट अप करें. इससे, आपको कम समय में डेटा ऐक्सेस करने की सुविधा मिलती है.
• Data Connect और GraphQL का इस्तेमाल करके, डेटाबेस स्कीमा डिज़ाइन करना.
• अपने डेटाबेस स्कीमा से टाइप-सेफ़ Swift SDK टूल बनाएं और उसे Swift ऐप्लिकेशन में जोड़ें.
• अपने उपयोगकर्ताओं के डेटा को सुरक्षित रखने के लिए, उपयोगकर्ता की पुष्टि करने की सुविधा लागू करें और उसे Firebase Data Connect के साथ इंटिग्रेट करें.
• GraphQL की मदद से काम करने वाली क्वेरी और म्यूटेशन का इस्तेमाल करके, Cloud SQL में डेटा को वापस पाएं, अपडेट करें, मिटाएं, और मैनेज करें.
• (ज़रूरी नहीं) प्रोडक्शन में Data Connect सेवा डिप्लॉय करें.

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

• Xcode का नया वर्शन
• कोडलैब का सैंपल कोड. आपको कोडलैब के शुरुआती चरणों में से किसी एक चरण में, सैंपल कोड डाउनलोड करना होगा.

2. सैंपल प्रोजेक्ट सेट अप करना

Firebase प्रोजेक्ट बनाना

1. अपने Google खाते से Firebase कंसोल में साइन इन करें.
2. Firebase कंसोल में, Firebase प्रोजेक्ट बनाएं पर क्लिक करें.
3. अपने Firebase प्रोजेक्ट के लिए कोई नाम डालें. उदाहरण के लिए, "Friendly Flix". इसके बाद, जारी रखें पर क्लिक करें.
4. आपसे अपने Firebase प्रोजेक्ट के लिए, एआई की मदद पाने की सुविधा चालू करने के लिए कहा जा सकता है. इस कोडलैब के लिए, आपके चुने गए विकल्प से कोई फ़र्क़ नहीं पड़ता.
5. आपसे Google Analytics चालू करने के लिए कहा जा सकता है. इस कोडलैब के लिए, आपके चुने गए विकल्प से कोई फ़र्क़ नहीं पड़ता.
6. एक मिनट के बाद, आपका Firebase प्रोजेक्ट तैयार हो जाएगा. जारी रखें पर क्लिक करें.

कोड डाउनलोड करना

इस कोडलैब के सैंपल कोड को क्लोन करने के लिए, यह कमांड चलाएं. इससे आपकी मशीन पर codelab-dataconnect-ios नाम की डायरेक्ट्री बन जाएगी:

git clone https://github.com/peterfriese/codelab-dataconnect-ios`

अगर आपकी मशीन पर git नहीं है, तो कोड को सीधे GitHub से भी डाउनलोड किया जा सकता है.

Firebase कॉन्फ़िगरेशन जोड़ना

Firebase SDK टूल, आपके Firebase प्रोजेक्ट से कनेक्ट करने के लिए कॉन्फ़िगरेशन फ़ाइल का इस्तेमाल करता है. Apple के प्लैटफ़ॉर्म पर, इस फ़ाइल को GoogleServices-Info.plist कहा जाता है. इस चरण में, आपको कॉन्फ़िगरेशन फ़ाइल डाउनलोड करनी होगी और उसे अपने Xcode प्रोजेक्ट में जोड़ना होगा.

1. Firebase कंसोल में, बाईं ओर मौजूद नेविगेशन में प्रोजेक्ट की खास जानकारी चुनें.
2. प्लैटफ़ॉर्म चुनने के लिए, iOS+ बटन पर क्लिक करें. Apple बंडल आईडी के लिए कहा जाने पर, com.google.firebase.samples.FriendlyFlix का इस्तेमाल करें
3. ऐप्लिकेशन रजिस्टर करें पर क्लिक करें. इसके बाद, GoogleServices-Info.plist फ़ाइल डाउनलोड करने के लिए दिए गए निर्देशों का पालन करें.
4. डाउनलोड की गई फ़ाइल को, अभी-अभी डाउनलोड किए गए कोड की start/FriendlyFlix/app/FriendlyFlix/FriendlyFlix/ डायरेक्ट्री में ले जाएं. साथ ही, मौजूदा GoogleServices-Info.plist फ़ाइल को बदलें.
5. इसके बाद, Firebase कंसोल में प्रोजेक्ट सेटअप करने की प्रोसेस पूरी करने के लिए, आगे बढ़ें पर कुछ समय तक क्लिक करें. आपको ऐप्लिकेशन में SDK टूल जोड़ने की ज़रूरत नहीं है, क्योंकि स्टार्टर प्रोजेक्ट में इसकी पहले से ही व्यवस्था की जा चुकी है.
6. आखिर में, सेटअप की प्रोसेस पूरी करने के लिए, कंसोल पर जारी रखें पर क्लिक करें.

3. Data Connect सेट अप करना

इंस्टॉल करना

अपने-आप इंस्टॉल होने की सुविधा

codelab-dataconnect-ios/FriendlyFlix डायरेक्ट्री में यह कमांड चलाएं:

curl -sL https://firebase.tools/dataconnect | bash

यह स्क्रिप्ट, आपके लिए डेवलपमेंट एनवायरमेंट सेट अप करने और ब्राउज़र पर काम करने वाले आईडीई को लॉन्च करने की कोशिश करती है. यह IDE, टूल के साथ-साथ पहले से बंडल किया गया VS Code एक्सटेंशन भी उपलब्ध कराता है. इससे आपको अपने स्कीमा को मैनेज करने और अपने ऐप्लिकेशन में इस्तेमाल की जाने वाली क्वेरी और म्यूटेशन तय करने में मदद मिलती है. साथ ही, यह स्ट्रॉन्ग-टाइप वाले SDK टूल जनरेट करता है.

स्क्रिप्ट चलाने के बाद, VS Code अपने-आप खुल जाना चाहिए.

ऐसा करने के बाद, लोकल डायरेक्ट्री में VS Code को चलाकर, VS Code को शुरू किया जा सकता है:

code .

मैन्युअल रूप से इंस्टॉल करना

1. Visual Studio Code इंस्टॉल करना
2. Node.js इंस्टॉल करना
3. VS Code में, codelab-dataconnect-ios/FriendlyFlix डायरेक्ट्री खोलें.
4. Visual Studio Code Marketplace से Firebase Data Connect एक्सटेंशन इंस्टॉल करें.

प्रोजेक्ट में Data Connect को शुरू करना

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

1. Google से साइन इन करें बटन पर क्लिक करें. इसके बाद, एक ब्राउज़र विंडो खुलेगी. अपने Google खाते से एक्सटेंशन में साइन इन करने के लिए, दिए गए निर्देशों का पालन करें.
2. Firebase प्रोजेक्ट कनेक्ट करें बटन पर क्लिक करें और कंसोल में पहले से बनाया गया प्रोजेक्ट चुनें.
3. firebase init चलाएं बटन पर क्लिक करें और इंटिग्रेट किए गए टर्मिनल में दिया गया तरीका अपनाएं.

SDK टूल जनरेशन को कॉन्फ़िगर करना

firebase init चलाएं बटन पर क्लिक करने के बाद, Firebase Data Connect एक्सटेंशन आपके लिए dataconnect डायरेक्ट्री को शुरू कर देगा.

VS Code में, dataconnect/connector/connector.yaml फ़ाइल खोलें. इसमें आपको डिफ़ॉल्ट कॉन्फ़िगरेशन दिखेगा.

कृपया कॉन्फ़िगरेशन अपडेट करें और नीचे दी गई सेटिंग का इस्तेमाल करें, ताकि यह पक्का किया जा सके कि जनरेट किया गया कोड इस कोडलैब के साथ काम करता है. खास तौर पर, पक्का करें कि connectorId, friendly-flix पर सेट हो और Swift पैकेज, FriendlyFlixSDK पर सेट हो.

connectorId: "friendly-flix"
generate:
  swiftSdk:
    outputDir: "../../app"
    package: "FriendlyFlixSDK"
    observablePublisher: observableMacro

इन सेटिंग का मतलब यहां बताया गया है:

• connectorId - इस कनेक्टर के लिए यूनीक नाम.
• outputDir - वह पाथ जहां जनरेट किया गया Data Connect SDK टूल सेव किया जाएगा. यह पाथ, connector.yaml फ़ाइल वाली डायरेक्ट्री के हिसाब से है.
• package - जनरेट किए गए Swift पैकेज के लिए इस्तेमाल किया जाने वाला पैकेज का नाम.

इस फ़ाइल को सेव करने के बाद, Firebase Data Connect आपके लिए FriendlyFlixSDK नाम का एक Swift पैकेज जनरेट करेगा और उसे FriendlyFlix प्रोजेक्ट फ़ोल्डर के बगल में रखेगा.

Firebase एमुलेटर शुरू करना

VS Code में, Firebase व्यू पर स्विच करें. इसके बाद, एम्युलेटर शुरू करें बटन पर क्लिक करें.

इससे इंटिग्रेट किए गए टर्मिनल में Firebase एम्युलेटर शुरू हो जाएगा. आउटपुट कुछ ऐसा दिखेगा:

npx -y firebase-tools@latest emulators:start --project <your-project-id>

जनरेट किए गए पैकेज को अपने Swift ऐप्लिकेशन में जोड़ना

1. FriendlyFlix/app/FriendlyFlix/FriendlyFlix.xcodeproj को Xcode में खोलना
2. फ़ाइल > पैकेज की डिपेंडेंसी जोड़ें... को चुनें
3. लोकल जोड़ें... पर क्लिक करें. इसके बाद, FriendlyFlix/app फ़ोल्डर से FriendlyFlixSDK पैकेज जोड़ें
4. पैकेज की डिपेंडेंसी को हल करने के लिए, Xcode का इंतज़ार करें.
5. FriendlyFlixSDK के लिए पैकेज प्रॉडक्ट चुनें डायलॉग में, टारगेट के तौर पर FriendlyFlix चुनें और पैकेज जोड़ें पर क्लिक करें.

लोकल एमुलेटर का इस्तेमाल करने के लिए, iOS ऐप्लिकेशन को कॉन्फ़िगर करना

1. FriendlyFlixApp.swift खोलें. (तुरंत खोलें डायलॉग बॉक्स खोलने के लिए, CMD + Shift + O दबाएं. इसके बाद, फ़ाइल को तुरंत ढूंढने के लिए "FriendlyFlixApp" टाइप करें)
2. अपने स्कीमा के लिए Firebase, Firebase Auth, Firebase Data Connect, और जनरेट किया गया SDK टूल इंपोर्ट करें
3. Initialiser में, Firebase को कॉन्फ़िगर करें.
4. पक्का करें कि DataConnect और Firebase Auth, लोकल एमुलेटर का इस्तेमाल करें.

import SwiftUI
import os
import Firebase
import FirebaseAuth
import FriendlyFlixSDK
import FirebaseDataConnect

@main
struct FriendlyFlixApp: App {
  ...

  init() {
    FirebaseApp.configure()
    if useEmulator {
      DataConnect.friendlyFlixConnector.useEmulator(port: 9399)
      Auth.auth().useEmulator(withHost: "localhost", port: 9099)
    }

    authenticationService = AuthenticationService()
  }

  ...

}

5. डेस्टिनेशन ड्रॉपडाउन में, कोई iOS सिम्युलेटर चुनें.
6. ऐप्लिकेशन को सिम्युलेटर पर चलाने के लिए, Xcode में CMD+R दबाएं या रन करें बटन पर क्लिक करें.

4. स्कीमा तय करना और डेटाबेस को पहले से पॉप्युलेट करना

इस सेक्शन में, आपको स्कीमा में फ़िल्म के ऐप्लिकेशन की मुख्य इकाइयों के बीच के स्ट्रक्चर और संबंधों के बारे में बताना होगा. Movie, MovieMetaData जैसी इकाइयों को डेटाबेस टेबल में मैप किया जाता है. साथ ही, Firebase Data Connect और GraphQL स्कीमा डायरेक्टिव का इस्तेमाल करके, इन इकाइयों के बीच संबंध बनाए जाते हैं.

मुख्य इकाइयां और रिलेशनशिप

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

इस चरण में, आपको Movie और MovieMetadata टाइप बनाने होंगे.

मूवी

Movie टाइप, फ़िल्म इकाई के मुख्य स्ट्रक्चर के बारे में बताता है. इसमें title, genre, releaseYear, और rating जैसे फ़ील्ड शामिल होते हैं.

VS Code में, dataconnect/schema/schema.gql में Movie टाइप की परिभाषा जोड़ें:

type Movie @table {
  id: UUID! @default(expr: "uuidV4()")
  title: String!
  imageUrl: String!
  releaseYear: Int
  genre: String
  rating: Float
  description: String
  tags: [String]
}

MovieMetadata

MovieMetadata टाइप, Movie टाइप के साथ एक-एक का संबंध बनाता है. इसमें ज़्यादा जानकारी शामिल होती है, जैसे कि फ़िल्म का निर्देशक.

dataconnect/schema/schema.gql फ़ाइल में MovieMetadata टेबल की परिभाषा जोड़ें:

type MovieMetadata @table {
  movie: Movie! @ref
  director: String
}

अपने-आप जनरेट होने वाले फ़ील्ड और डिफ़ॉल्ट वैल्यू

यूनीक आईडी और टाइमस्टैंप अपने-आप जनरेट करने के लिए, स्कीमा @default(expr: "uuidV4()") जैसे एक्सप्रेशन का इस्तेमाल करता है. उदाहरण के लिए, नया रिकॉर्ड बनाने पर, Movie टाइप में मौजूद id फ़ील्ड में यूयूआईडी अपने-आप भर जाता है.

फ़िल्मों और फ़िल्म के मेटाडेटा के लिए मॉक डेटा डालना

स्कीमा तय करने के बाद, अब टेस्टिंग के लिए डेटाबेस में मॉक डेटा पहले से भरा जा सकता है.

1. Finder में, finish/FriendlyFlix/dataconnect/moviedata_insert.gql को start/FriendlyFlix/dataconnect फ़ोल्डर में कॉपी करें.
2. VS Code में, dataconnect/moviedata_insert.gql खोलें.
3. पक्का करें कि Firebase Data Connect एक्सटेंशन में एमुलेटर चल रहे हों.
4. आपको फ़ाइल में सबसे ऊपर, चालू करें (लोकल) बटन दिखेगा. अपने डेटाबेस में, मूवी का मॉक डेटा डालने के लिए इस पर क्लिक करें.
5. Data Connect Execution टर्मिनल देखकर पुष्टि करें कि डेटा जोड़ दिया गया है.

डेटा सेट अप करने के बाद, Data Connect में क्वेरी बनाने का तरीका जानने के लिए अगले चरण पर जाएं.

5. फ़िल्में वापस लाना और दिखाना

इस सेक्शन में, आपको मूवी की सूची दिखाने की सुविधा लागू करनी होगी.

सबसे पहले, आपको एक ऐसी क्वेरी बनाने का तरीका पता चलेगा जो movies टेबल से सभी फ़िल्मों को वापस लाती है. Firebase Data Connect, टाइप-सेफ़ SDK टूल के लिए कोड जनरेट करता है. इसका इस्तेमाल, क्वेरी को लागू करने और अपने ऐप्लिकेशन के यूज़र इंटरफ़ेस (यूआई) में, खोजी गई फ़िल्मों को दिखाने के लिए किया जा सकता है.

ListMovies क्वेरी तय करना

Firebase Data Connect में क्वेरी, GraphQL में लिखी जाती हैं. इससे यह तय किया जा सकता है कि किन फ़ील्ड को फ़ेच करना है. FriendlyFlix में, फ़िल्में दिखाने वाली स्क्रीन के लिए इन फ़ील्ड की ज़रूरत होती है: title, description, releaseYear, rating, और imageUrl. इसके अलावा, यह एक SwiftUI ऐप्लिकेशन है. इसलिए, आपको SwiftUI व्यू आइडेंटिटी से जुड़ी मदद पाने के लिए, id की ज़रूरत होगी.

VS Code में, dataconnect/connector/queries.gql फ़ाइल खोलें और ListMovies क्वेरी जोड़ें:

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

नई क्वेरी की जांच करने के लिए, चलाएं (स्थानीय) बटन पर क्लिक करें. इससे, क्वेरी को आपके स्थानीय डेटाबेस पर लागू किया जाएगा. डेटाबेस में मौजूद फ़िल्मों की सूची, Data Connect Execution टर्मिनल के नतीजे सेक्शन में दिखनी चाहिए.

ListMovies क्वेरी को ऐप्लिकेशन की होम स्क्रीन से कनेक्ट करना

आपने Data Connect एमुलेटर में क्वेरी की जांच कर ली है. अब अपने ऐप्लिकेशन में जाकर क्वेरी को कॉल किया जा सकता है.

queries.gql को सेव करने पर, Firebase Data Connect, FriendlyFlixSDK पैकेज में ListMovies क्वेरी से जुड़ा कोड जनरेट करता है.

Xcode में, Movie+DataConnect.swift खोलें. इसके बाद, ListMoviesQuery.Data.Movie से Movie पर मैप करने के लिए, यह कोड जोड़ें:

import FirebaseDataConnect
import FriendlyFlixSDK

extension Movie {
  init(from: ListMoviesQuery.Data.Movie) {
    id = from.id
    title = from.title
    description = from.description ?? ""
    releaseYear = from.releaseYear
    rating = from.rating
    imageUrl = from.imageUrl
  }
}

HomeScreen.swift फ़ाइल खोलें और नीचे दिए गए कोड स्निपेट का इस्तेमाल करके उसे अपडेट करें.

import SwiftUI
import FirebaseDataConnect
import FriendlyFlixSDK

struct HomeScreen: View {
  ...

  private var connector = DataConnect.friendlyFlixConnector
  let heroMoviesRef: QueryRefObservation<ListMoviesQuery.Data, ListMoviesQuery.Variables>

  init() {
    heroMoviesRef = connector.listMoviesQuery.ref()
  }
}

extension HomeScreen {
  ...

  private var heroMovies: [Movie] {
    heroMoviesRef.data?.movies.map(Movie.init) ?? []
  }

 private var topMovies: [Movie] {
    heroMoviesRef.data?.movies.map(Movie.init) ?? []
  }

  private var watchList: [Movie] {
    heroMoviesRef.data?.movies.map(Movie.init) ?? []
  }

  ...
}

ऐप्लिकेशन चलाना

iOS सिम्युलेटर में ऐप्लिकेशन लॉन्च करने के लिए, Xcode में चालू करें बटन पर क्लिक करें.

ऐप्लिकेशन लॉन्च होने के बाद, आपको एक स्क्रीन दिखेगी, जो कुछ इस तरह दिखेगी:

6. हीरो और टॉप फ़िल्में दिखाना

इस चरण में, आपको हीरो सेक्शन में फ़िल्मों को दिखाने के तरीके को अपडेट करना होगा. यह होम स्क्रीन पर सबसे ऊपर मौजूद प्रमुख कैरसेल होता है. साथ ही, आपको सबसे लोकप्रिय फ़िल्मों के सेक्शन में भी फ़िल्मों को दिखाने के तरीके को अपडेट करना होगा.

फ़िलहाल, ListMovies क्वेरी से सभी फ़िल्में मिलती हैं. इन सेक्शन के लिए डिसप्ले को ऑप्टिमाइज़ करने के लिए, आपको हर क्वेरी से मिलने वाली फ़िल्मों की संख्या सीमित करनी होगी. ListMovies क्वेरी के मौजूदा वर्शन में, नतीजों को सीमित करने की सुविधा पहले से मौजूद नहीं है. इस सेक्शन में, नतीजों को सीमित करने और उन्हें क्रम से लगाने की सुविधा जोड़ी जा सकती है.

ListMovies क्वेरी को बेहतर बनाना

ऑर्डर करने और सीमित करने की सुविधा जोड़ने के लिए, queries.gql खोलें और ListMovies को इस तरह अपडेट करें:

query ListMovies(
  $orderByRating: OrderDirection
  $orderByReleaseYear: OrderDirection
  $limit: Int
) @auth(level: PUBLIC) {
  movies(
    orderBy: [{ rating: $orderByRating }, { releaseYear: $orderByReleaseYear }]
    limit: $limit
  ) {
    id
    title
    description
    releaseYear
    rating
    imageUrl
  }
}

इससे, क्वेरी से मिलने वाली फ़िल्मों की संख्या को सीमित किया जा सकता है. साथ ही, रेटिंग और रिलीज़ के साल, दोनों के हिसाब से नतीजों को क्रम में लगाया जा सकता है.

इस फ़ाइल को सेव करने के बाद, Firebase Data Connect FriendlyFlixSDK के अंदर कोड को अपने-आप फिर से जनरेट कर देगा. अगले चरण में, इन अतिरिक्त सुविधाओं का इस्तेमाल करने के लिए, HomeScreen.swift में कोड अपडेट किया जा सकता है.

यूज़र इंटरफ़ेस (यूआई) में बेहतर क्वेरी का इस्तेमाल करना

HomeScreen.swift में ज़रूरी बदलाव करने के लिए, Xcode पर वापस जाएं.

सबसे हाल ही में रिलीज़ हुई तीन फ़िल्में फ़ेच करने के लिए, सबसे पहले heroMoviesRef को अपडेट करें:

struct HomeScreen {
  ...

  init() {
    heroMoviesRef = connector.listMoviesQuery
      .ref { optionalVars in
        optionalVars.limit = 3
        optionalVars.orderByReleaseYear = .DESC
      }

  }
}

इसके बाद, सबसे लोकप्रिय फ़िल्मों के लिए एक और क्वेरी रेफ़रंस सेट अप करें. साथ ही, सबसे ज़्यादा रेटिंग वाली पांच फ़िल्मों पर फ़िल्टर सेट करें:

struct HomeScreen {
  ...

  let topMoviesRef: QueryRefObservation<ListMoviesQuery.Data, ListMoviesQuery.Variables>

  init() {
    heroMoviesRef = ...

    topMoviesRef = connector.listMoviesQuery
      .ref { optionalVars in
        optionalVars.limit = 5
        optionalVars.orderByRating = .DESC
      }
  }
}

आखिर में, उस कैलकुलेट की गई प्रॉपर्टी को अपडेट करें जो इस क्वेरी के नतीजे को यूज़र इंटरफ़ेस (यूआई) से जोड़ती है:

extension HomeScreen {
  ...

  private var topMovies: [Movie] {
    topMoviesRef.data?.movies.map(Movie.init) ?? []
  }

}

इसे काम करते हुए देखें

हीरो सेक्शन में सबसे हाल ही की तीन फ़िल्में और 'सबसे लोकप्रिय फ़िल्में' सेक्शन में सबसे ज़्यादा रेटिंग वाली पांच फ़िल्में देखने के लिए, ऐप्लिकेशन को फिर से चलाएं:

7. फ़िल्म और कलाकार की जानकारी दिखाना

उपयोगकर्ता अब फ़िल्में ब्राउज़ कर सकता है. किसी फ़िल्म के कार्ड पर टैप करने पर, उन्हें फ़िल्म के बारे में कुछ जानकारी दिखेगी. हालांकि, हो सकता है कि आपको जानकारी में कुछ कमी महसूस हो!

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

फ़िल्म की जानकारी वाले पेज पर, हम फ़िल्म के बारे में ज़्यादा जानकारी दिखाना चाहते हैं. इस सेक्शन में, आपको ऐप्लिकेशन को बेहतर बनाना होगा, ताकि वह ज़्यादा जानकारी वाले पेज पर, फ़िल्म के कलाकारों और समीक्षाओं की जानकारी दिखा सके.

इसके लिए, आपको कुछ काम करने होंगे:

• फ़िल्म के कलाकारों और समीक्षाओं की जानकारी देने के लिए, स्कीमा को बेहतर बनाना
• किसी मूवी के बारे में जानकारी पाने के लिए, Firebase Data Connect क्वेरी लिखना
• फ़िल्म की जानकारी वाली स्क्रीन पर नतीजे दिखाना

स्कीमा को बेहतर बनाना

VS Code में, dataconnect/schema/schema.gql खोलें और Actor और MovieActor के लिए स्कीमा डेफ़िनिशन जोड़ें.

## Actors
## An actor can participate in multiple movies; movies can have multiple actors
## Movie - Actors (or vice versa) is a many to many relationship
type Actor @table {
  id: UUID!
  imageUrl: String!
  name: String! @col(name: "name", dataType: "varchar(30)")
}

## Join table for many-to-many relationship for movies and actors
## The 'key' param signifies the primary key(s) of this table
## In this case, the keys are [movieId, actorId], the generated fields of the reference types [movie, actor]
type MovieActor @table(key: ["movie", "actor"]) {
  ## @ref creates a field in the current table (MovieActor) that holds the primary key of the referenced type
  ## In this case, @ref(fields: "id") is implied
  movie: Movie!
  ## movieId: UUID! <- this is created by the implied @ref, see: implicit.gql

  actor: Actor!
  ## actorId: UUID! <- this is created by the implied  @ref, see: implicit.gql

  role: String! ## "main" or "supporting"
}

ऐक्टर के लिए मॉक डेटा जोड़ना

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

1. Finder में, finish/FriendlyFlix/dataconnect/moviededetails_insert.gql को start/FriendlyFlix/dataconnect फ़ोल्डर में कॉपी करें.
2. VS Code में, dataconnect/moviededetails_insert.gql खोलें.
3. पक्का करें कि Firebase Data Connect एक्सटेंशन में एमुलेटर चल रहे हों.
4. आपको फ़ाइल में सबसे ऊपर, चालू करें (लोकल) बटन दिखेगा. अपने डेटाबेस में, मूवी का मॉक डेटा डालने के लिए इस पर क्लिक करें.
5. डेटा कनेक्ट एक्सीक्यूशन टर्मिनल देखकर पुष्टि करें कि डेटा जोड़ दिया गया है.

डेटा सेट अप करने के बाद, फ़िल्म की जानकारी पाने के लिए क्वेरी तय करने के अगले चरण पर जाएं.

GetMovieById क्वेरी तय करना

VS Code में, dataconnect/connector/queries.gql फ़ाइल खोलें और GetMovieById क्वेरी जोड़ें:

## Get movie by id
query GetMovieById($id: UUID!) @auth(level: PUBLIC) {
  movie(id: $id) {
    id
    title
    imageUrl
    releaseYear
    genre
    rating
    description
    tags
    metadata: movieMetadatas_on_movie {
      director
    }
    mainActors: actors_via_MovieActor(where: { role: { eq: "main" } }) {
      id
      name
      imageUrl
    }
    supportingActors: actors_via_MovieActor(
      where: { role: { eq: "supporting" } }
    ) {
      id
      name
      imageUrl
    }
  }
}

GetMovieById क्वेरी को MovieDetailsView से कनेक्ट करना

Xcode में, MovieDetailsView.swift फ़ाइल खोलें और नीचे दिए गए कोड से मैच करने के लिए, movieDetails की कैलकुलेट की गई प्रॉपर्टी को अपडेट करें:

import NukeUI
import SwiftUI
import FirebaseDataConnect
import FriendlyFlixSDK

@MainActor
struct MovieDetailsView: View {
  private var movie: Movie

  private var movieDetails: MovieDetails? {
    DataConnect.friendlyFlixConnector
      .getMovieByIdQuery
      .ref(id: movie.id)
      .data?.movie.map { movieDetails in
        MovieDetails(
          title: movieDetails.title,
          description: movieDetails.description ?? "",
          releaseYear: movieDetails.releaseYear,
          rating: movieDetails.rating ?? 0,
          imageUrl: movieDetails.imageUrl,
          mainActors: movieDetails.mainActors.map { mainActor in
            MovieActor(id: mainActor.id,
                       name: mainActor.name,
                       imageUrl: mainActor.imageUrl)
          },
          supportingActors: movieDetails.supportingActors.map{ supportingActor in
            MovieActor(id: supportingActor.id,
                       name: supportingActor.name,
                       imageUrl: supportingActor.imageUrl)
          },
          reviews: []
        )
      }
  }

  public init(movie: Movie) {
    self.movie = movie
  }
}

ऐप्लिकेशन चलाना

iOS सिम्युलेटर पर ऐप्लिकेशन लॉन्च करने के लिए, Xcode में चालू करें बटन पर क्लिक करें.

ऐप्लिकेशन लॉन्च होने के बाद, फ़िल्म की जानकारी देखने के लिए, फ़िल्म के कार्ड पर टैप करें. यह कुछ ऐसा दिखेगा:

8. उपयोगकर्ता की पुष्टि करने की सुविधा लागू करना

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

वॉचलिस्ट की सुविधा लागू करने से पहले, आपको उपयोगकर्ता की पहचान की पुष्टि करनी होगी. इसे चालू करने के लिए, आपको Firebase Authentication को इंटिग्रेट करना होगा. इससे, उपयोगकर्ता ऐप्लिकेशन में साइन इन कर पाएंगे.

हो सकता है कि आपने होम स्क्रीन पर सबसे ऊपर दाईं ओर, उपयोगकर्ता अवतार बटन को पहले ही देख लिया हो. इस पर टैप करने पर, आपको एक स्क्रीन पर ले जाया जाएगा. यहां उपयोगकर्ता अपने ईमेल पते और पासवर्ड का इस्तेमाल करके साइन अप या साइन इन कर सकते हैं.

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

Firebase Authentication की सुविधा चालू करना

अपने प्रोजेक्ट के Firebase कंसोल में, पुष्टि करने वाले सेक्शन पर जाएं और Firebase Authentication को चालू करें. इसके बाद, ईमेल/पासवर्ड की पुष्टि करने की सुविधा देने वाली सेवा चालू करें.

अपने लोकल प्रोजेक्ट फ़ोल्डर में, firebase.json ढूंढें और Firebase Authentication एमुलेटर को चालू करने के लिए, इसे यहां बताए गए तरीके से अपडेट करें.

{
  "emulators": {
    "dataconnect": {
    },
    "auth": {
    }
  },
  "dataconnect": {
    "source": "dataconnect"
  }
}

इसके बाद, बदलाव लागू करने के लिए, आपको Firebase एमुलेटर को बंद करके फिर से चालू करना होगा.

पुष्टि करने वाला हैंडलर लागू करना

अगले सेक्शन में, आपको वह लॉजिक लागू करना होगा जो उपयोगकर्ता की पुष्टि को आपके डेटाबेस से जोड़ता है. इसके लिए, आपको एक ऑथेंटिकेशन हैंडलर बनाना होगा, जो साइन इन करने की प्रक्रिया पूरी होने पर सूचना देता है.

उपयोगकर्ता की पुष्टि होने के बाद, यह हैंडलर आपके डेटाबेस में उसके खाते को अपने-आप बना देगा.

Xcode में, AuthenticationService.swift फ़ाइल खोलें और यह कोड जोड़ें:

import Foundation
import Observation
import os
import FirebaseAuth

enum AuthenticationState {
  case unauthenticated
  case authenticating
  case authenticated
}

@Observable
class AuthenticationService {
  private let logger = Logger(subsystem: "FriendlyFlix", category: "auth")

  var presentingAuthenticationDialog = false
  var presentingAccountDialog = false

  var authenticationState: AuthenticationState = .unauthenticated
  var user: User?
  private var authenticationListener: AuthStateDidChangeListenerHandle?

  init() {
    authenticationListener = Auth.auth().addStateDidChangeListener { auth, user in
      if let user {
        self.authenticationState = .authenticated
        self.user = user
      } else {
        self.authenticationState = .unauthenticated
      }
    }
  }

  private var onSignUp: ((User) -> Void)?
  public func onSignUp(_ action: @escaping (User) -> Void) {
    onSignUp = action
  }

  func signInWithEmailPassword(email: String, password: String) async throws {
    try await Auth.auth().signIn(withEmail: email, password: password)
    authenticationState = .authenticated
  }

  func signUpWithEmailPassword(email: String, password: String) async throws {
    try await Auth.auth().createUser(withEmail: email, password: password)

    if let onSignUp, let user = Auth.auth().currentUser {
      logger
        .debug(
          "User signed in \(user.displayName ?? "(no fullname)") with email \(user.email ?? "(no email)")"
        )
      onSignUp(user)
    }

    authenticationState = .authenticated
  }

  func signOut() throws {
    try Auth.auth().signOut()
    authenticationState = .unauthenticated
  }
}

यह पुष्टि करने का एक सामान्य हैंडलर है. इसकी मदद से, onSignUp का इस्तेमाल करके क्लोज़र रजिस्टर किया जा सकता है. यह क्लोज़र, उपयोगकर्ता के साइन इन करने पर कॉल किया जाएगा.

इसके बाद, उस क्लोज़र में डेटाबेस में नया उपयोगकर्ता खाता बनाया जा सकता है. हालांकि, ऐसा करने से पहले, आपको एक म्यूटेशन बनाना होगा. इससे, डेटाबेस में नए उपयोगकर्ता बनाए जा सकते हैं या मौजूदा उपयोगकर्ताओं को अपडेट किया जा सकता है.

स्कीमा में उपयोगकर्ता इकाई जोड़ना

User टाइप से उपयोगकर्ता इकाई के बारे में पता चलता है. उपयोगकर्ता, फ़िल्मों के बारे में समीक्षाएं देकर या उन्हें पसंदीदा के तौर पर जोड़कर, उनसे इंटरैक्ट कर सकते हैं.

VS Code में, dataconnect/schema/schema.gql फ़ाइल खोलें और यहां दी गई User टेबल डेफ़िनिशन जोड़ें:

## Users
## A user can leave reviews for movies
## user-reviews is a one to many relationship, movie-reviews is a one to many relationship, movie:user is a many to many relationship
type User @table {
  id: String! @col(name: "user_auth")
  username: String! @col(name: "username", dataType: "varchar(50)")
}

उपयोगकर्ता को जोड़ने या अपडेट करने के लिए म्यूटेशन तय करना

VS Code में, dataconnect/connector/mutations.gql फ़ाइल खोलें और UpsertUser म्यूटेशन जोड़ें:

mutation UpsertUser($username: String!) @auth(level: USER) {
  user_upsert(
    data: {
      id_expr: "auth.uid"
      username: $username
    }
  )
}

लॉग इन करने के बाद नया उपयोगकर्ता बनाना

Xcode में, FriendlyFlixApp.swift खोलें और इनिशियलाइज़र में यह कोड जोड़ें:

@main
struct FriendlyFlixApp: App {

  ...

  init() {
    ...
    authenticationService = AuthenticationService()
    authenticationService?.onSignUp { user in
      let userName = String(user.email?.split(separator: "@").first ?? "(unknown)")
      Task {
        try await DataConnect.friendlyFlixConnector
          .upsertUserMutation.execute(username: userName)
      }
    }
  }

  var body: some Scene {
    ...
  }
}

जब भी कोई उपयोगकर्ता Firebase Authentication का इस्तेमाल करके साइन अप करता है, तो यह कोड आपके लिए जनरेट किए गए upsertUserMutation Firebase Data Connect का इस्तेमाल करके, नया उपयोगकर्ता जोड़ता है या मौजूदा उपयोगकर्ता को उसी आईडी से अपडेट करता है.

इसे काम करते हुए देखें

यह पुष्टि करने के लिए कि यह सुविधा काम करती है या नहीं, पहले iOS ऐप्लिकेशन में साइन अप करें:

• अगर आपने ऐसा नहीं किया है, तो Firebase एमुलेटर को बंद करके फिर से चालू करें. इससे यह पक्का किया जा सकेगा कि Firebase Authentication एमुलेटर चल रहा है.
• iOS सिम्युलेटर पर ऐप्लिकेशन लॉन्च करने के लिए, Xcode में चालू करें बटन पर क्लिक करें.
• स्क्रीन पर सबसे ऊपर दाएं कोने में मौजूद, अवतार आइकॉन पर क्लिक करें.
• साइन अप फ़्लो पर स्विच करें और ऐप्लिकेशन में साइन अप करें.

इसके बाद, डेटाबेस से क्वेरी करके पुष्टि करें कि ऐप्लिकेशन ने उपयोगकर्ता के लिए नया उपयोगकर्ता खाता बनाया है या नहीं:

• VS Code में, dataconnect/schema/schema.gql खोलें और User इकाई पर डेटा पढ़ें पर क्लिक करें
• इससे User_read.gql नाम की एक नई क्वेरी फ़ाइल बन जाएगी
• उपयोगकर्ता टेबल में सभी उपयोगकर्ताओं को देखने के लिए, लोकल स्टोरेज में चलाएं पर क्लिक करें
• डेटा कनेक्ट करने की प्रोसेस वाले पैनल में, आपको उस उपयोगकर्ता का खाता दिखेगा जिसके लिए आपने अभी-अभी से साइन अप किया है

9. पसंदीदा फ़िल्में मैनेज करना

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

पसंदीदा आइटम को जोड़ने के लिए स्कीमा को बेहतर बनाना

FavoriteMovie टाइप एक जॉइन टेबल है, जो उपयोगकर्ताओं और उनकी पसंदीदा फ़िल्मों के बीच कई-से-कई रिलेशनशिप को मैनेज करती है. हर टेबल, User को Movie से लिंक करती है.

कोड स्निपेट को कॉपी करके अपनी dataconnect/schema/schema.gql फ़ाइल में चिपकाएं:

type FavoriteMovie
  @table(name: "FavoriteMovies", singular: "favorite_movie", plural: "favorite_movies", key: ["user", "movie"]) {
  ## @ref is implicit
  user: User!
  movie: Movie!
}

पसंदीदा जोड़ने और हटाने के लिए म्यूटेशन तय करना

ऐप्लिकेशन, उपयोगकर्ता की पसंदीदा फ़िल्में दिखाने से पहले, उपयोगकर्ता को यह बताना होगा कि उसकी पसंदीदा फ़िल्में कौनसी हैं. ऐसा करने के लिए, आपको पहले दो म्यूटेशन जोड़ने होंगे. पहला, किसी मूवी को उपयोगकर्ता के पसंदीदा के तौर पर मार्क करने के लिए और दूसरा, उसे पसंदीदा से हटाने के लिए.

1. VS Code में, dataconnect/connector/mutations.gql में mutations.gql खोलें
2. पसंदीदा फ़िल्मों को मैनेज करने के लिए, ये म्यूटेशन जोड़ें:

## Add a movie to the user's favorites list
mutation AddFavoritedMovie($movieId: UUID!) @auth(level: USER) {
  favorite_movie_upsert(data: { userId_expr: "auth.uid", movieId: $movieId })
}

## Remove a movie from the user's favorites list
mutation DeleteFavoritedMovie($movieId: UUID!) @auth(level: USER) {
  favorite_movie_delete(key: { userId_expr: "auth.uid", movieId: $movieId })
}

म्यूटेशन को अपने ऐप्लिकेशन के यूज़र इंटरफ़ेस (यूआई) से कनेक्ट करना

उपयोगकर्ता, फ़िल्म की जानकारी वाली स्क्रीन पर दिल के आइकॉन पर क्लिक करके, फ़िल्म को पसंदीदा के तौर पर मार्क कर सकते हैं.

अभी-अभी बनाए गए म्यूटेशन को ऐप्लिकेशन के यूज़र इंटरफ़ेस (यूआई) से कनेक्ट करने के लिए, MovieCardView में ये बदलाव करें:

1. FriendlyFlixSDK इंपोर्ट करना और कनेक्टर सेट अप करना

import NukeUI
import os
import SwiftUI
import FirebaseDataConnect
import FriendlyFlixSDK

struct MovieCardView: View {
  private let logger = Logger(subsystem: "FriendlyFlix", category: "moviecard")
  @Environment(\.dismiss) private var dismiss
  private var connector = DataConnect.friendlyFlixConnector

  ...
}

2. toggleFavourite वाला तरीका लागू करें. जब भी उपयोगकर्ता MovieCardView में मौजूद दिल के आइकॉन पर टैप करेगा, तब यह फ़ंक्शन कॉल होगा:

struct MovieCardView {

  ...

  private func toggleFavourite() {
    Task {
      if isFavourite {
        let _ = try await connector.deleteFavoritedMovieMutation.execute(movieId: movie.id)
      } else {
        let _ = try await connector.addFavoritedMovieMutation.execute(movieId: movie.id)
      }
    }
  }
}

इससे, डेटाबेस में मौजूद मौजूदा फ़िल्म के 'पसंदीदा' स्टेटस को अपडेट कर दिया जाएगा. आखिरी चरण में, यह पक्का करना है कि यूज़र इंटरफ़ेस (यूआई) की स्थिति उसी हिसाब से दिख रही हो.

किसी फ़िल्म को 'पसंदीदा' के तौर पर मार्क किया गया है या नहीं, यह पता लगाने के लिए क्वेरी तय करना

1. VS Code में, dataconnect/connector में queries.gql खोलें.
2. किसी फ़िल्म को पसंदीदा के तौर पर मार्क किया गया है या नहीं, यह देखने के लिए यह क्वेरी जोड़ें:

query GetIfFavoritedMovie($movieId: UUID!) @auth(level: USER) {
  favorite_movie(key: { userId_expr: "auth.uid", movieId: $movieId }) {
    movieId
  }
}

3. Xcode में, GetIfFavoritedMovie क्वेरी का रेफ़रंस इंस्टैंशिएट करें और कैलकुलेट की गई प्रॉपर्टी लागू करें. इससे यह तय होता है कि इस MovieCardView पर दिखाई गई फ़िल्म को मौजूदा उपयोगकर्ता के लिए पसंदीदा के तौर पर मार्क किया गया है या नहीं.

struct MovieCardView: View {

  ...

  public init(showDetails: Bool, movie: Movie) {
    self.showDetails = showDetails
    self.movie = movie

    isFavouriteRef = connector.getIfFavoritedMovieQuery.ref(movieId: movie.id)
  }

  // MARK: - Favourite handling

  private let isFavouriteRef: QueryRefObservation<
    GetIfFavoritedMovieQuery.Data,
    GetIfFavoritedMovieQuery.Variables
  >
  private var isFavourite: Bool {
    isFavouriteRef.data?.favorite_movie?.movieId != nil
  }

  ...

}

4. जब भी उपयोगकर्ता बटन पर टैप करता है, तब क्वेरी को लागू करने के लिए toggleFavourite में कोड अपडेट करें. इससे यह पक्का होता है कि isFavourite कैलकुलेट की गई प्रॉपर्टी हमेशा सही वैल्यू दिखाती है.

  private func toggleFavourite() {
    Task {
      if isFavourite {
        ...
      }

      let _ = try await isFavouriteRef.execute()
    }
  }

पसंदीदा फ़िल्में फ़ेच करना

इस सुविधा के आखिरी चरण में, आपको उपयोगकर्ता की पसंदीदा मूवी फ़ेच करने की सुविधा लागू करनी होगी, ताकि वे उन्हें अपनी वॉचलिस्ट में देख सकें.

1. VS Code में, dataconnect/connector/queries.gql में queries.gql खोलें और यहां दी गई क्वेरी चिपकाएं:

## Get favorite movies by user ID
query GetUserFavoriteMovies @auth(level: USER) {
  user(id_expr: "auth.uid") {
    favoriteMovies: favorite_movies_on_user {
      movie {
        id
        title
        genre
        imageUrl
        releaseYear
        rating
        description
      }
    }
  }
}

LibraryScreen पर, उपयोगकर्ता की पसंदीदा फ़िल्मों की सूची दिखती है. यह स्क्रीन सिर्फ़ तब डेटा दिखाएगी, जब उपयोगकर्ता ने साइन इन किया हो. इसलिए, आपको पहले स्क्रीन की पुष्टि करने की स्थिति को ऐप्लिकेशन के AuthenticationService से कनेक्ट करना होगा.

2. FavoriteMovieFavoriteMovies से Movie से Movie+DataConnect.swift तक मैप करने के लिए कोड जोड़ें:

import FirebaseDataConnect
import FriendlyFlixSDK

extension Movie {

  ...

  init(from: GetUserFavoriteMoviesQuery.Data.User.FavoriteMovieFavoriteMovies) {
    id = from.movie.id
    title = from.movie.title
    description = from.movie.description ?? ""
    releaseYear = from.movie.releaseYear
    rating = from.movie.rating
    imageUrl = from.movie.imageUrl
  }
}

3. Xcode में, LibraryScreen खोलें. इसके बाद, isSignedIn को इस तरह अपडेट करें:

struct LibraryScreen: View {
  ...

  private var isSignedIn: Bool {
    authenticationService.user != nil
  }

}

4. इसके बाद, Firebase Data Connect और FriendlyFlixSDK इंपोर्ट करें. साथ ही, GetUserFavoriteMovies क्वेरी का रेफ़रंस पाएं:

import SwiftUI
import FirebaseDataConnect
import FriendlyFlixSDK

struct LibraryScreen {

 ...

  private var connector = DataConnect.friendlyFlixConnector

  ...

  init() {
    watchListRef = connector.getUserFavoriteMoviesQuery.ref()
  }

  private let watchListRef: QueryRefObservation<
    GetUserFavoriteMoviesQuery.Data,
    GetUserFavoriteMoviesQuery.Variables
  >
  private var watchList: [Movie] {
    watchListRef.data?.user?.favoriteMovies.map(Movie.init) ?? []
  }

  ...

}

5. पक्का करें कि व्यू दिखने पर watchListRef क्वेरी लागू हो:

extension LibraryScreen: View {
  var body: some View {
    ...
            MovieListSection(namespace: namespace, title: "Watch List", movies: watchList)
              .onAppear {
                Task {
                  try await watchListRef.execute()
                }
  ...

इसे काम करते हुए देखें

अब ऐप्लिकेशन को चलाकर, पसंदीदा आइटम की सुविधा आज़माएं. इन बातों का ध्यान रखें:

• पक्का करें कि Firebase एमुलेटर चल रहा हो
• पक्का करें कि आपने फ़िल्मों और फ़िल्म की जानकारी के लिए मॉक डेटा जोड़ा हो
• पक्का करें कि आपने उपयोगकर्ता के तौर पर साइन अप किया हो

1. iOS सिम्युलेटर पर ऐप्लिकेशन लॉन्च करने के लिए, Xcode में चालू करें बटन पर क्लिक करें.
2. ऐप्लिकेशन लॉन्च होने के बाद, फ़िल्म की जानकारी देखने के लिए, फ़िल्म के कार्ड पर टैप करें.
3. मूवी को पसंदीदा के तौर पर मार्क करने के लिए, दिल के आइकॉन पर टैप करें. दिल का निशान भर जाएगा.
4. कुछ और मूवी के लिए भी ऐसा करें.
5. लाइब्रेरी टैब पर जाएं. अब आपको उन सभी फ़िल्मों की सूची दिखेगी जिन्हें आपने पसंदीदा के तौर पर मार्क किया है.

10. बधाई

बधाई हो, आपने iOS ऐप्लिकेशन में Firebase Data Connect को जोड़ दिया है! अब आपको Data Connect को सेट अप करने, क्वेरी और म्यूटेशन बनाने, और उपयोगकर्ता की पुष्टि करने के लिए ज़रूरी चरणों के बारे में पता है.

ज़रूरी नहीं: प्रोडक्शन में डिप्लॉय करना

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

11. (ज़रूरी नहीं) अपना ऐप्लिकेशन डिप्लॉय करना

फ़िलहाल, यह ऐप्लिकेशन पूरी तरह से लोकल है. इसका सारा डेटा, Firebase Emulator Suite में मौजूद होता है. इस सेक्शन में, आपको अपने Firebase प्रोजेक्ट को कॉन्फ़िगर करने का तरीका पता चलेगा, ताकि यह ऐप्लिकेशन प्रोडक्शन में काम कर सके.

Firebase Authentication की सुविधा चालू करना

1. Firebase कंसोल में, पुष्टि सेक्शन पर जाएं और शुरू करें पर क्लिक करें.
2. साइन इन करने का तरीका टैब पर जाएं .
3. नेटिव प्रोवाइडर सेक्शन में जाकर, ईमेल/पासवर्ड विकल्प चुनें,
4. ईमेल/पासवर्ड की जानकारी देने वाली सेवा को चालू करें. इसके बाद, सेव करें पर क्लिक करें.

Firebase Data Connect चालू करना

अहम जानकारी: अगर आपने अपने प्रोजेक्ट में पहली बार स्कीमा डिप्लॉय किया है, तो इस प्रोसेस से Cloud SQL PostgreSQL इंस्टेंस बन जाएगा. इसमें करीब 15 मिनट लग सकते हैं. जब तक Cloud SQL इंस्टेंस तैयार नहीं हो जाता और उसे Firebase Data Connect के साथ इंटिग्रेट नहीं किया जाता, तब तक उसे डिप्लॉय नहीं किया जा सकता.

1. Firebase Data Connect VS Code एक्सटेंशन के यूज़र इंटरफ़ेस (यूआई) में, प्रोडक्शन में डिप्लॉय करें पर क्लिक करें. 2. आपको स्कीमा में किए गए बदलावों की समीक्षा करनी होगी और नुकसान पहुंचाने वाले बदलावों को स्वीकार करना होगा. आपसे कहा जाएगा कि: - firebase dataconnect:sql:diff का इस्तेमाल करके, स्कीमा में किए गए बदलावों की समीक्षा करें - जब आप बदलावों से संतुष्ट हों, तो firebase dataconnect:sql:migrate से शुरू किए गए फ़्लो का इस्तेमाल करके उन्हें लागू करें

'PostgreSQL के लिए Cloud SQL' इंस्टेंस को, डिप्लॉय किए गए आखिरी स्कीमा और डेटा के साथ अपडेट कर दिया जाएगा. Firebase कंसोल में जाकर, इस प्रोसेस की स्थिति देखी जा सकती है.

अब प्रोडक्शन एनवायरमेंट में डेटा जोड़ने के लिए, Firebase Data Connect पैनल में 'चालू करें (प्रोडक्शन)' पर क्लिक करें. ठीक उसी तरह जैसे आपने लोकल एमुलेटर के साथ किया था.

iOS ऐप्लिकेशन को फिर से चलाने से पहले, पक्का करें कि वह आपके प्रोजेक्ट के प्रोडक्शन इंस्टेंस से कनेक्ट हो:

1. प्रॉडक्ट > स्कीम > स्कीम में बदलाव करें... मेन्यू खोलें.
2. रन सेक्शन में, -useEmulator YES लॉन्च आर्ग्युमेंट से सही का निशान हटाएं.