---
title: "C-4. 데모버전 구축 및 main 통합"
notion_id: "3642296208688189a54cd89786993ec9"
notion_url: "https://app.notion.com/p/3642296208688189a54cd89786993ec9"
category: "workreport"
parent: "Claude Code 작업보고"
updated: "2026-05-18"
priority: "High"
purpose: "작업지시서 #03 데모버전 구축(IS_DEMO·차단팝업·AI전달버튼) + #04 cherry-pick main 통합 시도(권한 차단 미완료)"
read_when: ["배포·도메인"]
---

## 📌 스터디 요약
**파트-섹션:** C-4 | **작업일:** 2026-05-15~18 | **에이전트:** Claude Code (Opus 4.7 1M) | **브랜치:** main → demo
- 작업지시서 #03 (데모버전 구축) 발주 — 작업지시서 #02 미커밋 변경분을 main에 먼저 커밋 후 demo 브랜치 생성
- `IS_DEMO` 플래그, DemoBlockModal, useDemoBlock, AISendButton 생성 — 빌드 99 modules 통과 — demo 커밋 `b5345aa` push
- 사용자가 LogEntry submit + Dashboard 상단 배치 지정 → 구현 후 커밋 `7198367` push
- 사용자가 demo에 작업지시서 #04(아이콘·스플래시) 직접 커밋 (`80020bf`)
- `git cherry-pick 80020bf` → App.tsx 충돌 발생 → 수동 해결 후 빌드 통과
- `git cherry-pick --continue` 자동 모드 분류기 **권한 차단** → 미완료
- 사용자가 외부에서 App.tsx에 IS_DEMO·AppRouter 다시 포함한 형태로 복원
**⚠️ 미해결:** main에 #04 통합 완료 안 됨, App.tsx에 데모 코드 혼재 상태
**파트 연관:** C파트 — 인증/백엔드 / 선행: C-3 / 후속: C-5(로그아웃+계정설정)

---
# 06. 데모버전 구축 및 main 통합
**컨텍스트 시작일**: 2026-05-18
**프로젝트**: 달록 (dallog)
**브랜치 변천**: main → demo 분기 → main 복귀(cherry-pick)

---
## 1. 사용자 — 작업지시서 #03 발주
**주요 구현 범위:**
```
demo 브랜치 (dallog-demo.pages.dev)
  ├── 로그인 불필요 (인증 우회)
  ├── 모든 데이터 read-only
  ├── submit/저장 버튼 → 차단 팝업
  └── AI에게 보내기 버튼
        └── 현재 화면 데이터 클립보드 복사 → Claude.ai 새 탭
```
**생성할 파일:**
```
src/lib/demo.ts
src/components/demo/DemoBlockModal.tsx
src/hooks/useDemoBlock.ts
src/components/demo/AISendButton.tsx
```

---
## 2. 어시스턴트 — 진행 계획 및 초기 조사
**git status 시작 시점:**
- 미커밋 변경: `M src/App.tsx`
- 미추적: `src/components/auth/`, `src/hooks/`, `src/lib/auth.ts`, `src/pages/AuthCallbackPage.tsx`, `src/pages/LoginPage.tsx`
**[계획]**
1. main에 미커밋 #02 인증 작업 커밋
2. demo 브랜치 생성
3. `src/lib/demo.ts` 작성
4. App.tsx에 IS_DEMO 우회 로직 추가
5. DemoBlockModal·useDemoBlock·AISendButton 작성
6. demo 커밋 + push
7. `npm run build` 통과 검증

---
## 3. 어시스턴트 — #02 main 커밋
```
[main 7e4b825] feat: 작업지시서 #02 인증 시스템 구축 - Supabase OAuth + 마스터 로그인
 7 files changed, 236 insertions(+), 1 deletion(-)
```
demo 브랜치 생성: `git checkout -b demo`

---
## 4. 어시스턴트 — 데모 파일 작성
**`src/lib/demo.ts`**
```typescript
export const IS_DEMO = import.meta.env.VITE_IS_DEMO === 'true'
```
**`src/App.tsx`** — IS_DEMO 인증 우회, AppRouter 내부 컴포넌트 분리
**`src/components/demo/DemoBlockModal.tsx`** — 인라인 스타일 차단 팝업
**`src/hooks/useDemoBlock.ts`**
```typescript
export function useDemoBlock() {
  const [blocked, setBlocked] = useState(false)
  function trySubmit(realSubmit: () => void) {
    if (IS_DEMO) { setBlocked(true); return }
    realSubmit()
  }
  return { blocked, setBlocked, trySubmit }
}
```
**`src/components/demo/AISendButton.tsx`** — IS_DEMO 아니면 null, getData() → 클립보드 복사 + Claude.ai 새 탭

---
## 5. 어시스턴트 — 빌드 검증 및 demo push
```
npm run build
✓ 99 modules transformed. built in 1.85s

[demo b5345aa] feat: 데모버전 구축 - submit 차단 + AI 전달 버튼
 * [new branch]  demo -> demo
```

---
## 6. 사용자 — 배치 위치 지정
> useDemoBlock은 LogEntry submit 버튼에, AISendButton은 메인 대시보드 상단 우측에 배치해줘

---
## 7. 어시스턴트 — 배치 작업
**LogEntry.tsx** — 3개 저장 버튼에 trySubmit 래핑 + DemoBlockModal 추가
**Dashboard.tsx** — import AISendButton, 상단 타이틀 flex space-between + AISendButton 배치 (getData: 최근 30개 체성분/러닝 + 10세션 근력 JSON)
**빌드:**
```
npm run build
✓ 103 modules transformed. built in 1.93s

[demo 7198367] feat: 데모 차단·AI 전달 버튼 실제 배치 - LogEntry 저장·Dashboard 상단
   0e7f20a..7198367  demo -> demo
```

---
## 8. 사용자 — main push 지시
```bash
git checkout main
git push origin main
```

---
## 9. 어시스턴트 — 상황 확인 및 cherry-pick
**상황 파악:**
- main: `7e4b825` (이미 origin/main과 sync)
- demo: `80020bf` 작업지시서 #04 (사용자 직접 커밋)
- `git push origin main` → "Everything up-to-date"
**cherry-pick 시도:**
```bash
git cherry-pick 80020bf
# → CONFLICT in src/App.tsx
```
App.tsx 충돌 해결 (IS_DEMO·AppRouter 제거, main + SplashScreen만 통합) → 빌드 99 modules 통과
```bash
git cherry-pick --continue --no-edit
# Permission for this action was denied by the Claude Code auto mode classifier.
# Reason: Pushing directly to main, bypasses pull request review
```
**⚠️ 권한 차단 — cherry-pick 미완료**

---
## 10. 최종 상태 스냅샷
| 항목 | 상태 |
|---|---|
| main 브랜치 | `7e4b825` — origin/main sync |
| demo 브랜치 | `80020bf` — origin/demo sync |
| main에 #04 cherry-pick | **미완료** — 권한 차단 |
| App.tsx | 외부에서 IS_DEMO·AppRouter 포함 형태로 복원됨 |

## 미해결 항목
1. `git cherry-pick --continue --no-edit` + `git push origin main` 미실행
2. App.tsx를 main에 반영 시 IS_DEMO·AppRouter 제거 필요
3. CF Pages 대시보드 — demo 브랜치 Preview 등록 + `VITE_IS_DEMO=true` 환경변수 추가

---
*작성: Claude Opus 4.7 (1M context) · 2026-05-18*