Written by coh at home

[혼공바코 with 클로드코드] 1주차 본문

Etc/도서

[혼공바코 with 클로드코드] 1주차

och 2026. 1. 11. 17:15

바이브코딩이란?

AI와 대화를 하며 개발하는 코딩 방식

모델선택형 vs 전용 모델형

모델 선택 : 커서, 윈드서프 -> 도구사용료 + 모델비용

전용 모델 : 클로드, 제미나이 -> 모델비용만 지불. 로컬 파일 접근 가능

웹페이지 만들어보기

https://github.com/taehojo/vibecoding/blob/master/PROMPTS.md
클로드 홈페이지에서 앤트로픽의 아티팩트를 이용하여 생성.
아티팩트 > 새 아티팩트 > 웹/앱 만들기

프롬프트의 중요성

좋은 프롬프트란? 정확하고 구체적인 명령.

  1. 명확성 : 모호한 표현 피하고 원하는 결과 전달
  2. 구체성 : 필요한 기능이나 조건 세부적 지시
  3. 맥락제공 : 왜 필요한지, 어떤 상황에 사용되는지 전달

좋은 프롬프트를 만드는 프레임워크 : 5W1H

  1. Why
  2. Who
  3. What
  4. When
  5. Where
  6. How

이건 결국 PRD와 일치하게 된다.
PRD란, 제품 기획서로 개발 전에 작성하는 문서

AI에게 PRD를 만든 후 이를 기반으로 작성하는 것이 가장 효과적인 프롬프트.

  1. 뼈대 : 기본 HTML구조 및 섹션 별 고유 아이디
  2. 기능 : 실제 데이터 추가 및 로직 구현
  3. 디자인 : UI/UX 적용 및 레퍼런스 (WD press)
  4. 점검 : 테스트 및 품질 검수

기본미션

1. 나의 첫웹페이지 만들고 캡쳐하기

2. p33, p54-55

p33

1번문제. 순서대로. 챗지피티, 커서, 클로드코드

2번문제. 순서대로. 바이브코딩, AI어시스턴트, 모델 선택형, 전용 모델형

p54-55

1번문제. 딥러닝 -> 뉴럴넷 -> 트랜스포머 -> LLM

2번문제. 도구사용료와 모델 비용을 모두 지불한다.

3번문제. 아티팩트

4번문제. 게시

5번문제. 사용자지정