1. 總覽
從今天起，您可以在哪些方面開始使用 AI 建構內容？對大多數人來說，通常會先問一個簡單的問題：「我能不能快速製作解決方案的原型，解決我一直在思考的問題？」這時 Google AI Studio 就能派上用場。您可以在這裡快速設計任何內容的原型。在本程式碼研究室中，我們將使用 vibe 編碼組建簡單的 Web 應用程式，並部署至 Cloud Run。
建構項目
準備好直覺編寫網頁應用程式，並開放其他人試玩了嗎？我們將建立網頁應用程式並部署至 Cloud Run，全程只使用 AI Studio。在本實驗室中，您將：
- 使用 Vibe 程式碼建構簡單的 Web 應用程式
- 測試應用程式是否正常運作
- 在 Cloud Run 上部署應用程式
需求條件
2. 事前準備
- 在 Google Cloud 控制台的專案選取器頁面中，選取或建立 Google Cloud 專案。
- 確認 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.
選擇所需機型。我們在此使用 Gemini 3 Pro 預先發布版。按一下「Build」(建構) 按鈕。
根據這段簡單的描述，AI Studio 會建構完全符合您描述的網頁應用程式。應用程式會在 2 到 3 分鐘內生成。
如果發現應用程式有任何問題，歡迎提供其他提示來修正應用程式的行為。例如，將雪花的大小增加為目前的兩倍。
請參閱下方生成的應用程式快照：
4. 部署至 Cloud Run
應用程式已準備就緒，現在請將其部署至 Cloud Run。
- 按一下 AI Studio 頁面右上角的火箭圖示按鈕。將滑鼠游標懸停在按鈕上時，按鈕會顯示「Deploy app」。
- 系統會開啟「在 Google Cloud 上部署應用程式」彈出式視窗。
- 按一下「選取 Cloud 專案」下拉式選單。
- 從下拉式選單中選取專案。如果無法在下拉式選單中找到專案，請按一下「匯入專案」，然後從「匯入專案」窗格中選取專案。
- 選取專案後，系統會驗證專案是否已啟用計費功能。由於我們在初始步驟中已將帳單帳戶連結至專案，因此這項驗證會通過。
- 按一下「Deploy app」按鈕，然後等待應用程式部署至 Cloud Run。
請注意，系統會自動產生 Cloud Run 服務名稱。
- 部署作業應會在幾分鐘內完成，並取得應用程式網址。點選網址即可查看已部署的網頁應用程式。
5. 清除所用資源
如要避免系統向您的 Google Cloud 帳戶收取本文章所用資源的費用，請按照下列步驟操作：
6. 恭喜
恭喜！您已成功在 AI Studio 完成直覺式程式開發應用程式，並部署至 Cloud Run！
AI Studio 是開發及測試應用程式的理想平台，使用者可立即查看設計的實際效果。
AI Studio 與 Cloud Run 完美整合，讓使用者能輕鬆將應用程式直接部署到 Google Cloud。使用 Cloud Run 可享有無伺服器環境的所有優勢，省去基礎架構管理作業的複雜性和額外負擔。