सॉफ़्टवेयर डेवलपमेंट की पूरी लाइफ़साइकल के दौरान Duet AI का इस्तेमाल करना

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

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

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

मकसद

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

  • Duet AI की मदद से, मौजूदा वेब ऐप्लिकेशन को बेहतर बनाएं.
  • ऐप्लिकेशन को Cloud Run पर डिप्लॉय करें.
  • Duet AI को ऐप्लिकेशन में हुई किसी गड़बड़ी के बारे में बताने और उसे ठीक करने के लिए कहें.
  • Duet AI की मदद से, ऐप्लिकेशन के लिए टेस्ट तैयार करें.
  • Duet AI की मदद से, ऐप्लिकेशन के लॉग देखें.

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

  • Google Cloud Platform खाता और एक ऐसा प्रोजेक्ट जिसमें बिलिंग की सुविधा चालू हो
  • Linux का बुनियादी अनुभव

2. सेटअप

इस सेक्शन में वह सब कुछ बताया गया है जो आपको इस लैब का इस्तेमाल शुरू करने के लिए करना होगा.

प्रोजेक्ट बनाएं

क्लीनअप को आसान बनाने के लिए, एक नया Google Cloud प्रोजेक्ट बनाएं.

  • https://console.cloud.google.com पर जाएं.
  • प्रोजेक्ट चुनने के लिए ड्रॉपडाउन मेन्यू पर क्लिक करें
  • 'प्रोजेक्ट बनाएं' चुनें
  • इसे यादगार नाम दें, जैसे कि परिचय से कंटेनर

Google Cloud प्रोजेक्ट में Duet AI को चालू करना

अब हम अपने Google Cloud प्रोजेक्ट में Duet AI API को चालू करेंगे. इसके लिए, यहां दिया गया तरीका अपनाएं:

  1. https://console.cloud.google.com पर जाकर, डैशबोर्ड पर जाएं और पक्का करें कि आपने वह Google Cloud प्रोजेक्ट चुना हो जिसके साथ आपको इस लैब के लिए काम करना है. सबसे ऊपर दाईं ओर दिख रहे, Duet AI आइकॉन पर क्लिक करें.

a4d8a7253b056abb.png

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

58296b10f18b7a37.png

  1. इसके चालू होने के बाद, Duet AI को एक या दो क्वेरी पूछकर टेस्ट किया जा सकता है. कुछ सैंपल क्वेरी दिखाई गई हैं, लेकिन आप "Cloud Run क्या है?" जैसा कुछ आज़माकर देख सकते हैं.

8953fb4afeeddb1a.png

Duet AI आपके सवाल के जवाब देगा. Duet AI चैट विंडो को बंद करने के लिए, सबसे ऊपर दाएं कोने में मौजूद _ आइकॉन पर क्लिक करें.

Cloud Shell IDE में Duet AI को चालू करें

बाकी कोडलैब के लिए, हम Cloud Shell IDE का इस्तेमाल करेंगे. हमें Cloud Shell IDE में Duet AI को चालू और कॉन्फ़िगर करना होगा. इसके लिए, यह तरीका अपनाएं:

  1. नीचे दिखाए गए आइकॉन की मदद से Cloud Shell को लॉन्च करें. क्लाउड शेल इंस्टेंस चालू होने में एक या दो मिनट लग सकते हैं.

3b59c357d06c5ab1.png

  1. Editor या Open Editor बटन पर क्लिक करें (जैसा भी हो सकता है) और Cloud Shell IDE के दिखने तक इंतज़ार करें. आप "नए" का उपयोग करेंगे एडिटर है, न कि लेगसी एडिटर.

a54576c01be31a97.png

  1. सबसे नीचे स्टेटस बार में, क्लाउड कोड - साइन इन बटन पर क्लिक करें, जैसा कि दिखाया गया है. निर्देश के अनुसार प्लग इन को अनुमति दें. अगर आपको "Cloud कोड - कोई प्रोजेक्ट नहीं" दिखता है, तो स्टेटस बार में, उसे चुनें और फिर प्रोजेक्ट की सूची से वह Google Cloud प्रोजेक्ट चुनें जिस पर आपको काम करना है.

9b77ab79e8c135e6.png

  1. सबसे नीचे दाएं कोने में मौजूद, Duet AI बटन पर क्लिक करें. इसके बाद, वह Google Cloud प्रोजेक्ट चुनें जिसके लिए हमने Cloud AI Companion API चालू किया था.

