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을 알려줄 수 있습니다.

    Codex에 레포지토리, 스크린샷, 지도, 디자인 브리프, 제품 메모, 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] 결과를 알려주기 전에 로컬 빌드를 실행하고 배포가 준비되었는지 확인해 줘.

    공유하기 전에 결과 확인하기

    Codex는 무엇을 변경했는지, 어떤 명령어로 프로젝트를 빌드했는지, Vercel 배포가 준비되었는지 알려줘야 합니다. 배포에 환경 변수 설정, 팀 선택, 도메인 설정 또는 로그인이 필요하다면 사이트가 완성됐다고 말하는 대신 어떤 단계가 남았는지 명확히 알려줘야 합니다.

    미리보기 배포가 기본값입니다. 변경 사항을 프로덕션에 반영하려는 경우에만 프로덕션 배포를 명시적으로 요청하세요.

    미리보기 URL에서 수정 작업 이어가기

    미리보기가 준비되면 같은 채팅에서 작업을 이어가세요. Codex에 URL을 열어 레이아웃 문제를 수정하거나, 문구를 다듬거나, 누락된 데이터를 연결해 달라고 요청하세요. 배포가 실패했다면 Vercel 로그를 확인해 달라고 하세요. 이 채팅에는 레포지토리, 배포, 빌드에 관한 컨텍스트가 이미 있습니다.

    후속 요청은 구체적으로 작성하세요.

    • “모바일 레이아웃에서 요소들이 너무 붙어 있어. 간격을 조정하고 미리보기를 다시 배포해 줘.”
    • “같은 프로젝트에 [source]의 최신 데이터를 추가해 줘.”
    • “실패한 빌드의 로그를 확인하고 배포 문제를 해결해 줘.”

    Related use cases