1. ภาพรวม
การสร้างด้วย AI เริ่มต้นที่ใดในปัจจุบัน สำหรับพวกเราส่วนใหญ่ การสร้างเริ่มต้นด้วยคำถามง่ายๆ ว่า ฉันจะสร้างต้นแบบโซลูชันสำหรับปัญหาที่คิดไว้ได้อย่างรวดเร็วไหม และนี่คือสาเหตุที่ต้องมี Google AI Studio ซึ่งเป็นแพลตฟอร์มสำหรับการสร้างต้นแบบอย่างรวดเร็ว ใน Codelab นี้ คุณจะได้สร้างเว็บแอปพลิเคชันอย่างง่ายโดยใช้การเขียนโค้ดแบบ Vibe และทำให้ใช้งานได้ใน Cloud Run
ข้อกำหนดเบื้องต้น
- มีความเข้าใจพื้นฐานเกี่ยวกับเว็บแอปพลิเคชัน
สิ่งที่คุณจะได้เรียนรู้
ใน Codelab นี้ คุณจะได้เรียนรู้วิธีการต่อไปนี้
- สร้างเว็บแอปพลิเคชันอย่างง่ายใน Google AI Studio โดยใช้การเขียนโค้ดแบบ Vibe
- ทดสอบว่าแอปพลิเคชันทำงานตามที่คาดไว้
- ทำให้แอปพลิเคชันใช้งานได้ใน Cloud Run
ข้อกำหนด
2. ก่อนเริ่มต้น
- หากยังไม่มีบัญชี Google คุณต้องสร้างบัญชี Google
- ใช้บัญชีส่วนตัวแทนบัญชีงานหรือบัญชีโรงเรียน บัญชีงานและบัญชีโรงเรียนอาจมีข้อจำกัดที่ป้องกันไม่ให้คุณเปิดใช้ API ที่จำเป็นสำหรับแล็บนี้
- ไปที่ Google AI Studio แล้วอ่านข้อกำหนดในการให้บริการ
- โปรดทราบว่าหากคุณใช้ Google Cloud Starter Tier คุณจะทำให้แอปพลิเคชันแบบ Full-Stack ใช้งานได้สูงสุด 2 รายการ ในภูมิภาค Cloud Run เดียวโดยไม่ต้องตั้งค่าสภาพแวดล้อม Google Cloud แบบเต็มหรือบัญชีสำหรับการเรียกเก็บเงิน

3. ต้นแบบ
ใน Google AI Studio ให้ใช้เวลาสักครู่เพื่อดูแผงการตั้งค่า ที่มุมขวาบน ซึ่งคุณสามารถเลือกโมเดลและเฟรมเวิร์กเริ่มต้น รวมถึงระบุคำแนะนำของระบบได้ที่นี่

เมื่อพอใจกับการตั้งค่าแล้ว ให้อธิบายแอปพลิเคชัน ที่ต้องการสร้าง แล้วคลิกสร้าง
Create a formal looking frontend application that has two buttons: "Snowflakes" and "Balloons".
If the user clicks on the "Snowflakes" button, snowflakes of medium size should start falling on the screen from top to bottom for 5 seconds.
If the user clicks on the "Balloons" button, balloons of medium size should start floating from the bottom of the screen and float to the top for 5 seconds.

AI Studio จะสร้างเว็บแอปพลิเคชันตามคำอธิบายนี้ กระบวนการสร้างใช้เวลา 2-3 นาที และระบบอาจแจ้งให้คุณเลือกตัวเลือกการออกแบบระหว่างกระบวนการ

หากพบปัญหาเกี่ยวกับแอปพลิเคชัน คุณสามารถป้อนข้อความแจ้งเพิ่มเติมเพื่อปรับแต่งลักษณะการทำงานของแอปพลิเคชันได้ (เช่น Increase the size of the snowflakes to twice their current size)
รูปภาพต่อไปนี้แสดงภาพรวมของแอปพลิเคชันที่สร้างขึ้น

4. ทำให้ใช้งานได้กับ Cloud Run
เมื่อแอปพลิเคชันพร้อมแล้ว ให้ทำให้ใช้งานได้ใน Cloud Run โดยทำดังนี้
- คลิกเผยแพร่ ที่มุมขวาบนของหน้า

- ซึ่งจะเปิดกล่องโต้ตอบทำให้แอปใช้งานได้ใน Google Cloud

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

- คลิกเผยแพร่แอป แล้วรอให้แอปพลิเคชันทำให้ใช้งานได้ใน Cloud Run โปรดทราบว่า AI Studio จะสร้างชื่อบริการ Cloud Run โดยอัตโนมัติ

- การทำให้ใช้งานได้จะใช้เวลา 2-3 นาที เมื่อเสร็จสมบูรณ์แล้ว ให้คลิกURL ของแอป เพื่อเปิดเว็บแอปพลิเคชันที่ทำให้ใช้งานได้

5. ล้างข้อมูล
หากต้องการหลีกเลี่ยงการเรียกเก็บเงินกับบัญชี Google Cloud สำหรับทรัพยากรที่ใช้ใน Codelab นี้ ให้คลิกยกเลิกการเผยแพร่แอป

6. ขอแสดงความยินดี
ขอแสดงความยินดี คุณเขียนโค้ดแบบ Vibe สำหรับเว็บแอปพลิเคชันใน Google AI Studio และทำให้ใช้งานได้ใน Cloud Run สำเร็จแล้ว
การผสานรวม AI Studio กับ Cloud Run ช่วยให้ทำให้แอปพลิเคชันใช้งานได้ใน Google Cloud ได้อย่างง่ายดาย การใช้ Cloud Run จะช่วยให้คุณได้รับประโยชน์ทั้งหมดจากสภาพแวดล้อมแบบ Serverless ซึ่งจะช่วยลดความซับซ้อนของการจัดการโครงสร้างพื้นฐาน
ขั้นตอนถัดไป
ขอแสดงความยินดีที่ทำแล็บนี้เสร็จสมบูรณ์ เมื่อเฟรมเวิร์กแอปพลิเคชันพร้อมแล้ว ให้สำรวจคำแนะนำอย่างเป็นทางการต่อไปนี้เพื่อขยายขีดความสามารถของโปรเจ็กต์
เอกสารและคำแนะนำที่แนะนำ
- กลยุทธ์การออกแบบข้อความแจ้ง: เรียนรู้หลักการสำคัญของการจัดโครงสร้างข้อความแจ้ง การใช้คำแนะนำของระบบ การใช้ตัวอย่างแบบ Few-Shot และการควบคุมรูปแบบเอาต์พุต
- การเรียกใช้ฟังก์ชันด้วย Gemini API: เชื่อมต่อการทำให้ใช้งานได้กับเครื่องมือและ API ภายนอก เพื่อให้โมเดล Gemini แสดงข้อมูลที่มีโครงสร้างและทริกเกอร์ตรรกะของแอปพลิเคชันในโลกจริง
- การสร้างข้อความเป็นคำพูด: เรียนรู้วิธีสร้างเสียงพูดโดยใช้ Gemini API, ควบคุมรูปแบบการพูด และทดสอบเสียงโดยใช้คลังเสียงใน Google AI Studio