afa42f64a331ad70.png

  1. Google Cloud प्रोजेक्ट को चुनने और अनुमति देने के बाद, पक्का करें कि आपको स्टेटस बार में Cloud Code के स्टेटस मैसेज में यह जानकारी दिख रही हो. साथ ही, दाईं ओर मौजूद स्टेटस बार में Duet AI भी चालू हो. यह जानकारी, नीचे दिए गए स्टेटस बार में दी गई है:

11656bd6a7ddfea4.png

Duet AI का इस्तेमाल किया जा सकता है!

3. Duet AI का इस्तेमाल किया जा रहा है

इस लैब के हिस्से के तौर पर, वेब ऐप्लिकेशन बनाया जाएगा. लैब में Duet को आज़माने के लिए कई जगहों के बारे में बताया गया है. अगर आपको इस बारे में जानना है, तो लैब में कहीं भी Duet की सुविधा का इस्तेमाल किया जा सकता है.

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

4. वेब ऐप्लिकेशन बनाएं

यह लैब "सिंबल सुपरस्टोर" का इस्तेमाल करती है किराने के सामान का वेब ऐप्लिकेशन. इस लैब के बाद के टास्क में, आपको इस ऐप्लिकेशन में एक नई सुविधा डेवलप करने और डिप्लॉय करने के लिए Duet AI का इस्तेमाल करने की सुविधा मिलेगी. Duet AI, मौजूदा कोड को समझने में आपकी मदद कैसे करता है, यह जानने से पहले, आपको कुछ मौजूदा कोड की ज़रूरत होगी. इससे आपको इस ऐप्लिकेशन के लिए, फ़्रंटएंड और बैकएंड कॉम्पोनेंट को बनाने में मदद मिलेगी.

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

750038c738f1f405.png

एनवायरमेंट को कॉन्फ़िगर करना

Cloud Shell में कमांड इस्तेमाल करें.

  1. प्रोजेक्ट आईडी सेट करें:
gcloud config set project <Google Cloud Project ID>
  1. Docker क्रेडेंशियल हेल्पर चलाने के लिए, यह कमांड चलाएं:
gcloud auth configure-docker
  1. अगर पूछा जाए कि क्या आपको जारी रखना है, तो Y टाइप करें.
  2. "सिंबल सुपरस्टोर" डाउनलोड करने के लिए ऐप्लिकेशन कोड का इस्तेमाल करने के लिए, Cloud Shell में अपनी रूट डायरेक्ट्री से नीचे दिया गया कमांड चलाएं. इसे GitHub से सिंबल सुपरस्टोर कोड मिलेगा.
git clone https://github.com/GoogleCloudPlatform/cymbal-superstore
  1. इस कोड को ठीक से चलाने के लिए, आपको कई एपीआई चालू करने होंगे. Cloud Shell में, नीचे दिया गया निर्देश डालें:
gcloud services enable cloudresourcemanager.googleapis.com compute.googleapis.com artifactregistry.googleapis.com serviceusage.googleapis.com run.googleapis.com bigquery.googleapis.com 
  1. डाउनलोड किए गए कोड में, Terraform डायरेक्ट्री में बदलाव करें:
cd cymbal-superstore/terraform
  1. यह लैब, स्पैनर का इस्तेमाल नहीं करेगा, इसलिए हम टेरेस पर दिए गए निर्देशों के ऐसे वर्शन का इस्तेमाल करेंगे जिसमें स्पैनर इंस्टॉल नहीं होता. Cloud Shell में, नीचे दिया गया निर्देश डालें:
mv main.tf.nospanner main.tf
  1. हर बार टेराफ़ॉर्म कमांड चलाने पर, प्रोजेक्ट का नाम और नंबर डालने से बचने के लिए, इस terraform डायरेक्ट्री में terraform.tfvars नाम की फ़ाइल बनाएं. इस फ़ाइल में नीचे दी गई जानकारी के साथ दो पंक्तियां जोड़ें और फ़ाइल सेव करें. आपको यह जानकारी, प्रोजेक्ट के डैशबोर्ड में मिलेगी.
project_id="Your project id"
project_number=Your project number
  1. इस लाइन से टेराफ़ॉर्म शुरू करें:
terraform init
  1. आखिर में, नीचे दिए गए निर्देश का इस्तेमाल करके, अपने प्रोजेक्ट में Teraform के संसाधनों को डिप्लॉय करें. आपको "हां" लिखने के लिए कहा जा सकता है इन बदलावों को लागू किया जा सकता है. इसमें 10 मिनट तक लग सकते हैं. इसलिए, हो सकता है कि आप https://github.com/GoogleCloudPlatform/cymbal-superstore/blob/main/assets/architecture.png पर आर्किटेक्चर डायग्राम की जांच करें. आप मौजूदा कोड पर नज़र डाल सकते हैं और उसे समझने में हमारी मदद करने के लिए Duet का इस्तेमाल कर सकते हैं.
terraform apply

इस निर्देश के सही तरह से काम करने के बाद, आपको इस तरह का आउटपुट दिखेगा:

9c9d2378167312eb.png

  1. अपने आउटपुट में बैकएंड inventory_cr_endpoint से बात करने के लिए, फ़्रंटएंड अपडेट करें. ऐसा करने के लिए, अपने inventory_cr_endpoint की वैल्यू कॉपी करें, cymbal-superstore/frontend/.env.production खोलें और REACT_APP_INVENTORY_URL की वैल्यू बदलें.
  2. terraform apply को फिर से चलाएं. इसमें सिर्फ़ एक मिनट लगेगा, क्योंकि यह अपडेट किए गए बैकएंड यूआरएल की मदद से, आपके फ़्रंटएंड React ऐप्लिकेशन को Cloud Storage में फिर से डिप्लॉय कर देगा.
  3. अपने frontend_ip को किसी ब्राउज़र में खोलें. आपको Cymbal Superstore का फ़्रंटएंड दिखेगा. बदलावों को लागू होने में कुछ मिनट लग सकते हैं, इसलिए आपको एक से ज़्यादा बार जांच करनी पड़ सकती है.

b864d3efe9a26eaa.png

  1. Cymbal के होम पेज पर बाईं ओर मौजूद, New Accommodations पर क्लिक करें. आपको प्लेसहोल्डर प्रॉडक्ट वाला एक मॉक फ़्रंटएंड पेज दिखेगा. ऐसा पहले से किया जा सकता है, क्योंकि इस लैब के अगले टास्क में नया प्रॉडक्ट पेज दिखाने के लिए, बैकएंड इन्वेंट्री एपीआई कोड लागू किया जाएगा.

f4d7579f73ee8ed2.png

5. वेब ऐप्लिकेशन बैकएंड में बदलाव करना

आइए, अपने वेब ऐप्लिकेशन बैकएंड में सुविधाएं जोड़ने के लिए, Duet AI का इस्तेमाल करें.

इस टास्क में, आपको Duet AI से कोड पूरा करने को कहा जाएगा, ताकि ऐप्लिकेशन में /newproducts एंडपॉइंट लागू किया जा सके. Firestore से नए प्रॉडक्ट वापस पाने के लिए, आपको बैकएंड में एक एंडपॉइंट बनाना होगा. साथ ही, बदलाव को लागू करने से पहले इस एंडपॉइंट की जांच करनी होगी.

/newproducts एंडपॉइंट डेवलप करना

  1. क्लाउड शेल एडिटर में cymbal-superstore/backend/index.ts फ़ाइल खोलें.
  2. index.ts फ़ाइल में, लाइन 95 के आस-पास, DEMO TASK START के लिए की गई टिप्पणी तक स्क्रोल करें. यहां आपको इस टास्क के लिए टिप्पणी की गई लाइनों का ग्रुप दिखता है. टिप्पणी की गई सभी लाइनों को हटाएं और Duet AI के लिए दिए गए इस प्रॉम्प्ट से उनकी जगह बदलें:
// Get new products from Firestore (added < 7 days ago) and quantity > 0 (in stock)
  1. Duet AI को फ़ंक्शन कोड जनरेट करने का निर्देश देने के लिए, पूरी टिप्पणी चुनें. इसके बाद, बल्ब ( कोड OSS Duet AI बल्ब) पर क्लिक करें.
  2. ज़्यादा कार्रवाइयां मेन्यू में, 'कोड जनरेट करें' चुनें.
  3. जनरेट किए गए कोड पर कर्सर घुमाएं और Duet AI के टूलबार में जाकर, 'स्वीकार करें' पर क्लिक करें. Duet AI, /newproducts एंडपॉइंट के लिए फ़ंक्शन कोड का डेटा जनरेट करता है.

