---
title: 1일차 강의노트
tags:
  - 강의자료
  - AI에이전트크리에이터
  - Claude
  - 바이브코딩
created: 2026-09-28
---

# 1일차 강의노트
## AI 에이전트 기초와 바이브코딩 입문

### 학습목표
- Claude의 네 가지 형태(Chat·Code·Cowork·API)와 "에이전트" 개념을 이해한다.
- Claude Code 실습을 위한 개발환경(터미널·Git·VS Code)을 스스로 구축할 수 있다.
- 자연어 설명만으로 실제 동작하는 웹앱을 완성하는 바이브코딩 습관을 익힌다.

## 1. 클로드 소개

클로드(Claude)는 Anthropic이 만든 AI 어시스턴트다. 대화형 챗봇으로 시작했지만, 지금은 목적에 따라 여러 형태로 쓸 수 있다.

- **Chat (claude.ai)**: 질문하고 답을 받는 기본적인 대화형 인터페이스
- **Claude Code**: 터미널·IDE에서 코드를 직접 읽고 쓰는 개발자용 에이전트 도구
- **Claude Cowork**: 데스크톱 앱에서 파일 정리, 문서 작성 등 코딩 외 업무를 자동으로 처리하는 도구(비개발자 대상)
- **API / Claude Platform**: 개발자가 자신의 서비스에 클로드를 연동할 때 사용

클로드의 핵심 특징은 단순히 텍스트를 생성하는 게 아니라, 파일을 읽고 쓰고 명령을 실행하는 "에이전트"로 동작할 수 있다는 점이다. 이 과정(AI 에이전트 크리에이터 & 마케팅 실무 과정) 전체가 바로 이 에이전트형 기능을 마케팅·콘텐츠·업무 자동화에 활용하는 법을 다룬다.

<!-- lecture-diagram:start day-1-1 -->
**그림으로 정리 · 같은 Claude, 역할에 따라 다른 도구**

![같은 Claude, 역할에 따라 다른 도구](assets/diagrams/day-01-1.svg)

먼저 하려는 일을 정하고, 그 일에 맞는 사용 방식을 고릅니다.
<!-- lecture-diagram:end -->

## 2. 클로드 필수 프로그램 설치

클로드 코드를 원활히 쓰려면 아래 프로그램들을 먼저 준비해두면 좋다.

### 2-1. 터미널
Windows는 PowerShell 또는 명령 프롬프트(CMD)를 기본 제공한다. 시작 메뉴에서 "PowerShell"을 검색해 실행하면 된다.

### 2-2. Git (Git for Windows)
Windows에서 클로드 코드가 Bash 도구를 쓸 수 있게 해주는 프로그램이다. Windows에서 필요한 셸과 Git Bash 또는 WSL 구성은 현재 공식 설치 문서의 요구사항에 맞춘다. 설치 방식에 따라 전제 조건이 다르므로 PowerShell이 모든 기능을 대체한다고 가정하지 않는다.
- 다운로드: https://git-scm.com/downloads/win
- 설치 후 기본 옵션으로 진행하면 된다.

### 2-3. Visual Studio Code (VS Code)
코드를 눈으로 보고 편집하기 편한 무료 에디터다. 클로드 코드 확장 프로그램을 설치하면 에디터 안에서 바로 클로드를 사용할 수 있다.
- 다운로드: https://code.visualstudio.com/
- 설치 후 확장(Extensions) 탭에서 "Claude Code" 검색 → 설치

### 2-4. Node.js (선택)
npm으로 클로드 코드를 설치하고 싶은 경우에만 필요하다(Node.js 22 이상 권장). 기본 설치 방법(아래 3번)을 쓸 경우 Node.js는 필요 없다.
- 다운로드: https://nodejs.org/en/download

## 3. 클로드 코드 설치 방법

