इस पेज का अनुवाद Cloud Translation API से किया गया है.

फ़ुलस्टैक मूवी के सुझाव देने वाला सिस्टम बनाना

1. शुरू करने से पहले

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

इस कोडलैब में, आपको फ़ुल स्टैक का सुझाव देने वाला टूल बनाने का तरीका बताया गया है. इसके लिए, इनका इस्तेमाल किया जा सकता है:

TensorFlow के सुझाव देने वाली कंपनियों का इस्तेमाल करके, फ़िल्म के सुझाव देने के लिए, डेटा वापस पाने और रैंकिंग मॉडल को ट्रेनिंग दी जाती है
मॉडल को सेवा देने के लिए TensorFlow की सेवा
Flutter का इस्तेमाल करके सुझाई गई फ़िल्में देखने के लिए, क्रॉस-प्लैटफ़ॉर्म ऐप्लिकेशन बनाएं

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

Dart के साथ Flutter के विकास की बुनियादी जानकारी
TensorFlow की मदद से मशीन लर्निंग की बुनियादी जानकारी, जैसे कि ट्रेनिंग बनाम डिप्लॉयमेंट
सुझाव देने वाले सिस्टम के बारे में बुनियादी जानकारी
Python, टर्मिनल, और Docker की बुनियादी जानकारी

आप इन चीज़ों के बारे में जानेंगे

TensorFlow के सुझाव देने वाले ऐप्लिकेशन का इस्तेमाल करके, डेटा वापस पाने और रैंकिंग मॉडल को ट्रेनिंग देने का तरीका
TensorFlow Serving का इस्तेमाल करके, ट्रेन किए गए सुझाव मॉडल को इस्तेमाल करने का तरीका
सुझाए गए आइटम दिखाने के लिए, क्रॉस-प्लैटफ़ॉर्म Flutter ऐप्लिकेशन बनाने का तरीका

आपको इनकी ज़रूरत होगी

Flutter का SDK टूल
Flutter के लिए Android और iOS सेटअप
Flutter के लिए डेस्कटॉप सेटअप
Flutter के लिए वेब सेटअप
Flutter और Dart के लिए विज़ुअल स्टूडियो कोड (वीएस कोड) का सेटअप
डॉकर
बैश
Python 3.7 और उसके बाद के वर्शन
Colab का ऐक्सेस

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

Flutter डेवलपमेंट के लिए आपको इस कोडलैब को पूरा करने के लिए दो सॉफ़्टवेयर की ज़रूरत होगी—Flutter SDK टूल और एडिटर.

इनमें से किसी भी डिवाइस का इस्तेमाल करके, कोडलैब के फ़्रंटएंड को चलाया जा सकता है:

iOS सिम्युलेटर (Xcode टूल इंस्टॉल करना ज़रूरी है).
Android Emulator (Android Studio में सेटअप करना ज़रूरी है).
ब्राउज़र (डीबग करने के लिए Chrome ज़रूरी है).
Windows, Linux या macOS डेस्कटॉप ऐप्लिकेशन के तौर पर. आपको उस प्लैटफ़ॉर्म पर गेम बनाना होगा जहां आपको इसे डिप्लॉय करना है. इसलिए, अगर आपको Windows डेस्कटॉप ऐप्लिकेशन डेवलप करना है, तो आपको सही बिल्ड चेन ऐक्सेस करने के लिए Windows पर डेवलप करना होगा. ऑपरेटिंग सिस्टम से जुड़ी कुछ खास शर्तें हैं, जिनके बारे में docs.flutter.dev/desktop पर जानकारी दी गई है.

बैकएंड के लिए, आपको इनकी ज़रूरत होगी:

Linux मशीन या Intel आधारित Mac.

3. सेट अप करें

इस कोडलैब का कोड डाउनलोड करने के लिए:

इस कोडलैब के लिए, GitHub रिपॉज़िटरी पर जाएं.
कोड > पर क्लिक करें इस कोडलैब के लिए सभी कोड डाउनलोड करने के लिए, पिन कोड डाउनलोड करें.

डाउनलोड की गई ZIP फ़ाइल को अनज़िप करके, codelabs-main रूट फ़ोल्डर को अपनी ज़रूरत के सभी संसाधनों के साथ अनपैक करें.

इस कोडलैब के लिए, आपको रिपॉज़िटरी की tfrs-flutter/ सबडायरेक्ट्री में मौजूद फ़ाइलों की ज़रूरत होगी. सबडायरेक्ट्री में एक से ज़्यादा फ़ोल्डर होते हैं:

