ข้อมูลเบื้องต้นเกี่ยวกับการทดสอบด้วย Gemini Code Assist

1. เกริ่นนำ

ในห้องทดลองนี้ คุณจะใช้ Gemini Code Assist ซึ่งเป็นผู้ทำงานร่วมกันที่ทำงานด้วยระบบ AI ใน Google Cloud เพื่อเพิ่มการทดสอบไปยังเว็บแอปพลิเคชัน Python ที่มีอยู่ ตลอดจนค้นหาและแก้ไขข้อผิดพลาดในแอปพลิเคชันดังกล่าวที่การทดสอบแสดงให้เห็น จากนั้นใช้ Code Assist เพื่อสร้างการทดสอบสำหรับฟังก์ชันการทำงานใหม่ ตลอดจนสร้างโค้ดให้ผ่านการทดสอบเหล่านั้นและขยายแอป

สิ่งที่คุณต้องทำ

  • คุณจะใช้ Cloud Shell Editor เพื่อดาวน์โหลดโค้ดสำหรับเว็บแอปพลิเคชันที่มีอยู่
  • คุณจะใช้ Gemini Code Assist Chat ใน Cloud Shell Editor เพื่อถามคำถามทั่วไปเกี่ยวกับ Google Cloud
  • คุณจะใช้ความช่วยเหลือเกี่ยวกับโค้ดแบบอินไลน์สำหรับ Gemini Code Assist ใน Cloud Shell Editor เพื่อสร้างการทดสอบสำหรับแอปพลิเคชัน ทำการทดสอบ ค้นหาและแก้ไขข้อผิดพลาด จากนั้นขยายฟังก์ชันการทำงานของแอปพลิเคชัน

สิ่งที่คุณจะได้เรียนรู้...

  • วิธีใช้ Gemini Code Assist สำหรับงานต่างๆ ของนักพัฒนาซอฟต์แวร์ เช่น การสร้างการทดสอบและการสร้างโค้ด
  • วิธีใช้ Gemini Code Assist เพื่อดูข้อมูลเกี่ยวกับ Google Cloud

สิ่งที่ต้องมี...

  • เว็บเบราว์เซอร์ Chrome
  • บัญชี Gmail
  • โปรเจ็กต์ที่อยู่ในระบบคลาวด์ที่เปิดใช้การเรียกเก็บเงิน
  • เปิดใช้ Gemini Code Assist สำหรับโปรเจ็กต์ที่อยู่ในระบบคลาวด์ของคุณแล้ว

ห้องทดลองนี้มีเป้าหมายสำหรับนักพัฒนาทุกระดับ รวมถึงผู้เริ่มต้น แม้ว่าแอปพลิเคชันตัวอย่างจะอยู่ในภาษา Python แต่คุณไม่จําเป็นต้องมีความคุ้นเคยกับการเขียนโปรแกรม Python เพื่อทําความเข้าใจถึงสิ่งที่เกิดขึ้น สิ่งที่เรามุ่งเน้นคือการทำความคุ้นเคยกับความสามารถของ Gemini Code Assist สำหรับนักพัฒนาซอฟต์แวร์

2. ตั้งค่า

คุณควรมีโปรเจ็กต์ที่อยู่ในระบบคลาวด์ที่เปิดใช้การเรียกเก็บเงินอยู่แล้วเพื่อใช้กับห้องทดลองนี้ ตอนนี้เราจะเปิดใช้ Gemini API ในโปรเจ็กต์ Google Cloud แล้ว โปรดทำตามขั้นตอนต่อไปนี้

  1. ไปที่ https://console.cloud.google.com และตรวจสอบว่าได้เลือกโปรเจ็กต์ Google Cloud ที่คุณวางแผนจะใช้งานสำหรับห้องทดลองนี้แล้ว คลิกไอคอน Gemini ที่คุณเห็นที่ด้านขวาบน

GeminiBanner.png

  1. หน้าต่างคอนโซล Gemini for Cloud จะเปิดขึ้นทางด้านขวาของคอนโซล คลิกที่ปุ่มเปิดใช้ หากแสดงอยู่ด้านล่าง หากไม่เห็นปุ่มเปิดใช้ แต่เห็นอินเทอร์เฟซ Chat แทน แสดงว่าคุณเปิดใช้ Gemini for Cloud สำหรับโปรเจ็กต์แล้ว และจะไปยังขั้นตอนถัดไปได้โดยตรง

