빨간 글씨가 무섭지 않아지는 법: 오류 메시지 읽는 순서

빨간 글씨는 실패가 아니라 단서다

코딩을 처음 해보는 사람이 가장 크게 당황하는 순간이 화면 가득 빨간 글씨가 뜰 때입니다. 뭔가 크게 잘못된 것 같고, 읽어봐도 무슨 말인지 모르겠습니다.

그런데 이 메시지는 "고장났다"는 통보가 아니라 "여기서 이런 이유로 멈췄다"는 설명입니다. 읽는 법을 알면 대부분 스스로 고칠 수 있고, 못 고쳐도 AI에게 정확히 물어볼 수 있습니다.

어디를 먼저 읽나

오류 메시지는 보통 깁니다. 전부 읽을 필요는 없습니다. 세 군데만 보면 됩니다.

첫 줄: 무슨 일이 일어났는지 한 문장으로 요약돼 있습니다. 대개 여기에 답이 있습니다.

파일 이름과 줄 번호: app/page.tsx:42 같은 형태로 나옵니다. 42번째 줄에서 멈췄다는 뜻입니다. 그 줄로 가보면 됩니다.

맨 아래: 여러 오류가 겹쳤을 때 진짜 원인이 아래쪽에 있는 경우가 있습니다. 위쪽만 보고 포기하지 마세요.

중간의 긴 목록은 대부분 "어느 경로를 거쳐 여기까지 왔는가"에 대한 기록이라 처음에는 넘겨도 됩니다.

자주 보게 되는 다섯 가지

is not defined 또는 Cannot find name

없는 이름을 쓰고 있다는 뜻입니다. 오타이거나, 가져오기(import)를 빠뜨렸거나, 변수를 만들기 전에 썼습니다. 대부분 오타입니다.

Cannot read properties of undefined 또는 of null

없는 것에서 뭔가를 꺼내려 했다는 뜻입니다. 환경에 따라 Cannot read property x of undefined처럼 조금 다르게 나오기도 하는데 같은 문제입니다. 예를 들어 데이터가 아직 도착하지 않았는데 그 안의 값을 읽으려 한 경우입니다. 비어 있을 수 있는 상황을 처리하지 않았을 때 나옵니다. 초보자가 가장 자주 만나는 오류입니다.

Module not found 또는 Cannot find module

필요한 파일이나 라이브러리를 못 찾았다는 뜻입니다. 설치 명령을 안 돌렸거나, 파일 경로가 틀렸거나, 파일 이름의 대소문자가 다릅니다.

Unexpected token

문법이 깨졌다는 뜻입니다. 괄호나 따옴표가 짝이 안 맞는 경우가 대부분입니다. 표시된 줄의 바로 위쪽을 보세요. 원인은 대개 한두 줄 앞에 있습니다.

port already in use

이미 같은 것이 실행 중이라는 뜻입니다. 이전에 켜둔 창을 닫지 않았을 가능성이 높습니다. 오류라기보다 알림에 가깝습니다.

오류가 안 나는데 이상한 경우

더 곤란한 상황입니다. 빨간 글씨가 없는데 화면이 비어 있거나 버튼이 안 눌립니다.

이때는 브라우저 개발자 도구를 열어보세요. 대부분의 브라우저에서 마우스 오른쪽 버튼 → 검사, 또는 F12로 열립니다. 거기 콘솔 탭에 빨간 줄이 있으면 그게 원인입니다.

화면에는 안 보이고 콘솔에만 나오는 오류가 많습니다. 이걸 모르면 "아무 일도 안 일어난다"고만 느끼게 됩니다.

AI에게 물어보는 법

혼자 해결이 안 되면 물어보면 됩니다. 답의 질은 질문에 달려 있습니다.

이렇게 물으면 잘 안 됩니다

오류 났어요 고쳐주세요

이렇게 물으면 대체로 해결됩니다

이런 오류가 나왔어:
(빨간 글씨 전체를 그대로 복사해서 붙여넣기)

이 오류가 난 파일의 코드는 이거야:
(해당 부분 붙여넣기)

방금 전에 나는 [무엇을 했는지]를 했어. 그 전에는 잘 됐어.

마지막 줄이 특히 강력합니다. 방금 무엇을 바꿨는지 알려주면 AI가 찾아야 할 범위가 크게 줄어듭니다.

그리고 오류 메시지는 요약하지 말고 그대로 붙여넣으세요. 무의미해 보이는 숫자와 경로가 실제 단서인 경우가 많습니다.

고쳤는데 또 다른 오류가 나면

정상입니다. 오류가 하나 사라지고 다음 오류가 보이는 건 한 걸음 나아갔다는 뜻입니다. 첫 오류가 뒤쪽 코드의 실행 자체를 막고 있었기 때문에 숨어 있던 것입니다.

다만 같은 오류가 계속 반복된다면 방식이 잘못된 것입니다. 이때는 계속 고치지 말고, 잘 되던 시점으로 되돌린 다음 다른 방법으로 접근하는 편이 빠릅니다.

오류 메시지가 영어인데 꼭 읽어야 하나요?

번역해서 봐도 됩니다. AI에게 "이 오류를 쉬운 말로 설명해줘"라고 물어도 됩니다. 다만 검색하거나 질문할 때는 원문 그대로 쓰는 편이 훨씬 정확한 답을 얻습니다. 번역하면 같은 오류를 겪은 다른 사례와 연결되지 않습니다.

오류가 무서워서 시도를 못 하겠는데 어떻게 하나요?

되돌릴 수 있게 해두면 두려움이 크게 줄어듭니다. 잘 동작하는 상태에서 폴더를 통째로 복사해두거나 도구의 되돌리기 기능을 확인해두세요. 언제든 돌아갈 수 있다는 걸 알면 과감하게 시도할 수 있습니다. 실제로 비개발자가 가장 빨리 느는 방법은 많이 시도해보는 것입니다.

오류를 아예 안 만나는 방법은 없나요?

없습니다. 경력이 오래된 개발자도 매일 만납니다. 차이는 오류를 안 만나는 게 아니라 읽고 넘기는 속도입니다. 처음에는 한 시간 걸리던 것이 나중에는 몇 초 만에 원인이 보입니다. 그 차이는 겪은 횟수에서 옵니다.

막히는 지점은 대개 남도 겪는다

혼자 붙들고 있으면 오래 걸리는 문제가, 남에게 보여주면 몇 분 만에 풀리는 경우가 많습니다. 비슷한 상황을 이미 겪어본 사람이 있기 때문입니다.

만든 것이 돌아가는 상태가 됐다면 Vibeollio에 프로젝트 등록해서 공개해보세요. 다른 사람이 직접 눌러보는 과정에서 내 환경에서만 안 보이던 문제가 드러나고, 댓글로 해결 방향을 얻는 경우도 있습니다.