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을 알려줄 수 있습니다.
Codex에 레포지토리, 스크린샷, 지도, 디자인 브리프, 제품 메모, 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 기반 투어를 추가하세요. 다음에 조작할 UI 요소를 강조하고 사용자가 무엇을 해야 하는지 설명하세요. 사용자가 각 단계를 직접...
프로토타입으로 아이디어 검증하기
Codex와 ImageGen으로 초기 아이디어의 디자인 방향을 정하고, 핵심 기능만 담은 프로토타입을 구현한 뒤 브라우저에서 검증하세요.