🔄오픈소스

AI로 웹사이트를 한 번에 복제하는 템플릿

AI 코딩 에이전트를 사용해 명령어 하나로 모든 웹사이트를 Next.js로 복제할 수 있는 오픈소스 템플릿

원본 링크
#웹사이트복제#AI에이전트#Next.js#Claude

프로젝트 소개

AI 코딩 에이전트를 활용해 어떤 웹사이트든 명령어 하나로 깔끔한 Next.js 코드베이스로 복제할 수 있는 템플릿입니다.

주요 기능

원클릭 복제: `/clone-website` 명령어 하나로 웹사이트 전체 분석
자동 추출: 디자인 토큰, 에셋, 컴포넌트 자동 추출
병렬 빌드: 여러 섹션을 동시에 재구성하여 빠른 작업
AI 기반: Claude Code(Opus 4.8) 권장, 다양한 AI 에이전트 호환

시작하기

1. 템플릿으로 새 저장소 생성

GitHub에서 Use this template 버튼을 클릭해 자신만의 저장소를 생성하세요.

⚠️ 주의: 직접 clone하지 말고 반드시 템플릿으로 생성해야 합니다.

2. 저장소 클론

생성한 저장소를 로컬에 클론합니다:

bash
git clone <your-repository-url>

3. AI 에이전트 실행

Claude Code나 다른 AI 코딩 에이전트로 프로젝트를 열고 복제하려는 URL을 지정하면 자동으로 작업이 진행됩니다.

작동 방식

1.AI가 타겟 웹사이트를 검사
2.디자인 요소와 구조 분석
3.컴포넌트 스펙 작성
4.Next.js 코드로 재구성

활용 사례

기존 웹사이트를 현대적인 스택으로 마이그레이션
디자인 참고용 프로토타입 빠르게 제작
웹사이트 구조 학습 및 분석

라이선스

MIT 라이선스로 자유롭게 사용 가능합니다.