Web Artifacts Builder

강력한 프런트엔드 claude.ai artifact를 제작하려면 다음 단계를 따르세요:

1. scripts/init-artifact.sh를 사용하여 프런트엔드 레포지토리를 초기화합니다.
2. 생성된 코드를 편집하여 artifact를 개발합니다.
3. scripts/bundle-artifact.sh를 사용하여 모든 코드를 단일 HTML 파일로 번들링합니다.
4. 사용자에게 artifact를 표시합니다.
5. (선택 사항) artifact를 테스트합니다.

기술 스택(Stack): React 18 + TypeScript + Vite + Parcel (번들링) + Tailwind CSS + shadcn/ui

디자인 및 스타일 가이드라인

매우 중요: "AI가 만든 뻔한 느낌(AI slop)"을 피하기 위해, 과도한 중앙 정렬 레이아웃, 보라색 그라데이션, 일률적인 둥근 모서리, Inter 폰트 사용을 지양하세요.

빠른 시작 (Quick Start)

Step 1: 프로젝트 초기화