GeminiApiEnable.png

  1. เมื่อเปิดใช้งานแล้ว คุณสามารถทดสอบ Gemini ด้วยการถามข้อความค้นหา 1-2 รายการ ตัวอย่างคำค้นหาแสดงอยู่ 2-3 รายการ แต่คุณลองใช้คำสั่งอย่างเช่น Cloud Run คืออะไร

GeminiChatWindow.png

Code Assist จะตอบกลับพร้อมคำตอบสำหรับคำถามของคุณ คุณคลิกไอคอน f68286b2b2ea5c0a.png ที่มุมขวาบนเพื่อปิดหน้าต่างแชทของ Code Assist ได้

เปิดใช้ Gemini ใน Cloud Shell Editor

Gemini Code Assist มีให้ใช้งานและมีลักษณะการทำงานคล้ายกันใน IDE ยอดนิยมหลายรายการ คุณจะใช้ Google Cloud Shell Editor ซึ่งทำงานโดยสมบูรณ์ในเว็บเบราว์เซอร์ใน Codelab นี้ คุณต้องเปิดใช้และกำหนดค่า Gemini ใน Cloud Shell Editor โดยทำตามขั้นตอนด้านล่าง

  1. เปิด Cloud Shell ผ่านไอคอนที่แสดงด้านล่าง การเริ่มต้นอินสแตนซ์ Cloud Shell อาจใช้เวลา 1-2 นาที

72dc3df7b007fcde.png

  1. คลิกปุ่มเอดิเตอร์หรือเปิดเครื่องมือแก้ไข (ตามแต่ละกรณี) และรอจนกว่า Cloud Shell Editor จะปรากฏขึ้น หากคุณเห็นปุ่มลองใช้เครื่องมือแก้ไขใหม่ ให้คลิกปุ่มนั้น

CloudShellEditor.png

  1. คลิกปุ่ม Cloud Code - ลงชื่อเข้าใช้ในแถบสถานะด้านล่างดังที่แสดง ให้สิทธิ์ปลั๊กอินตามวิธีการ หากคุณเห็น "Cloud Code - ไม่มีโปรเจ็กต์" ในแถบสถานะ ให้เลือกโปรเจ็กต์นั้น แล้วเลือกโปรเจ็กต์ Google Cloud ที่ต้องการจากรายการโปรเจ็กต์ที่คุณวางแผนว่าจะใช้งานด้วย

CloudCodeSignIn.png

  1. หากไม่เห็นไอคอน Gemini ในแถบสถานะด้านขวาล่าง คุณจะต้องเปิดใช้ไอคอนดังกล่าวใน Cloud Code ก่อนดำเนินการ โปรดตรวจสอบว่าได้เปิดใช้ Gemini (ก่อนหน้านี้เรียกว่า Duet AI for Developers) ใน IDE โดยไปที่ส่วนขยาย Cloud Code → การตั้งค่า แล้วป้อนข้อความ Duet AI: เปิดใช้ตามที่แสดงด้านล่าง ตรวจสอบว่าได้เลือกช่องทำเครื่องหมายแล้ว คุณควรโหลด 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 ทางด้านซ้ายของตัวแก้ไข หน้าต่าง 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 Editor ได้ทำสิ่งมหัศจรรย์เล็กน้อย แอปพลิเคชันกำลังทำงานใน Cloud Shell ไม่ใช่ในคอมพิวเตอร์ของคุณเอง เมื่อคุณคลิกลิงก์ดังกล่าว จะเป็นการเปิดแท็บที่ไม่ใช่ที่อยู่จริงในเครื่อง http://127.0.0.1:8080 แต่ไปยังพร็อกซีเซิร์ฟเวอร์ที่ Cloud Shell ตั้งค่าไว้เพื่อวัตถุประสงค์นี้เท่านั้น ผลที่ได้จะเหมือนกับว่าคุณใช้งานในเครื่องจริงๆ

ลองใช้เลย ป้อน 25 แล้วกดแปลง!

e1b9d5832f6d0058.png

ใช่แล้ว 25 คือ XXV เป็นเลขโรมัน! คุณต้องทำที่นี่

ลองตรวจสอบตัวเลขอีกสัก 2-3 อันนะ 25 คนได้ผล แล้วอีก 24 ล่ะ

37982e385e17baac.png

บางทีเราอาจรีบเร่งที่จะคิดว่าทุกอย่างเรียบร้อยดี XXIIII เป็นการแปลงค่า 24 ที่ถูกต้องไหม ควรเป็น XXIV ไม่ได้หรือ

ในกรณีที่ XXIIII เป็นความจริง แต่นี่ไม่ใช่สิ่งที่ผู้คนมักคาดหวัง เนื่องจากไม่ได้ผิดจริงๆ (โปรดทราบว่านาฬิกาหลายเรือนแสดงเลข 4 เป็นเลขโรมัน IIII) จึงควรนำประเด็นดังกล่าวออกสำหรับการปรับปรุงในอนาคต

