Codex가 최고라는 소문 직접 검증합니다, 세팅부터 실전 앱 개발까지 전 과정 공개 (feat. OpenAI)

✨ 궁금하신 분들은 코덱스 직접 써보세요: https://openai.com/ko-KR/codex/
(26.05.13 라이브 편집본)

🤖 Codex 활용 바이브 코딩 리뷰 — 세팅, 스킬, 자동화, 실전 앱 개발까지
최근 대세로 떠오른 코딩 도구 Codex를 활용하여 비개발자도 쉽게 따라 할 수 있는 바이브 코딩 가이드를 소개합니다. 터미널 기반의 기초 세팅부터 YOLO 모드 설정, 그리고 이미지 생성 모델을 활용한 디자인 고도화까지 한눈에 확인하실 수 있습니다. 특히 bkit 플러그인을 활용한 사내 휴가 등록 ERP 시스템 구축과 OpenAI API 연동을 통한 실시간 미팅 회의록 전사 앱 제작 과정을 상세히 다룹니다.

⏱️ 타임스탬프 (Timestamps)
0:00 - 하이라이트 및 라이브 소개
0:44 - Codex의 대세 기능 및 /goal 기능 소개
1:44 - 터미널을 통한 Codex CLI 설치 및 초기 세팅 방법
2:26 - YOLO 모드 및 권한 설정 꿀팁
3:05 - Codex 앱과 다양한 플러그인 탐색 (피그마, 지메일 등)
4:13 - bkit 플러그인을 활용한 PDCA 방법론과 문서화의 중요성
5:24 - 이미지 스킬 및 프레젠테이션 스킬을 활용한 PPT 자동 생성
6:13 - DESIGN.md를 활용한 피그마 랜딩 페이지 디자인 고도화
7:03 - 바이브 코딩 파트 1: 회사 휴가 등록 ERP 시스템 구현 및 Vercel 배포
8:20 - AGENTS.md 시스템 가이드라인 문서 작성법
8:53 - 바이브 코딩 파트 2: /goal 기능을 활용한 실시간 미팅 기록 앱 제작
10:03 - 음성 전사 API 연동 테스트 및 최종 URL 배포 확인

🔑 핵심 요점 (Key Points)

1. Codex는 뛰어난 토큰 효율성을 자랑하며 CLI 환경에서 파워풀한 코딩 경험을 제공합니다.
2. /goal 기능을 활성화하면 AI가 목표 설정부터 검증 및 Vercel 배포까지 스스로 진행합니다.
3. 바이브 코딩의 핵심은 무작정 코딩을 시작하는 것이 아니라 상위 기획서(Plan), 상세 기획서(Design), 스타일 가이드(DESIGN.md), 시스템 규칙(AGENTS.md)의 4단계 문서를 먼저 탄탄하게 구축하는 것입니다.
4. bkit 플러그인을 활용해 PDCA 순환 구조를 만들면 에러를 최소화하고 밀도 높은 완성작을 얻을 수 있습니다.
5. 개발 지식이 부족한 비개발자도 AI 도구와 API 연동을 적절히 조합하면 상상하는 서비스를 직접 배포하고 운영할 수 있는 시대가 되었습니다.

📝 세부 내용 요약 (Section Summaries)
■ Codex CLI 특징과 초기 세팅 방법
최근 개발자들 사이에서 큰 인기를 끌고 있는 OpenAI 기반 코딩 도구 Codex의 주요 기능과 강점을 소개합니다. Codex는 토큰 효율 면에서 큰 강점을 가지며 터미널을 통해 간편하게 실행할 수 있습니다. 비개발자에게는 다소 낯설 수 있는 터미널 창을 열고 NPM 명령어를 통해 Codex CLI를 단 한 줄로 설치하는 과정을 보여줍니다. 또한 매번 승인을 요구하는 번거로움을 줄이기 위해 Full Access 권한을 부여하는 일명 YOLO 모드 설정법과 토큰을 더 소모하더라도 작업 속도를 높이는 패스트 모드 설정법을 안내합니다.

■ 플러그인 생태계와 디자인 시스템 문서 활용
Codex CLI 환경의 한계를 보완해 주는 직관적인 Codex 앱과 플러그인 생태계를 탐색합니다. 노션, 슬랙, 지메일 요약뿐만 아니라 디자이너들이 애용하는 피그마 플러그인을 연동하여 간단한 명령만으로 랜딩 페이지 시안이나 카드 뉴스를 뚝딱 만들어내는 모습을 시연합니다. 특히 전 세계 대기업들의 디자인 자산을 모아둔 getdesign.md나 국내 디자인 시스템을 활용해 DESIGN.md 문서를 생성하고 이를 참조 시켜 무미건조한 레이아웃을 완성도 높은 비주얼로 고도화하는 핵심 디자인 꿀팁을 전수합니다.

■ bkit 기반 사내 휴가 등록 ERP 구축 (바이브 코딩)
본격적인 바이브 코딩 세션에서는 bkit 플러그인을 도입하여 계획적인 개발 프로세스를 구축합니다. 성공적인 바이브 코딩을 위해서는 단순한 지시보다 사전에 상세한 계획 문서를 작성하는 것이 우월합니다. PDCA 방법론에 따라 상위 기획서인 Plan 문서를 뽑아내고 300줄이 넘는 상세 설계 기획서를 차례로 빌드합니다. 이후 프로젝트의 척추 역할을 하는 AGENTS.md 파일에 한글로 시스템 지침과 맥락을 입력합니다. 기초 하네스 세팅이 완료된 상태에서 Do 명령을 내리자 임직원 잔여 연차 확인 및 신청, 승인 대기 기능이 포함된 ERP 화면이 에러 없이 구현됩니다.

■ /goal 기능을 적용한 실시간 회의록 앱 전사 및 최종 배포
두 번째 프로덕트로 OpenAI API 키를 env 파일에 연동하여 마이크 음성을 실시간으로 텍스트로 바꿔주는 미팅 회의록 앱을 제작합니다. 이번 단계에서는 특별히 수동 제어 대신 목표만 던지면 끝까지 검증하는 /goal 기능을 활용합니다. 시연 도중 API 호출 주소 문제로 UI가 깨지거나 전사 실패가 뜨는 시연의 저주를 겪기도 하지만 Codex에게 재배포 및 재검증 지시를 내려 스스로 에러를 해결하도록 유도합니다. 결국 482초 만에 완벽한 전사 기능과 깔끔한 일레븐랩스 스타일의 UI를 갖춘 앱을 완성하고 로컬 호스트를 넘어 Vercel 프로덕션 환경에 최종 배포된 URL까지 성공적으로 확보합니다.

----

[조쉬의 뉴스레터 및 소셜 미디어]

🗞️ 조쉬의 뉴스레터 (1만명 이상 구독 중)
뉴스레터를 구독하고, 가장 빨리 AI 인사이트를 받아보세요!
https://maily.so/josh

🔗 소셜 미디어 (도합 3만 이상)
Threads: https://www.threads.com/@joshproductletter
LinkedIn: https://www.linkedin.com/in/uxjosh/

🚀 ASC 모집 (연간 멤버십 프로그램)
조쉬의 '실행' 중심 연간 멤버십 프로그램 모집 정보를 확인하세요!
https://www.solopreneur.co.kr/