같이 적을 것

• 정적 파일이 있는 폴더의 경로.
• 준비해 둔 Next.js 폴더의 경로.
• 옮길 페이지 목록. 전부이면 전부라고 적는다.
• 반드시 그대로여야 하는 동작. 예: 메뉴 열기, 폼 검사, 목록 필터.
• 확인 방법. npm run dev로 주요 링크와 버튼을 누른다.

요청 문장

아래를 복사한 뒤 경로와 동작만 자기 프로젝트에 맞게 고친다.

정적 폴더: (HTML이 있는 경로)
Next.js 폴더: (create-next-app으로 만든 경로)

이 HTML·CSS·JavaScript를 App Router 페이지로 옮겨 줘.
- CSS는 기존 파일을 그대로 써 줘. Tailwind를 추가하지 마.
- 머리글과 바닥글은 app/layout.js로 모아 줘.
- 반복되는 카드는 컴포넌트로 나눠 줘.
- 클릭과 입력만 useState와 이벤트로 다시 써 줘.
- 주소는 기존 파일 이름을 따라 줘. index.html은 /, about.html은 /about.
- 이미지는 public에 두고 경로를 고쳐 줘.
- 변환 후 npm run dev로 주요 링크와 버튼을 확인해 줘.
- 정적 원본과 다른 프로젝트 폴더는 지우거나 수정하지 마.

확인

결과가 열리면 정적 사이트에서 되던 일을 같은 순서로 누른다. 첫 화면만 보고 끝나지 않는다. 빈 목록, 잘못된 입력, 모바일 폭에서 메뉴가 열리는지도 원본과 비교한다.

어긋나면 그 페이지 이름과 누른 버튼을 적어 다시 요청한다. 앱 전체를 다시 만들라고 하지 않는다.

이 문장으로 요청해도 변환 도구가 없는 대화에서는 파일이 바뀌지 않는다. 파일을 고치는 모드에서 두 폴더를 지정해야 한다.