Codex use case
アプリやウェブサイトのデプロイ
ウェブアプリを作成または更新し、プレビューをデプロイして公開 URL を取得します。
Codex で Build Web Apps と Vercel を使うと、リポジトリやスクリーンショット、デザイン、アプリの大まかなアイデアをもとに、実際に操作できるプレビューをデプロイして共有できます。
Best for
- スクリーンショットや地図、デザインの概要、アプリの大まかなアイデアをもとに、ブラウザで操作できるプレビューを作成したいとき
- Vercel のコマンドを手動で組み合わせずに、ブランチやローカルのアプリをデプロイしたいとき
- Codex がビルドを実行し、デプロイ結果を確認した後で、公開 URL を共有したいとき
Contents
アプリやウェブサイトのデプロイ
ウェブアプリを作成または更新し、プレビューをデプロイして公開 URL を取得します。
Codex で Build Web Apps と Vercel を使うと、リポジトリやスクリーンショット、デザイン、アプリの大まかなアイデアをもとに、実際に操作できるプレビューをデプロイして共有できます。
Codex で Build Web Apps と Vercel を使うと、リポジトリやスクリーンショット、デザイン、アプリの大まかなアイデアをもとに、実際に操作できるプレビューをデプロイして共有できます。
Related links
Best for
- スクリーンショットや地図、デザインの概要、アプリの大まかなアイデアをもとに、ブラウザで操作できるプレビューを作成したいとき
- Vercel のコマンドを手動で組み合わせずに、ブランチやローカルのアプリをデプロイしたいとき
- Codex がビルドを実行し、デプロイ結果を確認した後で、公開 URL を共有したいとき
Skills & Plugins
- React、UI、デプロイ、決済、データベースに関するガイドに沿って、ウェブアプリの開発、レビュー、公開準備を進めます。
- プレビューのデプロイ、デプロイ状況やビルドログの確認、Vercel のプロジェクト設定の管理ができます。
| Skill | Why use it |
|---|---|
| Build Web Apps | React、UI、デプロイ、決済、データベースに関するガイドに沿って、ウェブアプリの開発、レビュー、公開準備を進めます。 |
| Vercel | プレビューのデプロイ、デプロイ状況やビルドログの確認、Vercel のプロジェクト設定の管理ができます。 |
Starter prompt
サイトとデプロイ先の指定
Codex は、ウェブサイトやアプリを作成・更新し、プロジェクトのチェックを実行してから Vercel にデプロイし、アクセス用の URL を返すことができます。
依頼するときは、リポジトリ、スクリーンショット、地図、デザイン概要、製品に関するメモ、API ドキュメント、データソースなど、具体的な資料を渡します。Codex は変更を加える前にプロジェクトの内容を確認し、特に指定がなければ Vercel プラグインを使ってプレビューをデプロイします。
Codex にアプリの作成や仕上げを依頼するときは @build-web-apps を使います。デプロイの実行や状況の確認、Vercel のビルドログの確認を依頼するときは @vercel を使います。
共有前の結果確認
Codex には、変更内容、プロジェクトのビルドに使ったコマンド、Vercel へのデプロイが完了して利用できる状態かどうかを報告してもらいます。デプロイに環境変数の設定、チームの選択、ドメインの設定、ログインなどが必要な場合は、サイトが完成したと報告せず、必要な作業を明示してもらいます。
本番環境への変更は明示的に指示してください。デフォルトのデプロイ先はプレビュー環境です。本番に反映したい場合に限り、本番へのデプロイを依頼してください。
プレビュー URL を使った改善
プレビューができたら、同じチャットで作業を続けます。Codex に URL を開いてもらい、レイアウトの修正や文言の更新、まだ接続していないデータソースとの連携を依頼できます。デプロイに失敗した場合は、Vercel のログの確認を依頼できます。このチャットには、リポジトリ、デプロイ、ビルドに関する情報がすでにあります。
追加の依頼は次のように具体的に伝えます。
- 「モバイル表示では要素が詰まりすぎています。レイアウトを修正して、プレビューを再デプロイしてください。」
- 「同じプロジェクトに [source] の最新データを追加してください。」
- 「失敗したビルドのログを確認し、デプロイできるように修正してください。」
Related use cases
社内アプリの開発とデプロイ
ChatGPT Work の Sites で、特定の業務に合わせた社内アプリを作成してテストします。業務に必要であればストレージを追加し、レビュー済みのバージョンを対象の利用者と共有できます。
AI ツアーガイドの作成
Codex を使って、ウェブアプリに WebMCP...
アイデアから概念実証へ
Codex と ImageGen を使って、大まかなアイデアからデザインの方向性を決めます。実際に使える最小限のプロトタイプを実装し、ブラウザで動作を確認します。