مقدمه ای بر تست با Gemini Code Assist

1. معرفی

در این آزمایشگاه، از Gemini Code Assist، یک همکار مبتنی بر هوش مصنوعی در Google Cloud، برای اضافه کردن آزمایش‌ها به یک برنامه وب پایتون موجود، و پیدا کردن و رفع خطاهای موجود در آن برنامه که توسط آزمایش‌ها نشان داده شده است، استفاده خواهید کرد. سپس از Code Assist برای ایجاد تست‌هایی برای عملکرد جدید و تولید کد برای قبولی در این تست‌ها و گسترش برنامه استفاده خواهید کرد.

کاری که خواهی کرد...

  • شما از Cloud Shell Editor برای دانلود کد یک برنامه وب موجود استفاده خواهید کرد.
  • از Gemini Code Assist Chat در Cloud Shell Editor برای پرسیدن سؤالات کلی درباره Google Cloud استفاده خواهید کرد.
  • شما از کمک کد Inline Gemini Code Assist در Cloud Shell Editor برای تولید آزمایش‌های برنامه، اجرای آزمایش‌ها، یافتن و رفع خطاها و سپس گسترش عملکرد برنامه استفاده خواهید کرد.

آنچه یاد خواهید گرفت...

  • نحوه استفاده از Gemini Code Assist برای چندین کار توسعه دهنده مانند تولید تست و تولید کد.
  • نحوه استفاده از Gemini Code Assist برای آشنایی با Google Cloud.

آنچه شما نیاز خواهید داشت ...

  • مرورگر وب کروم
  • یک اکانت جیمیل
  • یک پروژه Cloud با فعال کردن صورت‌حساب
  • Gemini Code Assist برای پروژه Cloud شما فعال شد

این آزمایشگاه برای توسعه دهندگان در تمام سطوح، از جمله مبتدیان هدف قرار گرفته است. اگرچه برنامه نمونه به زبان پایتون است، اما برای اینکه بفهمید چه اتفاقی می افتد، نیازی به آشنایی با برنامه نویسی پایتون ندارید. تمرکز ما بر آشنایی با قابلیت های Gemini Code Assist برای توسعه دهندگان خواهد بود.

2. راه اندازی

شما باید قبلاً یک پروژه Cloud داشته باشید که صورتحساب آن برای استفاده در این آزمایشگاه فعال باشد. اکنون Gemini API را در پروژه Google Cloud خود فعال می کنیم. مراحل زیر را دنبال کنید:

  1. از https://console.cloud.google.com دیدن کنید و مطمئن شوید که پروژه Google Cloud را که قصد دارید با آن برای این آزمایشگاه کار کنید، انتخاب کرده اید. روی نماد Gemini که در بالا سمت راست می بینید کلیک کنید.

GeminiBanner.png

  1. پنجره کنسول Gemini for Cloud در سمت راست کنسول باز می شود. اگر در زیر نشان داده شده است، روی دکمه Enable کلیک کنید. اگر دکمه Enable را نمی بینید و به جای آن یک رابط چت می بینید، قبلا Gemini را برای Cloud برای پروژه فعال کرده اید و می توانید مستقیماً به مرحله بعدی بروید.

GeminiApiEnable.png

  1. هنگامی که آن را فعال کنید، می توانید با پرسیدن یک یا دو پرس و جو از Gemini آن را آزمایش کنید. چند نمونه پرس و جو نشان داده شده است اما می توانید چیزی مانند Cloud Run چیست؟

GeminiChatWindow.png

Code Assist با پاسخ به سوال شما پاسخ خواهد داد. می توانید روی آن کلیک کنید f68286b2b2ea5c0a.png نماد در گوشه سمت راست بالا برای بستن پنجره گفتگوی Code Assist.

Gemini را در Cloud Shell Editor فعال کنید

