클로드로 바이브코딩을 처음 한다면 claude.ai 채팅에서 아티팩트(artifact)로 한 페이지짜리 웹사이트나 작은 도구를 만들어 보는 것부터 시작하면 됩니다. 아티팩트는 무료(Free) 플랜에서도 만들 수 있고, 설정에서 기능 하나만 켜 두면 됩니다.
내 컴퓨터의 여러 파일로 프로젝트가 커지면 그때 유료 플랜의 클로드 코드로 넘어갑니다. 2026년 10월 21일 Claude 고객센터의 아티팩트 도움말과 Claude Code 공식 문서를 직접 읽고 시작 순서를 정리했습니다.
1. 클로드 바이브코딩, 무엇부터 시작하나요?
아티팩트부터입니다. 바이브코딩은 코드를 직접 짜지 않고 AI에게 말로 시켜 프로그램을 만드는 방식이고, 클로드에서는 채팅 옆에 열리는 아티팩트가 그 첫 무대입니다.
아티팩트는 Claude가 만들어 주는 결과물로, 대화창 옆에 열리고 고치거나 다시 열어 볼 수 있습니다. 다른 사람과 나누는 기능은 Pro·Max·Team·Enterprise 플랜에서 됩니다.
공식 도움말은 문서, 코드 조각, 한 페이지 웹사이트, 이미지, 도표와 흐름도, 대시보드, 작은 인터랙티브 도구까지 거의 무엇이든 아티팩트로 만들 수 있다고 적었습니다.
2. 시작 전에 켜 둘 설정 하나
아티팩트는 무료 플랜에서도 쓸 수 있습니다. 2026년 10월 21일 공식 도움말 기준 문장은 이렇습니다.
"Artifacts are available on Free, Pro, Max, Team, and Enterprise plans, and in Claude Code on every plan that includes Claude Code."
Free·Pro·Max·Team·Enterprise 플랜 모두에서, 그리고 클로드 코드가 들어 있는 플랜이라면 클로드 코드 안에서도 아티팩트를 쓸 수 있다는 뜻입니다. 다만 설정에서 기능 하나를 켜야 합니다.
개인 플랜(Free·Pro·Max)은 Settings > Capabilities에서 「Cloud code execution and file creation」을 켭니다. Team·Enterprise는 Organization settings > Capabilities에서 켭니다.
3. 첫 요청은 화면 하나로 작게
처음부터 회원가입, 결제, 관리자 화면까지 한 번에 시키지 않습니다. 한 페이지 소개 화면이나 계산기처럼 화면 하나, 기능 하나로 시작합니다.
Claude Code 공식 문서도 요청 요령으로 「버그 수정」처럼 짧게 말하지 말고 증상까지 구체적으로 적으라고 하고, 복잡한 작업은 단계로 나누라고 권합니다. 채팅에서 만들 때도 같은 요령을 써 볼 만합니다. 아티팩트도 Claude에게 바꿔 달라고 말해서 고칩니다.
한 번에 다 시키지 말고, 화면 하나를 만든 뒤 고칠 점을 하나씩 말하는 순서가 바이브코딩의 시작입니다. 예를 들어 「우리 가게 소개 한 페이지를 만들어 줘」 다음에 「전화번호를 맨 위로 올려 줘」처럼 이어 갑니다.
4. 대화로 고치고, 오류는 버튼으로
만든 결과물은 Claude에게 바꿔 달라고 말해서 고칩니다. 앞에서 보낸 메시지를 고쳐 보내면 그 대화의 다른 버전이 생겨, 앞서 만든 것을 잃지 않고 다른 방향을 시험해 볼 수 있습니다.
아티팩트에서 오류가 나면 오류 메시지 근처의 「Try fixing with Claude」 버튼을 누릅니다. 오류 내용이 새 메시지로 복사되고, 보내면 Claude가 원인을 찾아 고치려 합니다.
도움말은 고치기에 늘 성공한다고 장담하지 않습니다. 몇몇 오류는 더 손봐야 한다고 적었으니, 같은 오류가 되풀이되면 증상을 말로 다시 설명해 줍니다.
5. 만든 것은 Artifacts 탭에 모입니다
만든 아티팩트는 Claude 사이드바의 Artifacts 탭에 저장됩니다. 어느 대화에서든 다시 찾아 열 수 있고, 이 탭에서 템플릿으로 새로 시작할 수도 있습니다.
처음 만든 아티팩트는 나만 볼 수 있습니다. 도움말은 아티팩트가 처음에는 만든 사람에게만 비공개로 시작한다고 적었습니다. 다른 사람에게 보여 주는 방법은 공유 설정에서 따로 정하며, 공유는 Pro·Max·Team·Enterprise 플랜에서 할 수 있습니다.
휴대폰 Claude 앱에서도 만들고 고칠 수 있지만, 공유 설정을 바꾸려면 웹이나 데스크톱 앱을 써야 한다고 도움말에 적혀 있습니다.
6. 파일이 여러 개로 커지면 클로드 코드로
한 페이지를 넘어 여러 파일로 이루어진 프로젝트를 내 컴퓨터에서 만들고 고치게 되면 클로드 코드가 맞습니다. 공식 문서는 클로드 코드가 전체 코드베이스를 이해하고 여러 파일과 도구에 걸쳐 작업한다고 설명합니다.
다만 클로드 코드는 무료 플랜에 포함되지 않아, Pro·Max 같은 유료 플랜이나 Console 계정이 있어야 합니다. 요금은 클로드 코드 요금제, 무료로 쓸 수 있을까?에 정리했습니다.
클로드 코드로 넘어가면 설치한 뒤 작업할 폴더에서 claude를 입력하고, 원하는 작업을 평소 말로 설명합니다. 공식 빠른 시작 문서는 유능한 동료에게 말하듯 목표를 설명하라고 권합니다.
정리하면 클로드 바이브코딩은 이 순서로 시작합니다.
Settings > Capabilities에서 「Cloud code execution and file creation」을 켭니다- 채팅에서 한 페이지 화면이나 작은 도구 하나를 요청합니다
- 고칠 점을 하나씩 말하고, 오류는 「Try fixing with Claude」로 넘깁니다
- 여러 파일로 커지면 유료 플랜의 클로드 코드로 넘어갑니다
바이브코딩이라는 말이 낯설면 바이브코딩이 정확히 뭔지 궁금한 분들에게를, 매일 조금씩 익히려면 하루 한 시간 바이브코딩 4주 학습 계획을 보세요.
클로드 코드 설치와 활용은 클로드 코드 사용방법 총정리에, 채팅과의 차이는 클로드 코드란? 채팅 클로드와 다른 점에 있습니다. 혼자 배울 공식 자료는 클로드 코드 강의 글로 이어집니다.
참고자료 (모두 2026년 10월 21일 확인)
- Claude Help Center 「What are artifacts and how do I use them?」 — support.claude.com/en/articles/9487310
- Claude Code 문서 「개요」 — code.claude.com/docs/ko/overview
- Claude Code 문서 「빠른 시작」 — code.claude.com/docs/ko/quickstart
- Claude Code 문서 「고급 설정」 — code.claude.com/docs/ko/setup
#클로드바이브코딩 #바이브코딩 #클로드아티팩트 #클로드 #AI코딩
