실전 바이브 코딩(Vibe Coding) 활용 노하우
현업 전문가들의 Replit 활용 사례 공유회 후기
최근 몇 년 사이 참여했던 공유회/세미나/콘퍼런스 중 손에 꼽을 만한 시간!!!
일시: 2025년 6월 14일(토) 오전 11시 @온라인
주제: 현업 전문가들의 실전 바이브 코딩 활용 노하우
형식: 온라인 실시간 공유회
Session 1 비개발자를 위한 바이브 코딩 실전 노하우 — 에미상 수상 할리우드 모션 디자이너 김그륜
Session 2 프로토타입으로 증명하기 — 메타 수석 엔지니어 알렉스
Session 3 Q&A
Session 1 : 비개발자를 위한 바이브 코딩 실전 노하우
바이브 코딩이란?
AI에게 아이디어를 말하면 알아서 AI가 대신 코딩을 해 줘서 제작해주는 것. 챗GPT가 질문을 하면 대답을 해 주는 거라면, 바이브코딩은 원하는 것을 행동으로 만들어서 보여준다. 이런 것을 AI에이전트라고 한다.
그럼 무엇을 만들까?
나만의 개성 있는 포폴사이트를 만들고 싶다란 생각, 모임 신청 페이지, AI가 고민상담 서비스를 만들 수 있을까?
첫출발은 내가 필요한 것을 만들어볼 것을 권유.
그륜님도 본인이 필요한 것들을 직접 바이브 코딩으로 제작함.
[ 1.프롬프트 변환 사이트 ]
• 여러 AI 모델을 이용하는데 있어, 최적의 결과물을 얻으려면 각 모델별 특성에 맞는 프롬프트로 변환해야 해서 GPTs를 왔다갔다 하는 것이 불편. 프롬프트 통합 변환기의 필요성을 느꼈고 그래서 한 곳에서 다양한 AI 모델에 맞게 프롬프트를 변환해 주는 프롬프트 변환 사이트를 제작함.
• 원하는 AI 모델을 선택 → 한글로 텍스트 입력 → 해당 모델에 최적화된 프롬프트로 자동 변환해 줌
[ 2.SNS 변환기 ]
소셜별 일일이 글을 쓰지 않고, 글 하나로 각 소셜에 맞게 변환해 줌.
[ 3.하루 To 삼일(do list) ]
To-do 리스트의 일종으로, 하루를 3분할(아침/점심/저녁)해서 일정을 관리함. 루틴, 목표도 설정 가능. 구글 캘린더와도 연동됨.
[ 4.와인/커피 테이스팅 ]
와인/커피 리뷰 사이트. 커피를 예로 들자면, 에스프레소 머신별 원두 추출 노하우 공유 + AI 상담 등 기능이 있음.
[ 5.자동화 + 크롬 익스텐션 ]
만든 크롬 익스텐션으로 포스팅 작업을 자동화해, 작업 시간을 30분 → 10분 → 10초로 줄임
AI 에이전트와 협업 시 팁!!!
관리자 페이지 활용하기
긍정적인 표현 사용 : ‘~하면 안 돼’ 보다는 ‘~하게 해 줘’
기본 기능부터 만들고 추가 기능 후, 마지막에 디자인.
챗GPT 활용하기
모르면 Replit에 질문하기
개발 관련 지식 활용 : 코딩 태그나 DB, API 등과 같이 개발과 관련된 약간의 지식이 있으면 좀 더 나은 작업을 할 수 있다.
레퍼런스 사이트 활용 : Behance, Pinterest, Savee
Session 2 : 프로토타입으로 증명하기
→ 말이 아닌 결과로 설득해야 하는 이유
바이브 코딩의 가치와 변화
수많은 문서와 프로세스에서 ‘PRODUCT’부터 시작해야 하는 이유
왜 바이브 코딩 인가?
기획 > 회의 > 디자인&개발요청 > 결과 확인&과정 반복 없이, MVP처럼 빠르게 실행 가능. 시간과 과정에 효율적 임.
왜 Replit 인가?
완벽한 환경 : 개발 환경 세팅 없이 웹에서 바로 시작.
원클릭 배포 : 배포에 진입 장벽이 거의 없음.
알렉스님이 바이브 코딩으로 제작한 프로젝트
[ 1.개인 포폴 웹사이트 ]
프롬프트로 개인 사이트를 거의 10분에 만듦.
[ 2.인공지능 기반 광고 서비스]
상품 url만 입력하면, 광고 콘텐츠를 만들어줌.
[ 3.Lumi 대화형 성격 테스트 ]
심리학과 AI를 결합한 과학 기반의 테스트, 개인의 성격과 적성을 발견하고 분석과 조언도 제공.
Replit으로 하는 바이브 코딩 실전 방법&팁
제작하려는 것을 챗GPT와 브레인스토밍처럼 이것저것 떠들고 기획서(PRD) 작성 요청하기
에러 발생 시 에이전트와 소통하기 : 로그 분석을 시켜서 원인을 파악해 문제해결.
버전 관리하기 : 테스트와 저장을 일상화 해, 롤백 또는 잘 돌아가는 버전을 관리.
바이브 코딩 실전 워크 플로우 팁
1. PRD & README.md 작성 : 플젝 개요 문서로, 프로젝트 목적/기능/사용자 흐름 등의 작성을 챗GPT에 요청.
2. Initialize.md 작성 : AI 에이전트가 필요한 코딩을 잘 수행할 수 있도록 전체적인 context를 효율적으로 제공하는 방법으로, 일종의 신입 온보딩과 같음. 에이전트에게 해당 문서를 먼저 읽게 한 후, 작업을 요청하면 맥락에 맞는 개발에 도움이 됨.
3. 디자인/콘텐츠 가이드라인 작성 : 해당 가이드라인도 만들어 두면 좀 더 명확하고 일관된 결과가 나옴
여러 바이브 코딩 툴 중, Replit을 선택한 이유
일단 너무 잘 만들고, 너무 쉬움.
모바일에서도 작업 가능 : 접근성 용이
실리콘밸리 개발자처럼 빠르게 프로토타입을 만들 수 있음
외주보다 빠르고 유연 : 작업 핑퐁이 없고 커뮤니케이션 비용에도 효율.
원클릭 디플로이
사용성과 실행력을 중시하는 최소시간 → 최대 아웃풋
Q&A
[ 그륜 ]
1. 기획을 시스템 요구화 할 때 어떻게?
→ 여러 방법을 해 봤는데, 일단 막 하는 걸 추천, 그래서 안 될 때도 많은데 그 과정을 본인이 시행착오를 겪으며 체득. (과금 부담이…)
2. Cursor처럼 디자인 시스템을 넣어 두고 제작 가능?
→ 본인 스타일로 하다 보니, 같은 결이 보여진 것이고 디자인 시스템을 만든 것은 아님.
3.기능을 추가 시, 요청한 부분 외 다른 부분까지 수정되거나, AI가 고집부리며 말을 안 듣는 경우도 발생하는데, 어떻게 대처?
→ 앞서 말한 긍정적인 표현으로 얘기하고 좀 더 자세히 설명을 하면 해 줌. 규모가 큰 플젝을 하기엔 AI가 아직인 부분도 있기 때문에 되는 것들을 찾아서 알아보고 해 보는 것이 중요.
[ 알렉스 ]
1. AI&바이브 코딩으로 신입/주니어 설 자리가 줄어들 텐데, 살아남을 수 있는 무기? 개발자의 미래 방향?
→ 실행력
2. Replit DB 환경이 쉽지 않은데? 방법이 있을까?
→ 챗GPT 도움을 받으면 어떨까?
3. AI가 다 해 준다고 해도, 잘 된 건지/아닌지 알 수 있는 정도의 안목을 기르려면 어떻게?
→ 정확도나 지저분한 것에 개발자들 사이에 호불호가 다양한데, 간단한 데모 같은 것에는 괜찮다고 생각. 정말 중요한 코드는 챗GPT에 정말 중요하다고 명확한 코드 지침으로 제대로 짜 달라고 하면 해 줌.
4. Replit으로 작업 시, 코드 퀄리티나 유지보수 측면에서 어떤지?
→ 웬만한 실리콘 개발자보다 낫기 때문에 Replit이 할 수 있음.
[ 그륜&알렉스 ]
모두가 에이전트&바이브 코딩 통해 레버리지 사용할 수 있는 시대라면, 어떠한 것이 본인 만의 대체 불가능한 강점/특이점으로 작용할 수 있을까?
→ 그륜 : 인간의 불안정성의 아이디어, 근묵자흑이라고 했다. 커뮤니티에 있다 보면 하게 된다.
→ 알렉스 : 실행. 똘끼
최근 몇 년 사이 참여했던 공유회/세미나/콘퍼런스 중 손에 꼽을 만한 행사였다.
SNS와 유튜브를 통해 알게 되어 눈팅만 하던 ‘바이브 코딩’. 실무자들의 실전을 들을 수 있다는 Threads를 보고 바~로 신청. 90분간의 발표 + Q&A 시간 동안 저절로 초집중하게 되는 ‘찐’ 시간이었다.
발표자의 이력에 한 줄, 행사 네임벨에 뭔가 한 줄 추가코자 하는 속 빈 강정 같은 세미나들이 많았는데, 이번에는 달랐다. 실무자들의 ‘찐’ 작업 과정과 그들의 시행착오, 해결 팁 등을 들을 수 있어서 좋았다. 강연자가 고군분투하며 들인 수십/수일의 시간을 우리 참석자들은 대략 2시간 정도의 압축된 시간으로, 공짜로 산 셈이다. 발표 시간이 짧아 디테일한 작업 과정까지 모두 듣지 못해 살짝 아쉬웠지만, 요즘 10~20분 내외 짧은 발표에 그치는 것과 비교하면, 정말 감사한 시간이었다.
그리고 또 한 번 자극받고 반성하게 된, 실행력!
‘이런 거 있으면 좋겠다’ 싶어 메모해 둔 것들이 좀 되지만… 실행률 0%. � 이번 공유회를 통해서, 의욕 기어가 1단 올라갔달까?
실행의 가장 빠른 첫걸음. 레플릿 가입하러 가 볼까~~~
(공교롭게도 오늘, Cursor 밋업도 있었던 건…. 그냥 우연의 일치일까? ㅋㅋ)
#바이브코딩 #Vibe Coding #비개발자 코딩 #실전노하우 #AI에이전트 #Replit