Gemini Code Assist در دسترس است و در چندین IDE محبوب به طور مشابه رفتار می کند. شما از Google Cloud Shell Editor استفاده خواهید کرد که به طور کامل در مرورگر وب شما در این کد لبه اجرا می شود. شما باید Gemini را در ویرایشگر پوسته ابری فعال و پیکربندی کنید و مراحل در زیر آورده شده است:

  1. Cloud Shell را از طریق نماد نشان داده شده در زیر راه اندازی کنید. راه اندازی نمونه Cloud Shell ممکن است یک یا دو دقیقه طول بکشد.

72dc3df7b007fcde.png

  1. بر روی دکمه ویرایشگر یا باز کردن ویرایشگر (برحسب مورد) کلیک کنید و منتظر بمانید تا ویرایشگر پوسته ابری ظاهر شود. اگر دکمه ویرایشگر جدید را امتحان کنید، روی آن کلیک کنید.

CloudShellEditor.png

  1. همانطور که نشان داده شده است، روی دکمه Cloud Code - Sign in در نوار وضعیت پایین کلیک کنید. پلاگین را طبق دستورالعمل مجاز کنید. اگر «کد ابری - بدون پروژه» را در نوار وضعیت می‌بینید، آن را انتخاب کنید و سپس پروژه Google Cloud خاص را از لیست پروژه‌هایی که قصد دارید با آنها کار کنید، انتخاب کنید.

CloudCodeSignIn.png

  1. اگر نماد Gemini را در نوار وضعیت در پایین سمت راست نمی بینید، باید آن را در Cloud Code فعال کنید. قبل از انجام این کار، اطمینان حاصل کنید که Gemini (که قبلاً به عنوان Duet AI برای توسعه دهندگان شناخته می شد) در IDE با رفتن به Cloud Code Extension → Settings فعال است و سپس متن Duet AI را وارد کنید: Enable مانند شکل زیر. مطمئن شوید که چک باکس انتخاب شده است. شما باید IDE خود را دوباره بارگیری کنید. این گزینه Gemini را در Cloud Code فعال می کند و نوار وضعیت Gemini در IDE شما ظاهر می شود.

EnableDuetAiSetting.png را فعال کنید

  1. همانطور که نشان داده شده است، روی دکمه Gemini در گوشه سمت راست پایین کلیک کنید و پروژه صحیح Google Cloud را که ما Cloud AI Companion API را برای آن فعال کرده بودیم، انتخاب کنید.

GeminiSelectGoogleCloudProject.png

  1. هنگامی که پروژه Google Cloud خود را انتخاب کردید، مطمئن شوید که می توانید آن را در پیام وضعیت Cloud Code در نوار وضعیت مشاهده کنید و همچنین Gemini را در سمت راست، در نوار وضعیت همانطور که در زیر نشان داده شده است، فعال کرده اید:

GeminiEnabledStatusBar.png

Gemini Code Assist آماده استفاده است!

3. برنامه را دانلود و بررسی کنید

در پنجره ترمینال، دستور کلون کردن مخزن را با کد شروع اجرا کنید و سپس به دایرکتوری جدید تغییر دهید (اگر پنجره ترمینال دیگر باز نیست، روی دکمه Terminal یا Open Terminal کلیک کنید تا آن را بازیابی کنید):

git clone https://github.com/GoogleCloudPlatform/testing-with-duet-ai-codelab.git
cd testing-with-duet-ai-codelab

main.py را در ویرایشگر باز کنید، سپس با کلیک بر روی نماد چت Gemini در سمت چپ ویرایشگر، پنجره Gemini Chat را باز کنید. این پنجره Gemini Chat در داخل IDE است و کد موجود در IDE را به عنوان زمینه برای بحث در دسترس دارد. اعلان را وارد کنید این را توضیح دهید و پاسخ را مشاهده کنید:

GeminiChatExplainThis.png

می توانید این پنجره چت را اسکرول کنید تا کل پاسخ را ببینید. توضیح می گوید که ما می توانیم این برنامه را به صورت محلی با دستور python3 main.py در پنجره ترمینال اجرا کنیم.