step0 से step5 फ़ोल्डर में वह स्टार्टर कोड होता है जिसे आपने इस कोडलैब के हर चरण के लिए बनाया है.
finished फ़ोल्डर में, तैयार हो चुके सैंपल ऐप्लिकेशन का पूरा कोड शामिल होता है.
हर फ़ोल्डर में एक backend सब-फ़ोल्डर होता है, जिसमें सुझाव इंजन का बैकएंड कोड और frontend सब-फ़ोल्डर होता है. इस सब-फ़ोल्डर में Flutter फ़्रंटएंड कोड भी शामिल होता है

4. प्रोजेक्ट के लिए डिपेंडेंसी डाउनलोड करें

बैकएंड

हम अपना बैकएंड बनाने के लिए, Flask का इस्तेमाल करेंगे. अपना टर्मिनल खोलें और इन्हें चलाएं:

pip install Flask flask-cors requests numpy

फ़्रंटएंड

बनाम कोड में, फ़ाइल > फ़ोल्डर खोलें और फिर उस सोर्स कोड से step0 फ़ोल्डर चुनें जिसे आपने पहले डाउनलोड किया था.
step0/frontend/lib/main.dart फ़ाइल खोलें. अगर आपको 'VS कोड' डायलॉग दिखता है, जिसमें आपसे स्टार्टर ऐप्लिकेशन के लिए ज़रूरी पैकेज डाउनलोड करने के लिए कहा जाता है, तो पैकेज पाएं पर क्लिक करें.
अगर आपको यह डायलॉग नहीं दिखता है, तो अपना टर्मिनल खोलें. इसके बाद, step0/frontend फ़ोल्डर में flutter pub get कमांड चलाएं.

5. चरण 0: स्टार्टर ऐप्लिकेशन चलाएं

step0/frontend/lib/main.dart फ़ाइल को बनाम कोड में खोलें. पक्का करें कि Android Emulator या iOS Simulator सही तरीके से सेट अप किया गया है और वह स्टेटस बार में दिखता है.

उदाहरण के लिए, Android Emulator के साथ Pixel 5 का इस्तेमाल करने पर आपको यह दिखता है:

iOS सिम्युलेटर के साथ iPhone 13 का इस्तेमाल करने पर आपको यह दिखता है:

डीबग करना शुरू करें पर क्लिक करें.

ऐप्लिकेशन चलाएं और उसे एक्सप्लोर करें

ऐप्लिकेशन आपके Android Emulator या iOS Simulator पर लॉन्च होना चाहिए. इसका यूज़र इंटरफ़ेस (यूआई) काफ़ी आसान है. इसमें एक टेक्स्ट फ़ील्ड होता है, जिसकी मदद से उपयोगकर्ता, टेक्स्ट में यूज़र आईडी के तौर पर टाइप कर सकता है. Flutter ऐप्लिकेशन, बैकएंड को क्वेरी का अनुरोध भेजेगा. यह बैकएंड, सुझावों के दो मॉडल चलाता है और फ़िल्मों के सुझावों की रैंक वाली सूची दिखाता है. जवाब मिलने के बाद, फ़्रंटएंड, यूज़र इंटरफ़ेस (यूआई) में नतीजे दिखाएगा.

अगर आपने अभी सुझाव दें पर क्लिक किया है, तो कुछ नहीं होगा, क्योंकि ऐप्लिकेशन अभी बैकएंड के साथ काम नहीं कर सकता.

6. पहला चरण: सुझाव इंजन के लिए, डेटा वापस पाने और रैंकिंग मॉडल बनाने का तरीका

असल दुनिया के सुझाव इंजन अक्सर कई चरणों से बने होते हैं:

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

इस कोडलैब के लिए, लोकप्रिय MovieLens डेटासेट का इस्तेमाल करके वापस पाने वाले मॉडल और रैंकिंग मॉडल को ट्रेनिंग दी जाती है. यहां दिया गया ट्रेनिंग कोड, Colab के ज़रिए खोला जा सकता है. इसके बाद, यहां दिए गए निर्देशों का पालन करें:

ध्यान दें: ट्रेनिंग कोड, TensorFlow के सुझाव देने वाले प्रोग्राम के बुनियादी तौर पर उपलब्ध होने और बुनियादी रैंकिंग के ट्यूटोरियल से लिया गया है. ज़्यादा जानकारी के लिए, कृपया ट्यूटोरियल देखें. इसके अलावा, डेटा वापस पाने का बेसिक मॉडल बनाने का वीडियो और बुनियादी रैंकिंग मॉडल बनाने के लिए दिया गया वीडियो भी काम का है.

7. दूसरा चरण: सुझाव इंजन बैकएंड बनाना

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

