내 아이디어 구현하기 | Practice
AI 협업 워크플로우를 본인 아이디어에 적용해 Spec 작성부터 Vercel 배포까지 완성합니다
마지막 업데이트: 2026. 8. 9.
Overview
AI 협업 워크플로우를 Feedme 클론으로 처음부터 끝까지 경험했습니다. 이제 본인이 만들고 싶은 프로젝트에 같은 워크플로우를 적용합니다. 작업이 둘 이상으로 늘어나면 Worktree로 작업 나누기에서 익힌 대로 세션을 나눠 동시에 진행해도 좋습니다.
어떤 프로젝트를 선택하고, 3시간 안에 닫을 수 있는 크기인지 판단하는 일이 이번 실습의 핵심입니다.
학습 목표
- 본인 프로젝트 아이디어를 실습 가능한 크기로 좁힙니다.
- AI 협업 워크플로우를 처음부터 끝까지 독립적으로 완주합니다.
- 막혔을 때 어디로 돌아가야 하는지 판단합니다.
시작하기 전 확인사항
- 본인 사이드 프로젝트를 담을 새 GitHub 저장소를 프로젝트 셋업 레슨 절차에 따라
claude-code-playbook-template에서 만들고 Vercel 첫 배포까지 확인합니다. - 사용할 외부 API 키(Gemini·Supabase·공공데이터 등)가 있다면 미리 발급받아
.env.local에 넣어둡니다. 자세한 키 등록 방법은 본문의 배포 시 환경 변수 설정하기에서 다룹니다.
한 사이클에 끝나는 크기로 좁히기
이 실습의 목적은 큰 프로젝트가 아니라 배포 가능한 결과를 완성하는 것입니다. 3시간 안에 요구사항부터 Vercel 배포까지 끝낼 수 있는 크기를 선택합니다.
| 항목 | 권장 |
|---|---|
| 페이지 수 | 2~3개 |
| 핵심 기능 | 1~2개 |
| 시나리오 | 5~7개 |
프로젝트 크기 조절이 가장 중요합니다
먼저 3시간 안에 배포 가능한 결과 하나를 완성하세요. 기능을 더 넣고 싶다면 다음 작업에서 확장합니다.
아이디어 찾기
아이디어가 바로 떠오르지 않아도 됩니다. 두 가지 진입로가 있습니다.
/discover-opportunity로 기회 찾기 (선택)
무엇을 만들지 정하지 못했다면 먼저 불편한 점이나 관심 분야에서 해결할 기회를 찾습니다.
/discover-opportunityAI가 후보를 조사하고 비교하면 만들 문제와 방향을 하나 선택합니다. 별도 문서를 만들지 않고, 선택한 방향을 이어서 /shape-idea로 구체화합니다.
직접 정리하기
요구사항이 이미 구체적이라면 5~10줄 마크다운으로 직접 적고 곧장 /shape-idea로 갑니다. Feedme 실습에서 본 examples/requirements.md 형태가 좋은 본보기입니다.
무료로 쓸 만한 AI·API 살피기
요즘 사이드 프로젝트는 AI 기능 한 줄만 붙여도 결과물이 크게 달라집니다. 아래는 모두 신용카드 없이 시작할 수 있고, 키 발급도 보통 5분 안에 끝납니다.
AI·LLM
| 서비스 | 무료 한도 | 사이드 프로젝트엔? | 어디에 쓰면 좋은가 |
|---|---|---|---|
| Google Gemini | AI Studio 콘솔에서 현재 무료 티어 한도 확인 | 충분 | 가장 추천하는 시작점. 요약·분류·생성 전반 |
| Groq | 분당 30번 (Llama 계열) | 충분, 속도가 빠름 | 스트리밍 데모처럼 응답 속도가 핵심일 때 |
| OpenRouter | 일부 모델 (DeepSeek·Llama 등) 완전 무료 | 충분, 모델 비교용 | 여러 모델을 한 키로 비교해 보고 싶을 때 |
Backend·Database
| 서비스 | 무료 한도 | 어디에 쓰면 좋은가 |
|---|---|---|
| Supabase | 프로젝트 2개, DB 500MB, Auth 무료 MAU 한도 넉넉 | Postgres + Auth + Storage가 한 묶음. CRUD가 필요한 사이드 프로젝트에 자주 쓰는 조합 |
Supabase는 Claude Code 플러그인이 있습니다
공식 Supabase 플러그인을 설치하면 Claude Code로 Supabase 프로젝트를 직접 다룰 수 있습니다. 테이블 생성·마이그레이션·쿼리 실행을 채팅으로 던질 수 있어, 스키마 설계 단계에서 SQL을 직접 작성하지 않아도 됩니다.
claude-plugins-official 마켓플레이스가 기본 등록돼 있어 설치는 한 줄입니다.
/plugin install supabase@claude-plugins-official설치 직후에는 바로 안 잡힐 수 있으니 /reload-plugins로 다시 읽어옵니다.
해외 데이터·이미지
| 서비스 | 인증 | 어디에 쓰면 좋은가 |
|---|---|---|
| Open-Meteo | 없음 | 날씨 데이터. 사실상 무제한 |
| REST Countries | 없음 | 국가 정보 (국기·통화·언어 등) |
| NASA APIs | 이메일로 키 발급 | 오늘의 우주 사진, 화성 로버 사진 등 |
| Unsplash | 회원가입 + 앱 등록 | 고화질 이미지 시간당 50번 호출 |
한국 데이터
| 서비스 | 인증 | 어디에 쓰면 좋은가 |
|---|---|---|
| 공공데이터포털 | 회원가입 + API별 활용신청 | 기상청 단기예보, 미세먼지, 박스오피스, 실시간 버스 등 수천 개 |
| 카카오 디벨로퍼스 | 앱 등록 (REST 키) | 카카오 지도, 로컬 (장소 검색), 카카오 로그인 |
| 네이버 개발자센터 | 앱 등록 (Client ID/Secret) | 블로그·뉴스·책 검색, 파파고 번역 |
| 서울 열린데이터광장 | 회원가입 + 키 발급 | 따릉이, 지하철 혼잡도, 문화행사 |
| 한국은행 ECOS | 회원가입 + 키 발급 | 환율, 금리, 물가지수 |
AI와 데이터 조합 예시
혼자서는 평범해 보이는 API도 AI와 조합하면 결과물이 확 달라집니다.
- Gemini + Open-Meteo: 오늘 날씨에 맞춰 옷차림을 한 줄로 추천하는 AI 비서
- Gemini + 기상청 단기예보: 한국 위치 기반으로 "오늘 우산 챙겨?" 답해주는 챗봇
- Gemini + 카카오 로컬 API: "강남역 근처 조용한 카페 3곳"을 골라주는 AI 큐레이터
- Gemini + 영화진흥위원회 박스오피스: 어제 박스오피스 1위 영화에 AI가 쓴 한 줄 평 붙이기
- Groq + 네이버 검색 API: 키워드를 넣으면 최신 블로그·뉴스를 빠르게 요약
더 많은 API 살펴보기
- open-apis-korea: 한국어 사용자를 위한 오픈 API 모음
- public-apis-4Kr: 한국 서비스에 사용 가능한 Public API 목록
AI 협업 워크플로우 따르기
Feedme에서 사용한 흐름을 본인 아이디어에 적용합니다.
| 과정 | 실행 | 결과 |
|---|---|---|
| 기회 찾기 (선택) | /discover-opportunity | 선택한 문제와 방향 |
| 요구사항 구체화 | /shape-idea @<요구사항 파일> | docs/specs/<slug>/spec.md |
| 구현 경로 선택 | 필요할 때 /split-into-tasks @docs/specs/<slug>/ | Spec 또는 승인한 Task |
| 구현과 검증 | /implement @docs/specs/<slug>/ | 구현 결과와 완료 기준별 검증 근거 |
| 결과 검토 | /human-review | 실제 결과·검증 근거와 사람이 판단할 질문 |
| 배포 | GitHub + Vercel | 접속 가능한 URL |
배포 시 환경 변수 설정하기
프로젝트에 외부 API 키(Supabase URL 등)가 있으면 환경 변수를 설정합니다.
로컬: Next.js는 프로젝트 루트의 .env.local 파일에서 환경 변수를 읽습니다. NEXT_PUBLIC_ 접두사를 붙인 변수만 브라우저에서 읽을 수 있습니다. API 키처럼 노출되면 안 되는 값에는 이 접두사를 붙이지 않습니다.
Vercel: Import 화면의 Environment Variables 섹션에서 Key/Value를 등록합니다.
.env.local 파일이 있다면 Import .env 버튼으로 한 번에 등록할 수 있습니다.
로컬과 Vercel 양쪽에 등록해야 합니다
.env.local에 있는 값을 Vercel에도 동일하게 등록해야 프로덕션에서 동작합니다.
실습 규칙 지키기
- 배포 가능한 결과 하나를 먼저 완성하기: 기능을 늘리기 전에 핵심 동작이 처음부터 끝까지 이어지는지 확인합니다.
- 필요할 때만 Task로 나누기: 각 부분을 따로 완성해도 사용할 수 있을 때만
/split-into-tasks를 사용합니다. - 사용자에게 보이는 동작이 바뀌면 Spec으로 돌아가기: 구현 중 요구사항이 달라졌다면 코드만 고치지 말고 현재 결정을 먼저 갱신합니다.
- 새 도구 하나씩 추가하기: Supabase 연동을 확인한 뒤 Vercel 배포를 시도합니다. 여러 도구를 한꺼번에 추가하면 문제가 생겼을 때 원인을 찾기 어렵습니다.
결과물 공유하기
실습이 끝나면 본인 프로젝트를 claude-hunt.com에 업로드합니다.
- 오프라인 수강생: 강의 마지막 날 오후 5시까지 올리면 그날 투표 대상이 됩니다.
- 온라인 수강생: 완성하는 대로 올리면 그달 말일 투표 대상이 됩니다.
FAQ
이어서 배울 내용
개인 프로젝트 실습이 끝나면 Part 3 전체를 정리합니다.