4. به صورت محلی اجرا کنید

در صورت نیاز با cd ~/testing-with-duet-ai-codelab به فهرست مخزن تغییر دهید و دستور python3 main.py را در پنجره ترمینال وارد کنید:

3bf558e9cea15375.png

روی پیوند http://127.0.0.1:8080 کلیک کنید تا یک برگه مرورگر جدید به صفحه اصلی برنامه باز شود:

fb06f382a4c03e4c.png

برنامه به صورت "محلی" اجرا می شود. در واقع، ویرایشگر Cloud Shell در اینجا کمی جادو کرده است. برنامه در Cloud Shell اجرا می شود، نه در رایانه شخصی شما. وقتی روی پیوند کلیک کردید، یک برگه نه به آدرس محلی واقعی http://127.0.0.1:8080، بلکه به یک سرور پراکسی که فقط برای این منظور توسط Cloud Shell تنظیم شده بود، باز شد. اثر همان است که اگر واقعاً آن را به صورت محلی اجرا می کنید.

آن را امتحان کنید. 25 را وارد کرده و Convert را فشار دهید!

e1b9d5832f6d0058.png

درست است، 25 XXV در اعداد رومی است! اینجا باید تمام کنی

شاید چند عدد دیگر را بررسی کنید. 25 کار کرد، 24 چطور؟

37982e385e17baac.png

شاید کمی عجله داشتیم که فکر کنیم همه چیز خوب است. آیا XXIIII تبدیل صحیح برای 24 است؟ آیا نباید XXIV باشد؟

می توان موردی را مطرح کرد که XXIIII درست است، اما واقعاً آن چیزی نیست که مردم معمولاً انتظار دارند. از آنجایی که واقعاً اشتباه نیست (توجه داشته باشید که بسیاری از ساعت‌ها 4 را به‌عنوان عدد رومی IIII نشان می‌دهند) این مسئله را برای بهبودهای آینده رها کنید.

در مورد امتحان اعداد منفی چطور؟ صفر؟ هیچ راهی برای نمایش آن اعداد در اعداد رومی وجود ندارد. به نظر می رسد هیچ چیزی به کاربر باز نمی گردد، که به نظر می رسد خطایی باید برطرف شود.

تست می تواند به یافتن و حذف خطاها کمک کند و Gemini Code Assist می تواند به ما در نوشتن و استفاده از تست ها کمک کند.

5. اضافه کردن تست ها

به پنجره Gemini Chat برگردید و بپرسید

How can I test the number_to_roman function?

پاسخ را بخوانید، که باید شامل بحث در مورد ماژول unittest و ماژول pytest باشد.

ممکن است دوست داشته باشید که Gemini Code Assist واقعاً این آزمایش ها را برای شما بنویسد. calendar.py را، جایی که کد تبدیل واقعی قرار دارد، در ویرایشگر باز کنید، به پنجره Gemini Chat برگردید و دوباره بپرسید

How can I test the number_to_roman function?

پاسخ در حال حاضر خاص تر است، حتی شامل یک ماژول واحد تست که می توانید آن را کپی کنید یا در یک فایل جدید تزریق کنید:

import unittest
import calendar

class NumberToRomanTest(unittest.TestCase):

    def test_convert_1(self):
        self.assertEqual(calendar.number_to_roman(1), "I")

    def test_convert_4(self):
        self.assertEqual(calendar.number_to_roman(4), "IV")

    def test_convert_9(self):
        self.assertEqual(calendar.number_to_roman(9), "IX")

    def test_convert_40(self):
        self.assertEqual(calendar.number_to_roman(40), "XL")

    def test_convert_90(self):
        self.assertEqual(calendar.number_to_roman(90), "XC")

    def test_convert_400(self):
        self.assertEqual(calendar.number_to_roman(400), "CD")

    def test_convert_900(self):
        self.assertEqual(calendar.number_to_roman(900), "CM")

    def test_convert_1990(self):
        self.assertEqual(calendar.number_to_roman(1990), "MCMXC")

    def test_convert_2023(self):
        self.assertEqual(calendar.number_to_roman(2023), "MMXXIII")