TensorFlow की सेवा शुरू करें

आपको फ़िल्मों की सुझाई गई सूची जनरेट करने के लिए, डेटा वापस पाने और रैंकिंग, दोनों मॉडल इस्तेमाल करने होते हैं. इसलिए, TensorFlow की सेवा इस्तेमाल करके, इन दोनों को एक साथ डिप्लॉय किया जा सकता है.

अपने टर्मिनल में, कंप्यूटर पर step2/backend फ़ोल्डर में जाएं और Docker की मदद से TensorFlow की सेवा देना शुरू करें:

docker run -t --rm -p 8501:8501 -p 8500:8500 -v "$(pwd)/:/models/" tensorflow/serving --model_config_file=/models/models.config

Docker, पहले TensorFlow Serving इमेज को अपने-आप डाउनलोड करता है. इसमें एक मिनट लगता है. इसके बाद, TensorFlow की सेवा शुरू हो जाएगी. लॉग इस कोड स्निपेट की तरह दिखना चाहिए:

2022-04-24 09:32:06.461702: I tensorflow_serving/model_servers/server_core.cc:465] Adding/updating models.
2022-04-24 09:32:06.461843: I tensorflow_serving/model_servers/server_core.cc:591]  (Re-)adding model: retrieval
2022-04-24 09:32:06.461907: I tensorflow_serving/model_servers/server_core.cc:591]  (Re-)adding model: ranking
2022-04-24 09:32:06.576920: I tensorflow_serving/core/basic_manager.cc:740] Successfully reserved resources to load servable {name: retrieval version: 123}
2022-04-24 09:32:06.576993: I tensorflow_serving/core/loader_harness.cc:66] Approving load for servable version {name: retrieval version: 123}
2022-04-24 09:32:06.577011: I tensorflow_serving/core/loader_harness.cc:74] Loading servable version {name: retrieval version: 123}
2022-04-24 09:32:06.577848: I external/org_tensorflow/tensorflow/cc/saved_model/reader.cc:38] Reading SavedModel from: /models/retrieval/exported-retrieval/123
2022-04-24 09:32:06.583809: I external/org_tensorflow/tensorflow/cc/saved_model/reader.cc:90] Reading meta graph with tags { serve }
2022-04-24 09:32:06.583879: I external/org_tensorflow/tensorflow/cc/saved_model/reader.cc:132] Reading SavedModel debug info (if present) from: /models/retrieval/exported-retrieval/123
2022-04-24 09:32:06.584970: I external/org_tensorflow/tensorflow/core/platform/cpu_feature_guard.cc:142] This TensorFlow binary is optimized with oneAPI Deep Neural Network Library (oneDNN) to use the following CPU instructions in performance-critical operations:  AVX2 FMA
To enable them in other operations, rebuild TensorFlow with the appropriate compiler flags.
2022-04-24 09:32:06.629900: I external/org_tensorflow/tensorflow/cc/saved_model/loader.cc:206] Restoring SavedModel bundle.
2022-04-24 09:32:06.634662: I external/org_tensorflow/tensorflow/core/platform/profile_utils/cpu_utils.cc:114] CPU Frequency: 2800000000 Hz
2022-04-24 09:32:06.672534: I external/org_tensorflow/tensorflow/cc/saved_model/loader.cc:190] Running initialization op on SavedModel bundle at path: /models/retrieval/exported-retrieval/123
2022-04-24 09:32:06.673629: I tensorflow_serving/core/basic_manager.cc:740] Successfully reserved resources to load servable {name: ranking version: 123}
2022-04-24 09:32:06.673765: I tensorflow_serving/core/loader_harness.cc:66] Approving load for servable version {name: ranking version: 123}
2022-04-24 09:32:06.673786: I tensorflow_serving/core/loader_harness.cc:74] Loading servable version {name: ranking version: 123}
2022-04-24 09:32:06.674731: I external/org_tensorflow/tensorflow/cc/saved_model/reader.cc:38] Reading SavedModel from: /models/ranking/exported-ranking/123
2022-04-24 09:32:06.683557: I external/org_tensorflow/tensorflow/cc/saved_model/reader.cc:90] Reading meta graph with tags { serve }
2022-04-24 09:32:06.683601: I external/org_tensorflow/tensorflow/cc/saved_model/reader.cc:132] Reading SavedModel debug info (if present) from: /models/ranking/exported-ranking/123
2022-04-24 09:32:06.688665: I external/org_tensorflow/tensorflow/cc/saved_model/loader.cc:277] SavedModel load for tags { serve }; Status: success: OK. Took 110815 microseconds.
2022-04-24 09:32:06.690019: I tensorflow_serving/servables/tensorflow/saved_model_warmup_util.cc:59] No warmup data file found at /models/retrieval/exported-retrieval/123/assets.extra/tf_serving_warmup_requests
2022-04-24 09:32:06.693025: I tensorflow_serving/core/loader_harness.cc:87] Successfully loaded servable version {name: retrieval version: 123}
2022-04-24 09:32:06.702594: I external/org_tensorflow/tensorflow/cc/saved_model/loader.cc:206] Restoring SavedModel bundle.
2022-04-24 09:32:06.745361: I external/org_tensorflow/tensorflow/cc/saved_model/loader.cc:190] Running initialization op on SavedModel bundle at path: /models/ranking/exported-ranking/123
2022-04-24 09:32:06.772363: I external/org_tensorflow/tensorflow/cc/saved_model/loader.cc:277] SavedModel load for tags { serve }; Status: success: OK. Took 97633 microseconds.
2022-04-24 09:32:06.774853: I tensorflow_serving/servables/tensorflow/saved_model_warmup_util.cc:59] No warmup data file found at /models/ranking/exported-ranking/123/assets.extra/tf_serving_warmup_requests
2022-04-24 09:32:06.777706: I tensorflow_serving/core/loader_harness.cc:87] Successfully loaded servable version {name: ranking version: 123}
2022-04-24 09:32:06.778969: I tensorflow_serving/model_servers/server_core.cc:486] Finished adding/updating models
2022-04-24 09:32:06.779030: I tensorflow_serving/model_servers/server.cc:367] Profiler service is enabled
2022-04-24 09:32:06.784217: I tensorflow_serving/model_servers/server.cc:393] Running gRPC ModelServer at 0.0.0.0:8500 ...
[warn] getaddrinfo: address family for nodename not supported
2022-04-24 09:32:06.785748: I tensorflow_serving/model_servers/server.cc:414] Exporting HTTP/REST API at:localhost:8501 ...
[evhttp_server.cc : 245] NET_LOG: Entering the event loop ...

