AI 程式設計教學中文版
官方教學中文版實戰場景

釋出應用或網站

說明如何讓 Codex 從 repo、screenshot、design brief 或 API doc 出發構建網站並部署 preview。

📖 本篇術語速查表
英文 / 縮寫中文一句話解釋
釋出deploy把應用 / 網站上線到生產。
預覽環境preview上生產前先驗證的臨時環境。
回復rollback出問題時退回上一版本。

不想讀完?把下面這段提示詞丟給 AI 幫你跑完——幫你規劃用 Codex 安全地釋出應用或網站(先預覽、可回復)。

你是 Codex 應用釋出規劃顧問,幫我規劃安全地釋出應用或網站,先預覽驗證、留好回復。

【角色】
你知道怎麼用 Codex 協助釋出、為什麼先用預覽環境、怎麼準備回復、釋出前要檢查什麼。

【輸入】
- 我的應用型別和部署平臺:___
- 目前釋出方式(手動 / CI):___
- 是否有預覽 / 回復機制:___
- 這次釋出的改動範圍:___

【工作流程】
1. 給釋出前檢查清單(構建 / 測試 / 設定)
2. 先發預覽環境驗證
3. 確認預覽沒問題再上生產
4. 準備回復方案

【輸出規範】
▌一、釋出前檢查清單
▌二、預覽環境驗證步驟
▌三、上生產的步驟
▌四、回復方案

【硬約束】
- 先預覽驗證再上生產,不直接發
- 生產釋出必須有回復方案
- 金鑰 / 設定走安全方式,不明文
- 高風險釋出人工確認
- 不確定的部署細節標註需查平臺文件
- 給的步驟具體可執行
- 給的每條結論都要落到具體可照做的步驟或示例,不停留在「建議」「考慮一下」這類沒法直接執行的空泛表述

Codex 可以從 repo、screenshot、map、design brief、product note、API doc 或 data source 出發,構建或更新網站,再透過 Vercel 部署 preview,並把 live URL 交回來。

官方頁面:https://developers.openai.com/codex/use-cases/deploy-app-or-website

適合什麼任務

場景Codex 應該做什麼
把 screenshot、map、design brief 或 rough app idea 做成可訪問 preview使用 @build-web-apps 構建或打磨 app,再用 @vercel 部署
部署一個 branch 或 local app,不想手動 wiring Vercel commands讓 Vercel plugin 處理 preview deployment、deployment inspection 和 build logs
需要 live URL 給別人看本地 build 透過後部署 preview,並回報可訪問 URL

使用的能力

能力用法連結
build-web-apps構建、review 和準備 web apps,覆蓋 React、UI、deployment、payments、database guidancehttps://github.com/openai/plugins/tree/main/plugins/build-web-apps
vercel部署 previews、檢查 deployments、讀取 build logs、管理 Vercel project settingshttps://github.com/openai/plugins/tree/main/plugins/vercel

相關官方說明:

起始提示詞

請使用 @build-web-apps,把 [repo、screenshot、design 或 rough app idea] 做成可執行的網站。

然後使用 @vercel 部署 preview,並把 live URL 交給我。

上下文:
- [這個網站應該做什麼]
- [要使用的 source data、API、docs 或 assets]
- [style 或 product constraints]
- [哪些內容不要改]

交付前,請先執行 local build,並確認 deployment 已 ready。

這個 prompt 要求 Codex 先構建,再 preview deploy,並且在交付前執行 local build。不要跳過本地驗證直接要 URL。

先明確站點和部署目標

有用的交接應該具體。你可以給 Codex:

  • repo。
  • screenshot。
  • map。
  • design brief。
  • product note。
  • API doc。
  • data source。

Codex 應該先 inspect project,再修改。預設部署目標應該是 Vercel preview;只有你明確要求 production,才進入生產釋出。

檢查後再分享

交付前,Codex 應該告訴你:

  • 改了什麼。
  • 用哪條 command build。
  • Vercel deployment 是否 ready。
  • 是否缺 environment variable。
  • 是否需要 team choice、domain setting 或登入步驟。
  • 如果 deploy 失敗,失敗記錄在哪裡,下一步怎麼修。

如果缺少環境變數、團隊選擇、域名設定或登入步驟,Codex 應該直接說明 blocker,而不是把站點說成已經完成。

從 live URL 繼續迭代

拿到 preview URL 後,不要換執行緒。同一執行緒已經有 repo、deployment 和 build context。

可以繼續讓 Codex:

  • 開啟 URL 檢查頁面。
  • 修 mobile layout。
  • 更新 copy。
  • 接上缺失資料。
  • 讀取 Vercel failed build logs。
  • 修復後重新部署 preview。

好的 follow-up 應該具體:

移動端 layout 太擁擠。請修復並重新部署 preview。
繼續使用同一個專案,並加入來自 [source] 的最新資料。
請讀取 failed build logs,並修復 deploy。

釋出邊界

preview deployment 是預設動作。production changes 要明確說出來,並在執行前確認:

  • 目標 project。
  • 目標 branch。
  • environment variables。
  • domain / alias 設定。
  • 是否會影響現有使用者。

Codex 適合把構建、部署和記錄診斷串起來,但生產釋出仍然應該保持顯式邊界。

本頁目錄