ممکن است کدهای متفاوتی از مثال بالا ببینید. مدل‌های زیربنایی Gemini Code Assist هر از گاهی به‌روزرسانی می‌شوند، بنابراین پاسخ‌ها همیشه یکسان نخواهند بود. اگر مجموعه کد دیگری را مشاهده کردید، اکنون می توانید انتخاب کنید که آیا با کپی کردن کد نشان داده شده در اینجا، نمونه های نشان داده شده در این کد را ادامه دهید یا می توانید پاسخ جایگزین Gemini Code Assist را امتحان کنید. اگر وقت دارید، حتی می توانید هر دو راه را امتحان کنید. Gemini Code Assist یک دستیار کد نویسی است که می توانید از آن هر طور که می خواهید استفاده کنید.

یا روی فلش دو نقطه در گوشه سمت راست بالای پنجره Gemini Chat کلیک کنید تا یک فایل جدید حاوی کد تست واحد ایجاد کنید، یا از IDE برای ایجاد یک فایل جدید و چسباندن کد نشان داده شده در این آزمایشگاه استفاده کنید. CTRL-S یا CMD-S را در آن پنجره فشار دهید تا ذخیره شود و فایل ذخیره شده calendar-unittest.py را فراخوانی کنید.

به ترمینال برگردید و CTRL-C را فشار دهید تا وب سروری را که قبلاً در حال اجرا رها کرده بودید متوقف کنید و یک درخواست پوسته دریافت کنید. دستور را وارد کنید

python3 calendar-unittest.py

برای اجرای تست های جدید

خروجی وجود ندارد. این چیزی نیست که انتظار می رفت. آیا همه چیز در سکوت گذشت؟ شما دوست دارید که مطمئن باشید. به پاسخ Gemini Code Assist که شامل کد تست بود، نگاه کنید. در زیر کد اطلاعات بیشتری در مورد نحوه اجرای تست کیس وجود دارد:

run-unittest.png

دستور توصیه شده را اجرا کنید:

python -m unittest discover

اگر دستگاه شما دستور python3 را به python مستعار نکند، ممکن است مشکل داشته باشید، در این صورت اجرا کنید:

python3 -m unittest discover

دستور اجرا می شود، اما Ran 0 tests in 0.000s برمی گرداند. ماژول دارای چندین تست در آن است. چه اتفاقی می افتد؟

این آخرین کلمه در فرمان است، discover . از کجا آمده؟ ظاهراً، Gemini Code Assist انتظار داشت که کد آزمایشی در فایلی به نام discover یا discover.py ذخیره شود، اما مشخص نکرد این کاری است که باید انجام دهید. از آنجایی که شما واقعاً فایل را در calendar-unittest.py ذخیره کرده اید، دستور را اجرا کنید:

python3 -m unittest calendar-unittest

اکنون خروجی های زیادی را مشاهده می کنید که با چیزی شبیه به این شروع می شود:

$ python3 -m unittest calendar-unittest
.F.FFFFFF
======================================================================
FAIL: test_convert_1990 (calendar-unittest.NumberToRomanTest)
----------------------------------------------------------------------
Traceback (most recent call last):
  File "/home/charles_engelke/testing-with-duet-ai-codelab/calendar-unittest.py", line 28, in test_convert_1990
    self.assertEqual(calendar.number_to_roman(1990), "MCMXC")
AssertionError: 'MDCCCCLXXXX' != 'MCMXC'
- MDCCCCLXXXX
+ MCMXC

