CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

프로젝트 개요

똑똑 주식회사의 공식 웹사이트 저장소입니다. 스타트업 생태계를 위한 SaaS형 ERP 제품들(VCworks, STworks, LPworks)을 소개하는 정적 웹사이트입니다.

기술 스택

• 정적 사이트 생성: Jekyll (GitHub Pages)
• CSS: Vanilla CSS (common.css, main.css, products.css 등)
• JavaScript: Vanilla JavaScript
• 폰트: Pretendard, Font Awesome 아이콘

사이트 구조

ddock.kr/                    # 메인 홈페이지
├── products/                # 제품 소개 페이지들
│   ├── vcworks.html        # VCworks 제품 소개
│   ├── stworks.html        # STworks 제품 소개
│   └── lpworks.html        # LPworks 제품 소개
├── culture.html            # 조직문화 페이지
└── product/                # VCworks 랜딩 페이지 (기존사이트와 링크 호환성 차원에서 유지)
    └── price/              # 가격 정책 페이지

빌드 및 배포

로컬 개발

# Jekyll 로컬 서버 실행
bundle exec jekyll serve

# 또는 단순 HTTP 서버 (Jekyll 없이)
python -m http.server 8000

배포

• GitHub Pages를 통해 자동 배포
• main 브랜치에 푸시하면 자동으로 https://ddock.kr 에 배포됨
• CNAME 파일을 통해 커스텀 도메인 설정

주요 기능 및 구현 사항

파티클 애니메이션

• 페이지별 Canvas 기반 파티클 효과
• main.js: 기본 별 모양 파티클
• vcworks-particles.js: VCworks 페이지 전용 연결형 파티클
• 각 페이지별 initXXXParticles() 함수로 초기화

반응형 디자인

• 모바일 우선 접근법
• 768px 미만: 모바일 뷰
• 768px-1024px: 태블릿 뷰
• 1024px 이상: 데스크톱 뷰

네비게이션

• 고정형 헤더 네비게이션
• 드롭다운 메뉴 (제품소개)
• 모바일 햄버거 메뉴
• 스크롤 시 스타일 변경

주의사항

• 이미지 최적화: 큰 이미지는 압축하여 사용
• 파티클 성능: 모바일에서는 파티클 수를 줄여 성능 최적화
• 이메일 주소: voc@dkdk.kr (모든 문의)
• Google Analytics: G-8NZDC8ZCZ9

개발 시 주의사항

1. 모든 페이지에 Google Analytics 태그 포함 필수
2. 반응형 디자인 테스트 필수 (모바일, 태블릿, 데스크톱)
3. 새로운 페이지 추가 시 네비게이션 메뉴 업데이트
4. 파티클 애니메이션은 성능을 고려하여 적절히 조절