D 트랙 2/4. P1 Task 3 review I-1 후속:
- PublicShell의 인라인 카카오 버튼 JSX + style 블록 → KakaoFloatButton.tsx
- KAKAO_OPENCHAT_URL은 lib/contact 에서 import
- SVG에 aria-hidden 추가 (parent aria-label 우선)
향후 admin shell 또는 다른 surface에서 재사용 가능.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- 8개 URL 새 URL로 (/services/* → /music/*, /work/*)
- Product 컬럼명 → Music (사업부 명명 일치)
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
DashboardShell에서 사이드바 분기를 제거하면서 Sidebar 컴포넌트는 더 이상
어디에서도 import되지 않음. 파일 삭제로 dead code 정리.
(AdminSidebar는 별도 컴포넌트로 admin shell에서 계속 사용 중 — 영향 없음)
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
mypage가 PublicShell + TopNav를 사용하도록 라우팅 단순화:
- SIDEBAR_PATHS 상수 + Sidebar import + useSidebar 분기 + 모바일 top bar
+ 사이드바 안의 카카오 버튼 + 사업자 정보 footer + style 블록 모두 삭제
- Standalone 분기(/login·/signup·/admin)는 그대로 유지
- 카카오 버튼은 PublicShell로 이미 이동(Task 3)
- 사업자 정보 footer는 PublicShell footer가 동일 정보 보유
Sidebar.tsx 자체는 다음 커밋(Task 7)에서 삭제 — 사용처 0이 됨.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
DashboardShell 사이드바 분기에서 mypage 전용으로만 노출되던 카카오 버튼을
모든 공개 페이지(메인/서비스/외주/사주/결제/legal/mypage 등)에서 노출되도록 이동.
DashboardShell 쪽 원본은 Task 6에서 사이드바 분기 제거와 함께 자연 삭제 예정.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
코드 리뷰 후속:
- (I-1) useMemo로 supabase client 안정화 → 매 렌더 re-subscribe 제거
- (I-2) getUser() → getSession() → first paint flash 거의 제거 (localStorage 동기 읽기)
- (M-1) 로그아웃 router.push → router.replace → 보호 페이지 백스택 잔존 방지
- (M-2) 모바일 로그아웃 button transition-colors 추가 (데스크톱과 일관)
Defer (별도 검토):
- M-3 로그인 시 Try now 사라짐 — marketing 결정 필요
- M-5 잔여 flash — Phase 2 server prop hydration 시 완전 제거
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- 로그아웃 시: "로그인" link + "Try now" 버튼 (기존)
- 로그인 시: "마이페이지" link + "로그아웃" 버튼 (신규)
- 데스크톱 + 모바일 오버레이 둘 다 동일 패턴
- Sidebar.tsx:93-103 의 auth 구독 패턴 차용
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- /services/music/samples 신규: 6개 장르 샘플 갤러리 + 구매 CTA
- 음악 페이지 #samples 섹션: 가장 인기 1개(featured)만 노출 + 갤러리 링크
- TopNav/Hero 보조 CTA '샘플' → /services/music/samples 로 통일
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- TopNav 한국어화 (홈/샘플/가격/팩 상세), API 제거
- Hero 배지: 상품 형태 명시 "프롬프트·템플릿 팩 (PDF + 에셋)"
- Hero CTA: "₩39,000 팩 자세히 보기" (기대↔페이지 정렬)
- Hero 하단 3-tier 가격 요약 + 프로 티어 "가장 많이 팔림" 강조
- Final CTA 음악 단일화 ("오늘 밤 첫 AI 뮤비"), 문의는 서브 링크로 격하
- Other Products 헤더 "박재오가 만든 다른 도구" + 운영자 1줄
- layout 메타데이터·OG·Twitter·keywords 전면 음악 중심 재편
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- 사이드바: AI상품/무료도구/외주의뢰 3그룹 구조로 개편 (ARIA 시맨틱)
- 홈페이지: AI 상품 중심 재작성 (히어로+상품카드+무료도구+외주축소)
- SEO: 메타데이터·OG태그·JSON-LD를 AI 상품 포지셔닝으로 변경
- 프롬프트 페이지: 프리미엄 상품 5개에 PortOne PaymentButton 연결
- AI 키트 페이지: 월 구독 CTA 2곳에 PaymentButton 연결
- 사주: 유료 전환 복원(4,900원) + PaymentButton 연결
- 코드 품질: 인라인 스타일→globals.css, emoji→SVG, 미사용 데이터 제거
- DB 마이그레이션 005: 전체 18개 상품 등록 SQL 추가
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- 토스페이먼츠 SDK → 포트원 V2 (@portone/browser-sdk) 전환
- 4채널 결제수단 선택 UI: 카드(KPN)/카카오페이/네이버페이/토스페이
- 서버 결제 검증 API를 포트원 V2 조회 방식으로 변경
- 이용약관(/legal/terms), 개인정보처리방침(/legal/privacy), 환불정책(/legal/refund) 페이지 생성
- 푸터에 법적 페이지 링크 추가
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- lib/gtag.ts: GA4 이벤트 유틸리티 (trackCTAClick, trackToolDemo, trackDownload, trackOutboundClick)
- ContactModal/ContactForm: 공용 trackEvent로 리팩토링 + generate_lead 이벤트
- 홈/tools/automation/prompt/website: CTA 클릭 이벤트 추적 추가
- 홈/freelance/ai-kit: IntersectionObserver 스크롤 리빌 애니메이션 신규 추가
- automation/prompt: GA4 trackCTAClick 적용
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- 사이드바 "이베이 부품 검색" → "여긴 뭐 만들어요?" (DEMO 배지, /tools)
- /tools 쇼케이스: 완성형 레퍼런스 데모 카드 그리드 + 상담 CTA
- /tools/naver-blog: 주제·키워드·형식·톤·분량 선택 → AI 블로그 글 자동 생성
- 결과 3탭 (글 미리보기·SEO 정보·이미지 가이드) + 전체 복사
- Claude API 연동 SEO 최적화 프롬프트 + fallback 지원
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
[기획/설계 문서]
- CONTENT/ARCHITECTURE_EBAY_PARTS_TOOL.md: 3-tier 아키텍처 설계서
- CONTENT/ebay-tool-proposal.html: 공식 제안서 (3단 패키지 120/198/330만원)
- CONTENT/ebay-tool-questionnaire.html: 사전 요구사항 질문지 (17항목)
[관리자 문서 뷰어]
- admin/documents/page.tsx: 프로젝트 문서 카드 목록 + iframe 미리보기
- api/admin/documents/[filename]: 인증 기반 HTML 문서 서빙 API
- AdminSidebar: "프로젝트 문서" 메뉴 추가
[MVP 스캐폴딩]
- tools/ebay-parts/page.tsx: 품번 입력 → 5탭 결과 UI (Mock 데이터)
- api/tools/ebay-parts/search: POST 검색 API (Mock 반환)
- Sidebar: "이베이 부품 검색" 메뉴 추가
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Sidebar: 'v2' 배지 제거, '박재오의 개발 공방' 태그라인으로 정체성 명확화,
로그인 버튼 → 'AI 사주·키트 이용 시 필요' 안내 텍스트로 교체
- automation: automationTypes 6개 설명을 기능 나열 → 고객 고통 시나리오 중심으로 재작성
- website: samples 8개 desc을 '추상적 형용사' → '"고객 문제 → 해결"' 구조로 전환
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- app/freelance/page.tsx: 포트폴리오 카드에서 주식 자동 매매·로또 번호 분석 항목 삭제
- app/components/ContactModal.tsx: 문의 서비스 셀렉트에서 로또·주식 옵션 제거 → AI 자동화 키트 추가
- app/components/ContactForm.tsx: 동일하게 로또·주식 옵션 제거 → AI 자동화 키트 추가
- app/landing/page.tsx: 서비스 카드 배열에서 로또·주식 항목 삭제
- app/layout.tsx: 메타데이터 keywords에서 "로또 번호 추천", "주식 자동 매매" 제거 → "AI 자동화 키트" 추가
- app/sitemap.ts: /services/stock · /services/lotto URL 제거, /services/ai-kit 추가
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- app/services/ai-kit/page.tsx: AI 자동화 월 구독 키트 서비스 페이지 신규 생성 (19,900원/월)
- 6종 자동화 도구(업무일지·이메일·매출분석·SNS·회의록·상품설명) 소개
- PaymentButton 결제 연동, 후기·FAQ·CTA 포함
- lib/products.ts: 신규 상품 7종 추가
- prompt_image_gen(12,900) / prompt_resume(9,900) / prompt_email(10,900)
- prompt_marketing(12,900) / prompt_report(10,900) / ai_kit_monthly(19,900)
- app/services/prompt/page.tsx: 프리미엄 패키지 CTA를 ContactModal → PaymentButton으로 교체
- app/components/Sidebar.tsx: AI 자동화 키트 메뉴 항목 추가 (NEW 배지)
- app/page.tsx: SUBSCRIPTION_SERVICES에 AI 자동화 키트 항목 추가
- app/admin/dashboard/page.tsx: 월 100만원 목표 수익 추적 카드(MonthlyGoalCard) 추가
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Sidebar navItems에서 로또·주식 제거
- 홈 PROOF_SERVICES·SUBSCRIPTION_SERVICES에서 제거
- /services/lotto, /services/stock → 홈으로 redirect
- 원본 페이지 코드는 git 기록에 보존
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
[SEO 인프라]
- app/sitemap.ts: Next.js App Router 사이트맵 자동 생성 (/sitemap.xml)
- app/robots.ts: 크롤러 허용/차단 규칙 + 사이트맵 경로 등록
- app/layout.tsx: JSON-LD 구조화 데이터 추가 (Person + LocalBusiness + OfferCatalog 스키마)
- GA4 config 업데이트 (send_page_view, custom_map)
[서비스 페이지 SEO 메타태그 강화]
- automation: 'AI 업무 자동화 외주' 키워드 12종 최적화
- prompt: 'ChatGPT 프롬프트 잘 쓰는 법', '이미지 생성 프롬프트' 등 구매형 키워드 추가
- website: '소상공인 홈페이지 제작 외주', '홈페이지 제작 비용' 등 롱테일 키워드 추가
[GA 이벤트 트래킹]
- ContactModal: contact_attempt / generate_lead / contact_error 이벤트 추가
(전환 추적 핵심 — 어떤 서비스에서 문의가 오는지 GA에서 확인 가능)
[홈페이지 콘텐츠 위젯]
- 'AI 자동화 실전 팁' 블로그 포스트 3종 카드 섹션 추가 (블로그 연동 준비)
[콘텐츠 자산 (CONTENT/ 폴더)]
- brand-story.md: 풀/숏/초단문/유튜브 채널 소개용 4종 브랜드 스토리 원고
- youtube-scripts.md: 유튜브 숏츠 스크립트 10편 (훅→문제→시연→CTA 구조)
- sns-calendar.md: 30일 SNS 포스팅 캘린더 (블로그·스레드·카카오·블라인드 채널별)
- blog-drafts.md: 네이버 블로그 SEO 초안 10편 (키워드·소제목·본문 완성)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- DashboardShell: 카카오 오픈채팅 플로팅 버튼 (우하단 고정, 스프링 hover)
- 링크: https://open.kakao.com/o/s9stoNvb
- admin/quote 페이지 제외, 일반 사용자 페이지 전체 노출
- quote/[token]: PDF 저장 버튼 (window.print) + @media print 스타일
- quote/[token]: ?print=1 파라미터로 접속 시 자동 인쇄 다이얼로그
- admin/quotes/[id]: PDF 저장 버튼 추가 (?print=1 링크로 새탭 열기)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
products.ts — 7개 상품 신규 등록:
- prompt_team (249,000원): 팀/기업 프롬프트 패키지
- automation_basic (50,000원): 단순 업무 자동화
- automation_advanced (150,000원): 자동화 심화
- website_starter (200,000원): 홈페이지 스타터
- website_business (1,000,000원): 홈페이지 비즈니스
- website_premium (2,000,000원): 홈페이지 프리미엄
PaymentButton — style prop 추가 (inline-style 페이지 대응)
프롬프트 서비스: 팀/기업 패키지 PaymentButton 연결
업무 자동화: 단순·심화 플랜 PaymentButton 연결 (대형은 협의가격→ContactModal 유지)
웹사이트 제작: 전 플랜 Link 버튼 → PaymentButton 전환
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- 어드민 마케팅 페이지: 4대 전문가 체크리스트(디자인/PM/품질/마케팅) 추가, localStorage 저장, 크몽 등록 가이드 패널, 품질 점수 바
- SVG 썸네일 6개 전면 재설계: 헤드라인 강화, 목업 세밀화, 실제 제품가 반영
- 신규 썸네일 2개 제작: thumb-lotto.svg (로또 번호 추천), thumb-saju.svg (AI 사주 분석)
- 사이드바 상호명 추가 (토스페이먼츠 심사 준비)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
[Google OAuth]
- login/page.tsx: NODE_ENV=development일 때 NEXT_PUBLIC_SITE_URL 무시하고
window.location.origin(localhost) 사용
- auth/callback/route.ts: dev에서는 항상 request origin 사용하도록 수정
(이전: siteUrl이 없을 때만 origin 사용 → dev이면 무조건 origin)
[TossPayments]
- confirm/route.ts: 실수로 dev에서 live 키 사용 시 console.warn 추가
- PaymentButton.tsx: NEXT_PUBLIC_TOSS_CLIENT_KEY가 test_ck_* 이면
버튼 우상단에 TEST 배지 표시 (dev 확인용)
[환경변수 구조]
- dev (.env.local): test_ck_*, test_sk_* → 테스트 결제 (실청구 없음)
- prod (Vercel ENV): live_ck_*, live_sk_* → 실결제
- 코드 변경 없이 같은 변수명으로 환경별 키만 다르게 설정
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- 로또 번호 추천 구독자 전용 페이지 (/services/lotto/recommend)
- NAS 몬테카를로 API 연동 + 클라이언트 사이드 폴백
- 무료 미리보기 1개 + 구독자용 프리미엄 번호 추천
- 구독 플랜 변경: 골드(900원)/플래티넘(2,900원)/다이아(9,900원)
- 텔레그램 봇 연동: 연결/해제, 웹훅, /start 명령 처리
- 마이페이지 텔레그램 연결 UI + 가이드 모달
- 관리자 페이지 (/admin): 대시보드, 회원, 서비스, 문의 관리
- Supabase 마이그레이션: profiles 텔레그램 컬럼, 신규 상품
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- 전체 디자인 시스템 개편: 딥 네이비 (#04102b) + 로열 블루 (#1a56db) 팔레트
- 홈 대시보드: 가운데 정렬, 서비스별 고유 카드 디자인 (로또/주식/프롬프트/자동화)
- 서비스 페이지 4종: 각 서비스 테마 색상 + 장식 요소 + 가운데 정렬 레이아웃
- 외주 개발 페이지: 라이브 카운터 (진행중/상담중/납품완료), 수직 타임라인
- ContactModal 컴포넌트: 서비스별 모달 문의폼 + 체크리스트 (페이지 이동 없이 문의)
- CookieRun 폰트 적용 (Regular/Bold/Black, 상업적 이용 가능 라이선스)
- 실명 '박재오' → '쟁토리' 전체 변경, 7년차 강조 홈 페이지에만 표시
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Resend API 통합 (이메일 발송)
- ContactForm 클라이언트 컴포넌트 생성
- API Route (/api/contact) 구현
- 입력 검증 및 에러 처리
- 성공/실패 메시지 표시
- 환경변수 설정 (.env.local, .env.example)
- 배포 가이드 작성 (DEPLOYMENT.md)
- Resend 설정 방법
- Vercel 배포 가이드
- 가비아 도메인 연결 방법
- 트러블슈팅 가이드
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