خط اول یک نقطه برای هر آزمون قبولی و یک F برای هر آزمون مردود نشان می دهد. اکثر تست ها ناموفق هستند! سپس تست های شکست خورده را به صورت جداگانه فهرست می کند و خروجی مورد انتظار و خروجی واقعی را نشان می دهد. کمی نامشخص است که این تست ها به چه ترتیبی اجرا شده اند. این به ترتیب حروف الفبا بر اساس نام آزمون بود، نه به ترتیبی که آزمون ها در فایل ظاهر می شوند. بنابراین test_convert_1 ابتدا اجرا شد، سپس test_convert_1990 ، سپس test_convert_2023 و غیره. موارد آزمایشی برای 1 و 2023 تنها مواردی هستند که قبول شدند.

وقتی برای اولین بار این کد را امتحان کردید، متوجه شدید که 24 به XXIIII تبدیل می کند، که دقیقاً اشتباه نبود، اما نه شکل رایجی که IIII به IV تبدیل می شود. تمام تست های شکست خورده برای موارد مشابه بود. هنگامی که این مشکل برای اولین بار مورد توجه قرار گرفت، آزمایشگاه گفت: "از آنجایی که واقعاً اشتباه نیست (توجه داشته باشید که بسیاری از ساعت ها 4 به عنوان عدد رومی IIII نشان می دهند) این مشکل را برای بهبودهای آینده ترک کنید."

می‌توانید موارد تست را تغییر دهید تا پاسخ‌های «واقعاً اشتباه » را که کد داده شده است، انتظار داشته باشید و بپذیرید، یا بپذیرید که زمان آن «بهبود آینده» فرا رسیده است. بنابراین گام بعدی شما این است که با کمک Gemini Code Assist، کد را اصلاح کنید تا پاسخ های قابل قبول تری را که تست ها انتظار دارند ارائه دهید.

6. تقویت کد

به یاد بیاورید که پاسخ‌هایی مانند XXIIII برای 24 ، به جای XXIV رایج‌تر، «واقعاً اشتباه نبودند» و برای بهبود آینده به تعویق افتادند. آن آینده اکنون است. آن پاسخ‌های «واقعاً اشتباه نیست» هنوز آزاردهنده هستند.

اولین قانون برای تکرار ارقام در اعداد رومی این است: هر زمان که چهار رقم یکسان در یک ردیف دارید، باید با یکی از ارقام و به دنبال آن رقم بالاتر بعدی جایگزین شوند. بنابراین XXIIII باید با XXIV جایگزین شود. به همین ترتیب XXXX باید به XL تغییر کند و CCCC باید به CD تبدیل شود.

از Gemini Code Assist بپرسید که چگونه مقدار متغیر roman را به این روش تغییر دهید، درست قبل از اینکه توسط number_to_roman برگردانده شود:

If the final value of roman has IIII in it, that should be replaced by IV. Similarly XXXX should be replaced by XL, and CCCC should become CD. How can I make those changes?

پیشنهاد این است که در پایان کدی اضافه کنید:

6437c3fa2c5fabd1.png

آن خطوط را در ویرایشگر کپی/پیست یا تایپ کنید و سپس ببینید چه اتفاقی می افتد:

dcefa568cab82fb7.png

Gemini Code Assist خطوط بیشتری را برای رسیدگی به مواردی که می‌توانید پس از انجام اولین مجموعه از تعویض‌ها به آن‌ها برسید، اضافه کرده است. به عنوان مثال، 19 به XVIIII، سپس به XVIV و در نهایت به XIX صحیح تبدیل می شود.

اگر Gemini Code Assist پیشنهادات ظاهرا مفیدی ارائه کرد، برای پذیرش توصیه‌ها، Tab را فشار دهید، فایل را ذخیره کنید و سرور وب را دوباره اجرا کنید. در غیر این صورت، خطوط نشان داده شده در مثال در اینجا را به صورت دستی اضافه کنید و فایل را ذخیره کنید. یک تبدیل سخت را امتحان کنید: 1999:

a206999587fdc9.png

این درست است!

اکنون تست ها را دوباره اجرا کنید. همشون میگذرن!

به نظر می رسد که برنامه وب آماده تولید است.

7. در Cloud Run مستقر شوید

