시리즈 「내가 AI 에이전트로 진짜 만든 것들」 2편
관련 링크: https://moa365.com (1편 본 제품) / 1편 글: 「AI 채팅 가계부 MOA 소개」
“기획자 한 명이 풀스택 앱을 만들 수 있을까”
MOA(moa365.com)를 공개한 뒤 가장 많이 받은 질문이 두 개였습니다.
- “개발팀 몇 명이에요?”
- “외주 줬어요?”
답은 모두 ‘아니오’ 입니다. 기획·설계·개발·배포 전부 1인 운영입니다. 단, ‘진짜 혼자’는 아니었습니다. AI 에이전트팀이 같이 일했습니다. 이번 글은 그 과정을 단계별로 공개하는 글입니다.
1단계 — Claude AI로 아이데이션과 PRD
처음 시작은 Claude.ai에서 대화 한 번이었습니다.
“가계부 앱을 만들고 싶은데, 사용자가 채팅으로 입력하면 AI가 알아서 카테고리·금액·날짜를 추출해서 저장하는 구조야. PRD 초안을 만들어줘.”
Claude는 단순히 글을 써주는 도구가 아니라, 기획 파트너처럼 동작했습니다. 제가 한 일은 다음과 같습니다.
1) 컨셉 검증 대화
- “기존 가계부 앱과 뭐가 다른가?” → 차별화 포인트 정리
- “MVP에 들어가야 할 최소 기능 5가지는?” → 우선순위 도출
- “1인 운영 가능한 범위로 자르면?” → 스코프 축소
2) PRD(Product Requirements Document) 생성
- 페르소나 / 유저 시나리오
- 기능 명세 (입력 파이프라인, 카테고리 분류 로직, 통계 화면)
- 기술 스택 후보 비교 (Next.js + FastAPI vs Next.js + Node 등)
- 데이터 모델 초안
3) 의사결정 로그
- 왜 채팅 단일 입력으로 갈지, 왜 모바일 우선이 아닌 웹앱으로 갈지 — 결정 근거를 함께 남김
이 단계의 핵심은 “코드 한 줄 짜기 전에 PRD를 끝내는 것” 이었습니다. AI는 이걸 1~2시간 안에 가능한 수준으로 압축해 줍니다.
2단계 — VS Code의 Claude 에이전트팀이 코드 개발
PRD가 나오면 그다음은 코드입니다. 이때 사용한 환경이 VS Code + Claude Code(에이전트팀) 입니다.
왜 에이전트팀 구조인가
혼자 일하는 사람에게 가장 부족한 건 ‘역할 분담’입니다. 그래서 저는 Claude Code 안에 목적별 서브에이전트를 두고 일을 시켰습니다.
| 역할 | 하는 일 |
|—|—|
| 백엔드 에이전트 | API 설계, DB 모델, AI 추출 파이프라인 구현 |
| 프론트 에이전트 | 채팅 UI, 통계 대시보드, 반응형 레이아웃 |
| QA 에이전트 | 입력 케이스 테스트, 에지 케이스 검증 |
| 리뷰 에이전트 | 코드 스타일·보안 점검 |
각 에이전트는 자기 영역의 컨텍스트만 들고 일하기 때문에 출력 품질이 훨씬 안정적이었습니다. 사람으로 치면 ‘한 사람이 풀스택을 다 하는’ 게 아니라 ‘같은 사람이 역할만 바꿔서 하는’ 셈이지만, 컨텍스트 분리만으로도 결과가 달라집니다.
실제 작업 흐름
PRD.md 작성
└─ Claude Code에 "이 PRD대로 백엔드 스켈레톤 만들어줘"
└─ 백엔드 에이전트가 라우터·모델·migrations 생성
└─ "프론트 에이전트로 전환. 채팅 UI 붙여줘"
└─ Next.js 채팅 컴포넌트 + API 연결
└─ "QA 에이전트로 전환. 입력 케이스 20개 테스트"
└─ 버그 리스트 → 수정
저는 코드를 타이핑하는 사람이 아니라 방향을 잡고 결과를 검수하는 사람이 되었습니다.
3단계 — Railway(백엔드) + Vercel(프론트) 배포
코드가 돌아가도 사용자가 접속할 URL이 없으면 의미가 없습니다. 배포는 다음과 같이 분리했습니다.
Railway — 백엔드
- API 서버 + DB + 백그라운드 작업(AI 추출 처리) 모두 Railway에 배치
- GitHub 브랜치와 자동 연동, 푸시하면 그대로 배포
- 로그·메트릭이 대시보드에서 바로 보임 → 1인 운영에 적합
- DB는 Railway 내부에서 함께 프로비저닝, 환경변수도 한 화면에서 관리
Vercel — 프론트엔드
- Next.js 앱을 그대로 Vercel에 연결
- 도메인
moa.atm.ai.kr을 Vercel에 매핑 (DNS의 CNAME 한 줄) - PR 단위로 프리뷰 URL이 자동 생성 → 검토 후 머지
왜 Railway + Vercel 조합인가
- Railway는 백엔드+DB의 ‘서버 한 묶음’을 가장 쉽게 띄우는 솔루션
- Vercel은 Next.js 기반 프론트의 사실상 표준
- 둘 다 GitHub 푸시 한 번으로 배포되므로, ‘코드 머지가 곧 배포’ 라는 흐름이 1인 운영에 잘 맞음
git push → (Vercel: 프론트 빌드+배포) (Railway: 백엔드 재시작)
→ 1~2분 후 moa.atm.ai.kr 에 반영
결과 — ‘혼자’ 가능했던 풀스택 운영
정리하면 MOA는 사람 1명 + AI 에이전트팀으로 다음 단계를 모두 통과한 프로젝트입니다.
- 컨셉/PRD: Claude AI 와 1:1 대화
- 개발: VS Code + Claude Code 서브에이전트
- 배포: Railway (백엔드) + Vercel (프론트엔드)
- 도메인·연결·운영: 직접 (단, AI 에이전트가 가이드)
이 글의 핵심 메시지는 ‘AI가 코드를 짜준다’가 아니라 ‘AI 덕분에 1인이 풀스택 운영 사이클을 돌릴 수 있다’ 입니다. 똑같이 시도하실 분을 위해, 추천 순서는 이렇습니다.
- PRD부터 Claude와 함께 끝내라 — 코드 짜기 전에 의사결정을 끝내는 게 가장 큰 절약
- 에이전트 역할을 분리하라 — 백엔드/프론트/QA를 같은 채팅에 섞지 말 것
- 배포는 GitHub 푸시 = 배포 구조로 단순화하라 — 1인이 운영 가능한 유일한 방식
다음 편 예고
다음 3편에서는 AI Trend Master의 공식 홈페이지(atm.ai.kr) 를 Claude로 만든 이야기를 풀어드립니다. Claude Design과 getdesign.md로 디자인을 입히고, Netlify로 런칭한 과정을 상세히 공개합니다.
#AI에이전트 #ClaudeCode #Railway #Vercel #풀스택1인개발 #AITrendMaster
작성자 소개
AITREND.KR News Letter
