AI가 만든 코드가 한 파일에 다 몰려 손댈 수 없을 때
이런 증상이라면
기능은 도는데 page.tsx 하나가 몇백~몇천 줄입니다. 어디에 뭐가 있는지 모르겠고, 한 줄 고치기가 무서워서 새 기능 추가를 못 하겠습니다.
흔한 원인 (가능성 순)
1AI가 요청마다 있던 파일에 계속 덧붙였다코드
"여기에 이것도 추가해줘"를 반복하면 AI는 구조를 다시 짜기보다 기존 파일에 계속 이어 붙입니다. 그래서 한 파일이 비대해집니다.
2처음에 구조(어떤 화면·데이터가 있는지)를 안 정하고 시작했다코드
기획 없이 "일단 만들어줘"로 시작하면, 나중에 나눌 기준이 없어 전부 한 곳에 쌓입니다. 이건 코드 문제라기보다 설계 문제입니다.
확인·해결 순서
- 먼저 지금 상태를 저장/커밋해 되돌릴 지점을 만든다
- 한 번에 하나씩만: 눈에 띄게 독립적인 덩어리(예: 헤더, 목록 카드, 폼)를 하나 골라 별도 컴포넌트 파일로 뺀다
- 뺀 뒤 화면이 그대로인지 확인하고 커밋 → 다음 덩어리로 반복(한꺼번에 다 쪼개려 하지 않는다)
- 데이터를 가져오는 부분과 화면을 그리는 부분을 분리하면 이후 수정이 훨씬 안전해집니다
자주 묻는 질문
AI한테 "파일 좀 나눠줘" 하면 안 되나요?
작게 범위를 주면 도움이 되지만, 한 번에 전부 나눠달라고 하면 옮기는 과정에서 자주 깨집니다. 한 덩어리씩, 나눌 때마다 화면을 확인하며 진행하세요.
지금 도는데 굳이 나눠야 하나요?
당장은 아니어도, 새 기능을 붙일 때마다 깨진다면 그 신호입니다. 구조를 한 번 잡아두면 이후 AI에게 시키는 것도 훨씬 잘 됩니다.
위를 다 해봤는데도, 또는 AI(Cursor·Claude)한테 물어봐도 계속 같은 에러라면 — 에러 로그를 붙여넣으면 60초 안에 진짜 원인을 짚어드려요.
이 문제 무료로 AI 진단받기