# VibePPT

Claude Code를 활용한 HTML 프레젠테이션 생성 프로젝트

## 소개

이 프로젝트는 Claude Code를 사용하여 HTML 기반 프레젠테이션을 생성하는 예시입니다.
복잡한 PPT 소프트웨어 없이, 텍스트 명령만으로 세련된 발표 자료를 만들 수 있습니다.

## 사용법

### 1. Claude Code 실행

```bash
claude
```

### 2. PPT 생성 요청

```
"클로더즈 첫 수업" 주제로 30분짜리 발표 자료 만들어줘.
- 빌더가 되자는 메인 메시지
- AI 활용법 설명
- CLAUDE.md 작성법
- 실습 단계 포함
- 발표자 노트도 넣어줘
```

### 3. 기존 PPT 수정

```
@ppt.html 참조해서 슬라이드 5번 내용을 더 간결하게 수정해줘
```

```
@ppt.html 스타일 유지하면서 "MCP 서버 소개" 슬라이드 3장 추가해줘
```

## 예시 명령어

| 요청 | 설명 |
|------|------|
| `@ppt.html 참조해서 새 주제로 PPT 만들어줘` | 기존 스타일 기반 새 PPT 생성 |
| `@ppt.html 슬라이드 10번 뒤에 실습 슬라이드 추가해줘` | 특정 위치에 슬라이드 삽입 |
| `@ppt.html 발표자 노트 수정해줘` | 발표자 노트 편집 |
| `@ppt.html 색상 테마를 파란색으로 바꿔줘` | 디자인 변경 |

## 기능

- 키보드 네비게이션 (←, →, Space)
- 발표자 노트 (P키로 열기)
- 슬라이드 인디케이터
- 반응형 디자인
- 다양한 레이아웃 (카드, 타임라인, 비교표 등)

## 파일 구조

```
vibeppt/
└── ppt.html    # HTML 프레젠테이션 파일
```

## 발표 모드

1. `ppt.html`을 브라우저에서 열기
2. `P` 키를 눌러 발표자 노트 창 열기
3. 화살표 키 또는 스페이스바로 슬라이드 넘기기

## 커스터마이징

CSS 변수를 수정하여 테마를 변경할 수 있습니다:

```css
:root {
  --primary: #7C3AED;        /* 메인 컬러 */
  --primary-light: #A78BFA;  /* 밝은 메인 컬러 */
  --bg-purple: #F5F3FF;      /* 배경색 */
}
```

## 라이선스

MIT