ध्यान दें: Duet AI आपके प्रॉम्प्ट के लिए, कोड के कई वर्शन जनरेट कर सकता है. टूलबार में मौजूद सूची को स्क्रोल करके, कोई खास वर्शन चुना जा सकता है.

  1. जनरेट किया गया कोड यहां दिया गया कोड जैसा होना चाहिए:
app.get("/newproducts", async (req: Request, res: Response) => {
  const products = await firestore
    .collection("inventory")
    .where("timestamp", ">", new Date(Date.now() - 604800000))
    .where("quantity", ">", 0)
    .get();
  const productsArray: any[] = [];
  products.forEach((product) => {
    const p: Product = {
      id: product.id,
      name: product.data().name,
      price: product.data().price,
      quantity: product.data().quantity,
      imgfile: product.data().imgfile,
      timestamp: product.data().timestamp,
      actualdateadded: product.data().actualdateadded,
    };
    productsArray.push(p);
  });
  res.send(productsArray);
});

इनमें से कई लाइनें, आपको लाइसेंस से जुड़ी समस्याओं की चेतावनी देने के लिए अंडरलाइन की गई हैं. इस लैब के लिए, 'तुरंत ठीक करें' सुविधा लागू की जा सकती है. आने वाले समय में, इन चेतावनियों को ज़रूर देख लें!

  1. अगर जनरेट किया गया आपका कोड, पिछले चरण में दिए गए उदाहरण से मिलता-जुलता नहीं है, तो इसे अभी बदलें. इसके अलावा, यह भी देखा जा सकता है कि Duet की मदद से बाद में कैसे डीबग किया जा सकता है. scripts/solutioncode-with-bug.ts . फ़ाइल में संभावित गड़बड़ी वाला कोड का एक वर्शन भी मौजूद है
  2. index.ts फ़ाइल सेव करें.

/``newproducts एंडपॉइंट की जांच और उसे डीबग करना

  1. Cloud Shell में, cymbal-superstore/backend डायरेक्ट्री पर जाएं. निर्देश डालें:
npm run start

इससे एंडपॉइंट शुरू हो जाएगा.

  1. एंडपॉइंट के नतीजे देखने के लिए, Cloud Shell के मेन्यू बार में + का इस्तेमाल करके कोई दूसरा टर्मिनल खोलें और यह निर्देश दें:
curl localhost:8000/newproducts

आपको नए टर्मिनल में गड़बड़ी का curl: (52) Empty reply from server मैसेज दिख सकता है. साथ ही, एंडपॉइंट को चलाने वाले टर्मिनल में 'Cannot have inequality filters on multiple properties: [quantity, timestamp]' जानकारी के साथ गड़बड़ी का एक लंबा मैसेज दिख सकता है.

  1. चलिए, इस गड़बड़ी को ठीक करते हैं. हालांकि, सबसे पहले हमें यह समझना होगा कि गड़बड़ी के मैसेज का क्या मतलब है. ऐसा करने के लिए, हम Duet से अनुरोध करेंगे. Cloud Shell Editor की बाईं ओर मौजूद मेन्यू से Duet AI Chat खोलें और यह सवाल पूछें:
I'm querying Cloud Firestore and getting this error: 'Cannot have inequality filters on multiple properties: [quantity, timestamp]' What does it mean?

Duet AI से आपको इस समस्या को हल करने के कुछ विकल्प मिलेंगे. इन विकल्पों में से एक फ़िल्टर को हटाना भी शामिल है. समाधान करने के लिए, index.ts से .where("quantity", ">", 0) पंक्ति को हटा दें, ताकि हमारी क्वेरी में केवल एक फ़िल्टर रहे.

  1. सर्वर को रीस्टार्ट करने और प्रॉडक्ट की लिस्ट पाने के लिए, ऊपर दिए गए पहले दो चरणों को दोहराएं. अब काम पूरा हो गया होगा. अगर ऐसा नहीं होता है, तो समस्या का पता लगाने के लिए Duet का इस्तेमाल करें. इसके अलावा, आगे बढ़ने के लिए, scripts/solutioncode-bug-fixed.ts में सही समाधान का इस्तेमाल करें.

