Prompt (指令輸入)
從一個好點子開始
在 Build 模式中，您的 Prompt 就是程式碼。賴講師建議您使用「角色 + 任務 + 限制」的黃金公式來描述您的需求。
例如：「你是一個專業的健身教練 (角色)，請幫我設計一個一週健身計畫生成器 (任務)，介面要簡潔、深色系 (限制)。」
賴講師的 Prompt 秘訣
- 具體描述功能：不要只說「好用的功能」，要說「包含計時器和進度條」。
- 指定視覺風格：明確指出「現代極簡風」或「賽博龐克風」。
Preview (即時預覽)
所見即所得
當您按下 Enter，Gemini 就會開始編寫程式碼，並在右側視窗即時渲染出應用程式的樣子。 這是一個互動的過程，您可以直接點擊按鈕、輸入文字，測試每一個功能是否如您所願。
背後的魔法
其實 Gemini 不只是生成畫面，它生成的是完整的 React 程式碼。 您可以隨時切換到 "Code View" 查看原始碼，這對於學習前端開發也是絕佳的教材。
Refine (精準微調)
Annotation Mode
覺得按鈕顏色不對？或是標題字太小？不需要重新輸入長長的 Prompt。
開啟 Annotation Mode，直接點擊您想修改的元素，然後告訴 AI：「把這個改成紅色」。
這就是 Vibe Coding 的精髓——直覺、快速、優雅。
Deploy (一鍵部署)
分享您的成果
滿意您的作品了嗎？點擊右上角的 Deploy 按鈕，Google 會自動為您生成一個公開連結。 您可以把這個連結分享給朋友、同事，甚至放在您的作品集中。 從創意到產品，就是這麼簡單。
賴講師的部署檢查清單
- 檢查 API Key：確保您的 API Key 有正確設定，且沒有暴露在前端程式碼中。
- 測試 RWD：在手機和電腦上都要測試一遍，確保版面沒有跑版。
- 設定 Meta Tags：別忘了設定標題和描述，讓分享連結更好看。
部署流程全解析
1. 點擊 Deploy 按鈕
在介面右上角找到藍色的 Deploy 按鈕。點擊後會出現部署選項選單。
2. 選擇部署方式
您可以選擇部署到 Google Cloud Run (適合正式專案) 或生成靜態連結 (適合快速分享)。
3. 獲取公開連結
等待幾秒鐘，系統會生成一個專屬的 URL。複製這個連結，您的應用程式就正式上線了！