Cloud Run یک برنامه کانتینری را در اینترنت برای شما اجرا می کند. برای برنامه‌هایی که با استفاده از چارچوب‌های رایج نوشته شده‌اند، مانند Flash، دستور gcloud run deploy حتی آن ظرف را قبل از استقرار برای شما می‌سازد. دستور را اجرا کنید:

gcloud run deploy

در ترمینال. وقتی از محل کد منبع پرسیده شد، Enter را فشار دهید تا مکان صحیح پیشنهادی را بپذیرید. به طور مشابه، هنگامی که نام سرویس از شما خواسته شد، برای پذیرش پیشنهاد، Enter را فشار دهید.

این دستور ممکن است شکست بخورد زیرا gcloud نمی تواند تعیین کند که از کدام پروژه استفاده کند. در این صورت دستور را اجرا کنید:

gcloud config set core/project <project-id>

جایی که با شناسه پروژه شما جایگزین می شود که ممکن است با نام آن یکی باشد. سپس دستور gcloud run deploy دوباره اجرا کنید.

  • این دستور از شما می خواهد که API های خاصی مورد نیاز هستند و هنوز فعال نشده اند. y را وارد کنید تا آنها را برای شما فعال کنید.
  • هنگامی که از شما خواسته می شود منطقه ای را انتخاب کنید، یکی را که برای شما مناسب است انتخاب کنید. وارد کردن شماره مربوط به us-central1 یک انتخاب مطمئن است.
  • وقتی از شما پرسیده شد، Y را برای ادامه وارد کنید.
  • می‌خواهید به فراخوان‌های احراز هویت نشده این سرویس Cloud Run اجازه دهید. گزینه احراز هویت استفاده شده توسط Cloud Run برای استفاده توسط برنامه هایی که سرویس را فراخوانی می کنند مناسب است. از آنجایی که این یک وب سایت است، از احراز هویت استفاده نخواهید کرد.

Google Cloud کانتینر را می‌سازد، آن را مستقر می‌کند، ترافیک را به آن هدایت می‌کند و خط‌مشی‌های دسترسی را تنظیم می‌کند و سپس پیوند صفحه اصلی را به شما نشان می‌دهد:

94ba7d8d63a44afd.png

می توانید به آن لینک بروید و به برنامه خود دسترسی پیدا کنید.

a2e51666dfd33a9f.png

یک عدد وارد کنید و Enter را فشار دهید و تادا!

5021535ac991a95c.png

چی!؟!

روی دستگاه شما کار کرد! چرا این کار تمام نشده است؟

دریابید. از Gemini Code Assist بپرسید،

Why am I getting an internal server error on cloud run?

4b24321251d6eddf.png

ظاهرا Gemini Code Assist می تواند فایل لاگ را بخواند که چیزی شبیه به آن را می گوید. بیایید از Gemini Code Assist بپرسیم که چگونه می‌توانید به گزارش‌ها نگاه کنید:

92d1855be73ef1d.png

برو و این کار را بکن. به دنبال خطوط قرمز باشید!! شاخص های خطا به شرح زیر:

9bed4f9ed82de21c.png

پس از آن، جزئیات زیادی در پشته تماس به اینجا آمده است، اما این وجود دارد:

47fc93be845f4e3f.png

وقتی به فایل calendar.py خود نگاه می کنید، تابع number_to_roman را همانجا می بینید! و می دانید که درست است زیرا روی دستگاه شما کار می کرد. چه چیزی می تواند در Cloud Run متفاوت باشد؟

پاسخ مشکل است. یک ماژول استاندارد همراه پایتون 3 به نام calendar وجود دارد، درست مانند فایل calendar.py که تابع number_to_roman در آن تعریف شده است. در ماشین محلی شما، وقتی پایتون به دنبال ماژولی به نام calendar بود، ابتدا دایرکتوری برنامه شما را جستجو کرد. ظاهراً پایتون در Cloud Run ابتدا به دنبال ماژول‌های استاندارد گشت، آن را وارد کرد و تابع number_to_roman را پیدا نکرد.