ลองตัวเลขติดลบไหม ศูนย์ใช่ไหม ไม่มีวิธีการแสดงตัวเลขเหล่านั้นเป็นเลขโรมัน ผู้ใช้ไม่มีอะไรเข้ามาเลย ซึ่งดูเหมือนเป็นข้อผิดพลาดที่ต้องแก้ไข

การทดสอบสามารถช่วยค้นหาและกำจัดข้อผิดพลาดได้ และ Gemini Code Assist ช่วยเราเขียนและใช้การทดสอบได้ด้วย

5. การเพิ่มการทดสอบ

กลับไปที่หน้าต่างแชท Gemini แล้วถาม

How can I test the number_to_roman function?

อ่านคำตอบอย่างละเอียด ซึ่งควรมีการพูดคุยถึงโมดูล unittest และโมดูล pytest

คุณอาจต้องการให้ Gemini Code Assist เขียนการทดสอบเหล่านี้ให้คุณจริงๆ เปิด calendar.py ซึ่งมีโค้ด Conversion จริงอยู่ จากนั้นในเครื่องมือแก้ไข จากนั้นกลับไปที่หน้าต่างแชท Gemini แล้วถามอีกครั้ง

How can I test the number_to_roman function?

คำตอบมีความเฉพาะเจาะจงมากขึ้น รวมถึงการรวมโมดูล unittest ที่คุณคัดลอกหรือแทรกลงในไฟล์ใหม่ได้

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 จะมีการอัปเดตเป็นครั้งคราว ดังนั้นคำตอบจึงอาจไม่เหมือนเดิมเสมอไป หากคุณเห็นรหัสชุดอื่น ตอนนี้คุณสามารถเลือกว่าจะใช้ตัวอย่างที่แสดงใน Codelab นี้ต่อไปหรือไม่โดยการคัดลอกโค้ดที่แสดงที่นี่ หรือคุณจะลองใช้คำตอบ Gemini Code Assist ก็ได้ หากคุณมีเวลา คุณอาจลองใช้ทั้ง 2 เส้นทางก็ได้ Gemini Code Assist เป็นผู้ช่วยการเขียนโค้ดที่ให้คุณใช้ได้ตามความเหมาะสม

คลิกลูกศรชี้คู่ที่มุมขวาบนของหน้าต่างแชทใน Gemini เพื่อสร้างไฟล์ใหม่ที่มีรหัสการทดสอบหน่วย หรือใช้ IDE เพื่อสร้างไฟล์ใหม่และวางโค้ดที่แสดงในห้องทดลองนี้ กด Ctrl-S หรือ CMD-S ในหน้าต่างนั้นเพื่อบันทึก และเรียกไฟล์ที่บันทึกไว้ calendar-unittest.py

กลับไปที่เทอร์มินัลและกด Ctrl-C เพื่อหยุดเว็บเซิร์ฟเวอร์ที่คุณเรียกใช้ไว้ก่อนหน้านี้ และรับข้อความแจ้งของ Shell ป้อนคำสั่ง

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 นี้ที่unauthenticated ตัวเลือกการตรวจสอบสิทธิ์ที่ 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

คำตอบค่อนข้างซับซ้อน มีโมดูลมาตรฐานที่รวมอยู่ใน Python3 ชื่อ calendar เช่นเดียวกับไฟล์ calendar.py ที่มีการกำหนดฟังก์ชัน number_to_roman เมื่อ Python ค้นหาโมดูลที่ชื่อ calendar ในเครื่องของคุณ Python จะค้นหาไดเรกทอรีของแอปพลิเคชันก่อน เห็นได้ชัดว่า Python บน 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 นี้ และทุกคนที่ต้องการเครื่องมือแปลงเลขโรมันจะสามารถใช้ 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 ได้สำเร็จเพื่อเพิ่มการทดสอบไปยังแอปพลิเคชัน แก้ไขข้อผิดพลาดในแอปพลิเคชัน และเพิ่มฟังก์ชันการทำงานที่มีประสิทธิภาพยิ่งขึ้น

เมื่อใช้แอปพลิเคชันที่คุณสร้างเสร็จแล้ว คุณสามารถลบแอปพลิเคชันออกจากหน้าแดชบอร์ดของ Cloud Console เพื่อหยุดการเรียกเก็บเงินที่อาจเกิดขึ้นในอนาคต

เอกสารอ้างอิง...