For the complete documentation index, see llms.txt. Markdown versions of documentation pages are available by appending .md to the page URL.
メインナビゲーション
Theme
Codex

Codex use case

アプリやウェブサイトのデプロイ

ウェブアプリを作成または更新し、プレビューをデプロイして公開 URL を取得します。

Difficulty Intermediate
Time horizon 30m

Codex で Build Web Apps と Vercel を使うと、リポジトリやスクリーンショット、デザイン、アプリの大まかなアイデアをもとに、実際に操作できるプレビューをデプロイして共有できます。

Best for

  • スクリーンショットや地図、デザインの概要、アプリの大まかなアイデアをもとに、ブラウザで操作できるプレビューを作成したいとき
  • Vercel のコマンドを手動で組み合わせずに、ブランチやローカルのアプリをデプロイしたいとき
  • Codex がビルドを実行し、デプロイ結果を確認した後で、公開 URL を共有したいとき

Contents

    ← All use cases

    アプリやウェブサイトのデプロイ

    ウェブアプリを作成または更新し、プレビューをデプロイして公開 URL を取得します。

    Codex で Build Web Apps と Vercel を使うと、リポジトリやスクリーンショット、デザイン、アプリの大まかなアイデアをもとに、実際に操作できるプレビューをデプロイして共有できます。

    Intermediate
    30m

    Codex で Build Web Apps と Vercel を使うと、リポジトリやスクリーンショット、デザイン、アプリの大まかなアイデアをもとに、実際に操作できるプレビューをデプロイして共有できます。

    Intermediate
    30m

    Best for

    • スクリーンショットや地図、デザインの概要、アプリの大まかなアイデアをもとに、ブラウザで操作できるプレビューを作成したいとき
    • Vercel のコマンドを手動で組み合わせずに、ブランチやローカルのアプリをデプロイしたいとき
    • Codex がビルドを実行し、デプロイ結果を確認した後で、公開 URL を共有したいとき

    Skills & Plugins

    • React、UI、デプロイ、決済、データベースに関するガイドに沿って、ウェブアプリの開発、レビュー、公開準備を進めます。
    • プレビューのデプロイ、デプロイ状況やビルドログの確認、Vercel のプロジェクト設定の管理ができます。
    Skill Why use it
    Build Web Apps React、UI、デプロイ、決済、データベースに関するガイドに沿って、ウェブアプリの開発、レビュー、公開準備を進めます。
    Vercel プレビューのデプロイ、デプロイ状況やビルドログの確認、Vercel のプロジェクト設定の管理ができます。

    Starter prompt

    @build-web-apps を使い、[repo, screenshot, design, or rough app idea] をもとに、実際に動作するウェブサイトを作成してください。 次に、@vercel を使ってプレビューをデプロイし、公開 URL を教えてください。 コンテキスト: - [what the site should do] - [source data, API, docs, or assets to use] - [style or product constraints] - [anything not to change] URL を知らせる前に、ローカルでビルドを実行し、デプロイしたプレビューにアクセスできることを確認してください。
    @build-web-apps を使い、[repo, screenshot, design, or rough app idea] をもとに、実際に動作するウェブサイトを作成してください。 次に、@vercel を使ってプレビューをデプロイし、公開 URL を教えてください。 コンテキスト: - [what the site should do] - [source data, API, docs, or assets to use] - [style or product constraints] - [anything not to change] URL を知らせる前に、ローカルでビルドを実行し、デプロイしたプレビューにアクセスできることを確認してください。

    サイトとデプロイ先の指定

    Codex は、ウェブサイトやアプリを作成・更新し、プロジェクトのチェックを実行してから Vercel にデプロイし、アクセス用の URL を返すことができます。

    依頼するときは、リポジトリ、スクリーンショット、地図、デザイン概要、製品に関するメモ、API ドキュメント、データソースなど、具体的な資料を渡します。Codex は変更を加える前にプロジェクトの内容を確認し、特に指定がなければ Vercel プラグインを使ってプレビューをデプロイします。

    Codex にアプリの作成や仕上げを依頼するときは @build-web-apps を使います。デプロイの実行や状況の確認、Vercel のビルドログの確認を依頼するときは @vercel を使います。

    @build-web-apps を使って、[repo, screenshot, design, or rough app idea] をもとに動作するウェブサイトを作成してください。 次に、@vercel を使ってプレビューをデプロイし、アクセスできる URL を教えてください。 コンテキスト: - [what the site should do] - [source data, API, docs, or assets to use] - [style or product constraints] - [anything not to change] URL を渡す前に、ローカルでビルドを実行し、デプロイしたプレビューにアクセスできることを確認してください。

    共有前の結果確認

    Codex には、変更内容、プロジェクトのビルドに使ったコマンド、Vercel へのデプロイが完了して利用できる状態かどうかを報告してもらいます。デプロイに環境変数の設定、チームの選択、ドメインの設定、ログインなどが必要な場合は、サイトが完成したと報告せず、必要な作業を明示してもらいます。

    本番環境への変更は明示的に指示してください。デフォルトのデプロイ先はプレビュー環境です。本番に反映したい場合に限り、本番へのデプロイを依頼してください。

    プレビュー URL を使った改善

    プレビューができたら、同じチャットで作業を続けます。Codex に URL を開いてもらい、レイアウトの修正や文言の更新、まだ接続していないデータソースとの連携を依頼できます。デプロイに失敗した場合は、Vercel のログの確認を依頼できます。このチャットには、リポジトリ、デプロイ、ビルドに関する情報がすでにあります。

    追加の依頼は次のように具体的に伝えます。

    • 「モバイル表示では要素が詰まりすぎています。レイアウトを修正して、プレビューを再デプロイしてください。」
    • 「同じプロジェクトに [source] の最新データを追加してください。」
    • 「失敗したビルドのログを確認し、デプロイできるように修正してください。」

    Related use cases