### 3-1. 설치(기본, 권장 방법)
**Windows PowerShell**을 열고 아래 명령어를 입력한다.
```powershell
irm https://claude.ai/install.ps1 | iex
```
**Windows CMD**를 쓰는 경우:
```batch
curl -fsSL https://claude.ai/install.cmd -o install.cmd && install.cmd && del install.cmd
```
> PowerShell 프롬프트는 `PS C:\`, CMD 프롬프트는 `C:\`로 표시된다. 명령어가 안 맞으면 터미널 종류를 확인하자.

### 3-2. 설치 확인
```bash
claude --version
```
버전이 정상적으로 출력되면 설치 성공이다. 문제가 있으면 아래로 더 자세히 진단할 수 있다.
```bash
claude doctor
```

### 3-3. 로그인
터미널에서 `claude`를 입력해 실행하면 브라우저가 열리며 로그인 절차가 진행된다. Pro, Max, Team, Enterprise 요금제 또는 Console 계정이 있어야 하며, 무료 Claude.ai 플랜으로는 클로드 코드를 쓸 수 없다.
```bash
claude
```

## 4. 클로드 바이브코딩 실습

"바이브 코딩(Vibe Coding)"은 코드를 한 줄도 몰라도, 원하는 결과를 자연어로 설명하면 클로드가 실제로 동작하는 코드를 만들어주는 방식이다. 오늘은 두 가지를 직접 만들어본다.

### 실습 진행 순서(공통)
1. 바탕화면이나 원하는 위치에 프로젝트 폴더를 하나 만든다(예: `가계부앱`)
2. 터미널에서 그 폴더로 이동한다: `cd 가계부앱`
3. `claude` 명령으로 클로드 코드를 실행한다
4. 아래 예시 프롬프트를 참고해 원하는 내용을 설명한다
5. 결과물을 브라우저로 열어 확인하고, 마음에 안 드는 부분은 이어서 요청한다

<!-- lecture-diagram:start day-1-2 -->
**그림으로 정리 · 바이브코딩은 작은 반복으로 완성하기**

![바이브코딩은 작은 반복으로 완성하기](assets/diagrams/day-01-2.svg)

한 번의 요청으로 끝내기보다, 만들기 → 확인하기 → 고치기를 반복합니다.
<!-- lecture-diagram:end -->

### 실습 1. 가계부 앱
**목표**: 수입과 지출을 입력하면 자동으로 잔액과 카테고리별 합계를 보여주는 웹앱

**예시 프롬프트**:
```
수입과 지출 내역을 입력할 수 있는 간단한 가계부 웹앱을 HTML/CSS/JavaScript로 만들어줘.
- 날짜, 항목명, 카테고리(식비/교통/쇼핑/기타), 금액, 수입/지출 구분을 입력받아
- 목록으로 보여주고
- 현재 잔액과 카테고리별 지출 합계를 자동으로 계산해서 보여줘
- 디자인은 깔끔하고 모바일에서도 보기 좋게 만들어줘
```

**추가로 요청해볼 수 있는 것**:
- "이번 달 지출을 원그래프로 보여줘"
- "항목을 삭제하거나 수정할 수 있게 해줘"
- "데이터가 새로고침해도 사라지지 않게 저장해줘"

### 실습 2. MBTI 운세 / 궁합 앱
**목표**: MBTI 유형을 입력하면 오늘의 운세를, 두 사람의 MBTI를 입력하면 궁합 결과를 보여주는 웹앱

**예시 프롬프트**:
```
MBTI 관련 재미로 보는 웹페이지를 만들어줘.
1. 16가지 MBTI 유형 중 하나를 선택하면 오늘의 운세 메시지를 랜덤으로 보여주는 기능
2. 두 사람의 MBTI를 각각 선택하면 궁합 점수(0~100점)와 짧은 설명을 보여주는 기능
디자인은 재미있고 화사한 느낌으로, 버튼 클릭만으로 결과를 볼 수 있게 만들어줘.
```

**추가로 요청해볼 수 있는 것**:
- "결과를 카카오톡 공유하기 버튼도 추가해줘"
- "운세 문구를 더 다양하게 늘려줘"
- "궁합 결과에 어울리는 이모지를 추가해줘"

### 바이브 코딩 실습 팁
- 처음부터 완벽하게 요청하지 않아도 된다. 일단 간단한 버전을 만들고, 결과를 보면서 하나씩 기능을 추가하면 된다.
- "어떻게 만들어줘"보다 "무엇이 되었으면 좋겠는지" 결과 중심으로 설명하는 게 더 좋은 결과로 이어진다.
- 실행 중 에러가 나면 에러 메시지를 그대로 복사해서 클로드에게 붙여넣고 고쳐달라고 하면 된다.
- 결과물이 저장된 파일 위치를 모르겠으면 "결과 파일을 어디에 저장했는지 알려줘"라고 물어보면 된다.

## 오늘의 실습 산출물
- 실습용 프로젝트 폴더 2개(가계부 앱, MBTI 앱)

## 관련 노트
- [[2일차_강의노트]]


## 실습 검증과 문제 해결

### 가계부의 합계 검증

- **직접 해볼 일**: 수입 50,000원과 지출 12,000원·8,000원을 입력한다.
- **예상 결과와 판정 기준**: 잔액은 30,000원이어야 한다. 지출 한 건을 지우고 합계가 즉시 바뀌는지 확인한다.
- **오류를 좁히는 방법**: 숫자를 문자열로 더하거나 지출 부호를 반대로 처리하면 합계가 틀린다. 빈 입력·음수·문자 입력도 각각 확인한다.

이 항목은 교육용 검증 시나리오이며 실제 실행 성공·수익·플랫폼 승인을 보고하는 사례가 아니다. 결과 화면과 수정 내용을 기록하면 다음 실습에서 같은 오류를 줄일 수 있다.

## 자료 업데이트 안내

2026-10-12 주요 설명 보완. 설치 명령·계정별 기능·요금과 심사 규정은 실행 시점의 공식 문서를 다시 확인한다.

- [Claude Code 설치 문서](https://code.claude.com/docs/en/setup)
- 강의 내용 문의 및 오류 신고: [라인블록](mailto:lineblock55@gmail.com)