बदलाव को लागू करना

बदले गए ऐप्लिकेशन को डिप्लॉय करने के लिए, Cloud Shell में terraform डायरेक्ट्री से terraform apply को फिर से चलाएं. इसके बाद, टेराफ़ॉर्म से मिले आईपी पते पर ऐप्लिकेशन को देखा जा सकता है.

6. राइटिंग टेस्ट

किसी प्रोजेक्ट में कोड के लिए टेस्ट बनाना एक ऐसा अहम काम है जिसे अक्सर प्राथमिकता नहीं दी जाती. Duet की मदद से, ये टेस्ट किए जा सकते हैं.

आइए, अभी-अभी बनाए गए newproducts कोड के लिए टेस्ट बनाते हैं.

  1. backend/index.test.ts खोलें. प्रॉम्प्ट की मदद से newproducts() फ़ंक्शन के लिए टेस्ट जनरेट करने के लिए, Duet AI चैट का इस्तेमाल करें:
Help me write an Express.js test using Jest, in typescript, for the GET /newproducts handler in index.ts. Should check if the response code is 200 and the list of new products is length 8.

आपने देखा कि इसमें import लाइनें मौजूद हैं, जो फ़ाइल में पहले से मौजूद हैं. बताई गई लाइनों में, फ़ाइल में सिर्फ़ describe() टेस्ट को कॉपी करें. फ़ाइल सेव करें.

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

  1. टेस्ट के नतीजे देखने के लिए, Cloud Shell पर जाएं और डायरेक्ट्री को backend फ़ोल्डर में बदलें और यह निर्देश दें:
npm run test

7. लॉग इन हो रहा है

आपके प्रोजेक्ट के डिप्लॉय होने के बाद भी, Duet AI उसकी मदद कर सकता है. इस सेक्शन में, हम Duet AI की मदद से बनाए गए लॉग देखेंगे.

Cloud Console पर वापस जाएं और पक्का करें कि Duet की सुविधा चालू हो. Duet से पूछें कि लॉग कहां मिलेंगे. बेझिझक अपना सवाल आज़माएं. हालांकि, अगर इससे सही जवाब नहीं मिलता, तो नीचे दिया गया प्रॉम्प्ट काम करेगा.

How can I view the Cloud Run logs for the service called 'inventory'?

Duet AI को आपको Cloud Run पेज पर जाने, इन्वेंट्री सेवा चुनने, और उस सेवा के लॉग की जांच करने का सुझाव देना चाहिए. आपको कुछ ऐसा दिखेगा:

b7c50b67e49ee71a.png

कोई आइटम चुनें और Duet AI से इसे समझाने के लिए कहें. आपको आम भाषा में एंट्री का ब्यौरा मिलना चाहिए.

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

2574adab06524ad4.png

8. बधाई हो!

बधाई हो - आपने Duet AI का इस्तेमाल कर लिया है. इसकी मदद से, ऐसे कोड को समझा जा सकता है जो शायद आपने पहले कभी न देखा हो. आपने इस कोड को बेहतर बनाया है, इसके लिए टेस्ट बनाए हैं, और लॉग एंट्री को समझने के लिए Duet का इस्तेमाल किया है.

साफ़-सफ़ाई सेवा

प्रोजेक्ट मिटाएं

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

  • नेविगेशन मेन्यू में, IAM और एडमिन की जानकारी
  • इसके बाद, सबमेन्यू में सेटिंग पर क्लिक करें
  • "प्रोजेक्ट मिटाएं" टेक्स्ट वाले ट्रैशकैन आइकॉन पर क्लिक करें
  • निर्देशों का पालन करें

इस लैब में, हमने देखा है कि:

  • Duet AI की मदद से, मौजूदा वेब ऐप्लिकेशन को बेहतर बनाएं.
  • ऐप्लिकेशन को Cloud Run पर डिप्लॉय करें.
  • Duet AI को ऐप्लिकेशन में हुई किसी गड़बड़ी के बारे में बताने और उसे ठीक करने के लिए कहें.
  • Duet AI की मदद से, ऐप्लिकेशन के लिए टेस्ट तैयार करें.
  • Duet AI की मदद से, ऐप्लिकेशन के लॉग देखें.