नया एंडपॉइंट बनाना

TensorFlow सर्विंग में 'चेनिंग' काम नहीं करती कई क्रम वाले मॉडल हैं, तो आपको एक ऐसी नई सेवा बनानी होगी जो वापस हासिल करने वाले मॉडल और रैंकिंग मॉडल को कनेक्ट करती हो.

step2/backend/recommendations.py फ़ाइल के get_recommendations() फ़ंक्शन में यह कोड जोड़ें:

user_id = request.get_json()["user_id"]
retrieval_request = json.dumps({"instances": [user_id]})
retrieval_response = requests.post(RETRIEVAL_URL, data=retrieval_request)
movie_candidates = retrieval_response.json()["predictions"][0]["output_2"]

ranking_queries = [
    {"user_id": u, "movie_title": m}
    for (u, m) in zip([user_id] * NUM_OF_CANDIDATES, movie_candidates)
]
ranking_request = json.dumps({"instances": ranking_queries})
ranking_response = requests.post(RANKING_URL, data=ranking_request)
movies_scores = list(np.squeeze(ranking_response.json()["predictions"]))
ranked_movies = [
    m[1] for m in sorted(list(zip(movies_scores, movie_candidates)), reverse=True)
]

return make_response(jsonify({"movies": ranked_movies}), 200)

फ़्लास्क सेवा शुरू करें

अब आप फ़्लास्क सेवा शुरू कर सकते हैं.

अपने टर्मिनल में, step2/backend/ फ़ोल्डर में जाकर ये काम करें:

FLASK_APP=recommender.py FLASK_ENV=development flask run

फ़्लास्क, http://localhost:5000/recommend पर एक नया एंडपॉइंट खड़ा करेगा. आपको इस तरह लॉग दिखेगा:

 * Serving Flask app 'recommender.py' (lazy loading)
 * Environment: development
 * Debug mode: on
 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)
 * Restarting with stat
 * Debugger is active!
 * Debugger PIN: 705-382-264
127.0.0.1 - - [25/Apr/2022 19:44:47] "POST /recommend HTTP/1.1" 200 -

एंडपॉइंट पर सैंपल अनुरोध भेजा जा सकता है, ताकि यह पक्का किया जा सके कि यह उम्मीद के मुताबिक काम कर रहा है या नहीं:

curl -X POST -H "Content-Type: application/json" -d '{"user_id":"42"}' http://localhost:5000/recommend

एंडपॉइंट, उपयोगकर्ता 42 के लिए सुझाई गई फ़िल्मों की सूची दिखाएगा:

{
  "movies": [
    "While You Were Sleeping (1995)",
    "Preacher's Wife, The (1996)",
    "Michael (1996)",
    "Lion King, The (1994)",
    "Father of the Bride Part II (1995)",
    "Sleepless in Seattle (1993)",
    "101 Dalmatians (1996)",
    "Bridges of Madison County, The (1995)",
    "Rudy (1993)",
    "Jack (1996)"
  ]
}

हो गया! आपने यूज़र आईडी के आधार पर फ़िल्मों के सुझाव देने के लिए, बैकएंड बना लिया है.

8. तीसरा चरण: Android और iOS के लिए Flutter ऐप्लिकेशन बनाना

बैकएंड तैयार है. Flutter ऐप्लिकेशन से मूवी के सुझावों के बारे में क्वेरी करने के लिए, इसे अनुरोध भेजना शुरू किया जा सकता है.

फ़्रंटएंड ऐप्लिकेशन काफ़ी आसान है. इसमें सिर्फ़ एक TextField है जो यूज़र आईडी को लेता है और (recommend() फ़ंक्शन में) आपके अभी बनाए गए बैकएंड पर अनुरोध भेजता है. रिस्पॉन्स मिलने के बाद, ऐप्लिकेशन का यूज़र इंटरफ़ेस (यूआई) सुझाए गए फ़िल्मों को ListView में दिखाता है.

step3/frontend/lib/main.dart फ़ाइल के recommend() फ़ंक्शन में यह कोड जोड़ें:

final response = await http.post(
  Uri.parse('http://' + _server + ':5000/recommend'),
  headers: <String, String>{
    'Content-Type': 'application/json',
  },
  body: jsonEncode(<String, String>{
    'user_id': _userIDController.text,
  }),
);

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

ऊपर दिए गए कोड के ठीक नीचे यह कोड जोड़ें:

if (response.statusCode == 200) {
  return List<String>.from(jsonDecode(response.body)['movies']);
} else {
  throw Exception('Error response');
}

इसे चलाएं

डीबग करना शुरू करें पर क्लिक करें. इसके बाद, ऐप्लिकेशन के लोड होने का इंतज़ार करें.
यूज़र आईडी डालें (उदाहरण के लिए, 42) और फिर सुझाव दें चुनें.

9. चौथा चरण: डेस्कटॉप प्लैटफ़ॉर्म पर Flutter ऐप्लिकेशन चलाना

Flutter, Android और iOS के अलावा, Linux, Mac, और Windows जैसे डेस्कटॉप प्लैटफ़ॉर्म पर भी काम करता है.

Linux

पक्का करें कि VSCode के स्टेटस बार में, टारगेट डिवाइस पर सेट हो.
डीबग करना शुरू करें पर क्लिक करें. इसके बाद, ऐप्लिकेशन के लोड होने का इंतज़ार करें.
यूज़र आईडी डालें (उदाहरण के लिए, 42) और फिर सुझाव दें चुनें.

Mac

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

इस कोड को क्रम से step4/frontend/macOS/Runner/DebugProfile.entitlements और step4/frontend/macOS/Runner/Release.entitlements में जोड़ें:

<key>com.apple.security.network.client</key>
<true/>

पक्का करें कि VSCode के स्टेटस बार में, टारगेट डिवाइस पर सेट हो.
डीबग करना शुरू करें पर क्लिक करें. इसके बाद, ऐप्लिकेशन के लोड होने का इंतज़ार करें.
यूज़र आईडी डालें (उदाहरण के लिए, 42) और फिर सुझाव दें चुनें.

Windows

पक्का करें कि VSCode के स्टेटस बार में, टारगेट डिवाइस पर सेट हो.
डीबग करना शुरू करें पर क्लिक करें. इसके बाद, ऐप्लिकेशन के लोड होने का इंतज़ार करें.
यूज़र आईडी डालें (उदाहरण के लिए, 42) और फिर सुझाव दें चुनें.

10. पांचवां चरण: वेब प्लैटफ़ॉर्म पर Flutter ऐप्लिकेशन चलाना

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

पक्का करें कि VSCode के स्टेटस बार में, टारगेट डिवाइस पर सेट हो.
डीबग करना शुरू करें पर क्लिक करें और फिर Chrome ब्राउज़र में ऐप्लिकेशन के लोड होने की इंतज़ार करें.
यूज़र आईडी डालें (उदाहरण के लिए, 42) और फिर सुझाव दें चुनें.

11. बधाई हो

आपने लोगों को फ़िल्मों के सुझाव देने के लिए, एक फ़ुलस्टैक ऐप्लिकेशन बनाया है!

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