این نوع تفاوت ها در محیط ها همیشه امکان پذیر است. خوشبختانه، هنگامی که یک برنامه کانتینری شده است، محیط خود را در خود حمل می کند، بنابراین هر کجا که آن را اجرا کنید می توانید انتظار رفتار مشابه را داشته باشید. اگر همان برنامه کانتینری شده را به صورت محلی اجرا می کردید که Cloud Run دارد، همان مشکل را داشتید.

این مشکل را برطرف کنید. شما باید نام ماژول تقویم محلی خود را به چیزی تغییر دهید که نام ماژول استاندارد نیز نباشد. نام فایل calendar.py را به my_calendar.py تغییر دهید، سپس خطوط import calendar را در main.py و calendar-unittest.py را برای import my_calendar تغییر دهید. در نهایت خط را تغییر دهید

roman = calendar.number_to_roman(number)

به

roman = my_calendar.number_to_roman(number)

آن را به صورت محلی امتحان کنید، تست ها را اجرا کنید و سپس مجدداً به کار بگیرید:

gcloud run deploy

و اکنون کار می کند:

ed288801c6825eb1.png

شما می توانید این URL را به اشتراک بگذارید و هرکسی که به ابزار تبدیل اعداد رومی نیاز دارد می تواند از ابزار شما استفاده کند.

8. اختیاری: آن را زیباتر نشان دهید

برنامه شما به خوبی اجرا می شود و برای هر کسی در وب قابل دسترسی است. اما ظاهر آن کمی ساده است. قبل از اینکه به همه در مورد آن بگویید، چرا از Gemini Code Assist برای بهبود ظاهر آن نخواهید؟

فایل templates/index.html را باز کنید. در پنجره چت Gemini، بپرسید:

Make this index.html file use material design.

پاسخ این است که به فایل فعلی اضافاتی ایجاد شود که نتیجه آن چیزی شبیه به موارد زیر است:

<!DOCTYPE html>
<html>
<head>
    <title>Roman Numerals</title>
    <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">   
    <script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>     
</head>
<body>
    <h1 class="mdl-typography--title">Roman Numerals</h1>
    <form action="/convert" method="post">
        <div class="mdl-textfield mdl-js-textfield">
            <input class="mdl-textfield__input" type="text" id="number" name="number" required />
            <label class="mdl-textfield__label" for="number">Enter a number:</label>
          </div>
          <button class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored">
            Convert!
          </button>
    </form>
</body>
</html>

از نماد برای کپی کردن کد پیشنهادی استفاده کنید و روی محتویات موجود index.html قرار دهید. در ترمینال، python3 main.py را اجرا کنید و روی پیوند کلیک کنید تا یک پنجره پیش نمایش باز شود. اکنون صفحه کمی ساده تر است:

295643ec03fcaafc.png

در صورت تمایل می توانید این کار را با فایل convert.html تکرار کنید.

Gemini Code Assist تا حدودی از CSS می‌داند، و می‌توانید از آن کمک بگیرید تا به صفحات برنامه‌ها به روش‌های مختلف سبک‌دهی کنید. این فقط یک شروع است.

از آنجایی که می خواهید این برنامه را به اشتراک بگذارید، فراموش نکنید که آن را مجدداً در Cloud Run قرار دهید:

gcloud run deploy

شما می توانید URL را به افرادی که نیاز به تبدیل به اعداد رومی دارند ارسال کنید.

9. تبریک!

تبریک می‌گوییم - شما با موفقیت با Gemini Code Assist کار کرده‌اید تا آزمایش‌هایی را به یک برنامه اضافه کنید، خطاهای آن را برطرف کنید و عملکردهای پیشرفته‌تری را اضافه کنید.

وقتی استفاده از برنامه‌ای را که می‌سازید تمام کردید، می‌توانید آن را از داشبورد کنسول ابری حذف کنید تا هرگونه هزینه احتمالی آینده را متوقف کنید.

اسناد مرجع ...