코드 변경하기

Stephen Grider · 강사

이 프로젝트에 변경을 몇 가지 해 보겠습니다. 그 과정에서 Claude Code의 유용한 기능 몇 가지를 보여 드리겠습니다. 먼저 왼쪽에 있는 자리표시(placeholder) 텍스트를 패널 가운데로 옮기고 싶습니다. 어떤 콘텐츠를 옮기려는지 Claude가 정확히 이해하도록, 그 영역을 스크린샷으로 찍어 Ctrl+V로 Claude Code에 붙여넣습니다.

맥OS에서 익숙한 Command+V가 아니라 Control+V라는 점에 유의하세요. 스크린샷을 붙여넣을 때는 특별히 Control+V를 씁니다. 그런 다음 Claude에게 그 자리표시를 가운데로 옮겨 달라고 합니다. 조금 찾아본 뒤 Claude가 스타일을 수정하고, 브라우저로 돌아가 보면 보기 좋게 가운데로 옮겨져 있습니다.

다음으로 제목과 설명을 보여 주는 카드 컴포넌트를 만들어 달라고 합니다. 카드는 문제없이 생성됩니다. 그런데 한 가지 어색한 게 있습니다. 왼쪽 채팅 인터페이스에 'String Replace Editor'라는 게 보입니다. 그 작은 패널은 파일이 생성되고 있음을 사용자에게 알리려는 것인데, 지금은 뒤에서 쓰이는 도구의 기술적인 이름인 'String Replace Editor'를 그대로 노출합니다.

사용자에게는 좀 더 친근한 문구를 보여 주고 싶습니다 — 파일이 생성되고 있고 그 파일 이름이 무엇인지 정도요. 물론 챗봇이 파일을 편집하거나 삭제하는 경우 등도 함께 처리해야 합니다. Claude의 주의를 정확히 모으기 위해 이 부분도 스크린샷으로 찍어 붙여넣고, 그 문구를 더 친근한 메시지로 바꿔 달라고 합니다.

이건 좀 까다로운 작업이라, 완성하려면 Claude가 프로젝트를 꽤 많이 조사해야 합니다. 어려운 작업을 줄 때 Claude의 지능을 손쉽게 끌어올리는 방법이 두 가지 있습니다. 첫째는 플랜 모드(Plan mode)를 켜는 것입니다. 플랜 모드는 Shift+Tab을 두 번 눌러 켜는데, 이미 파일 편집을 자동 수락 중이라면 한 번만 누르면 됩니다. 플랜 모드에서 Claude는 프로젝트 내용을 훨씬 많이 조사하고, 더 많은 파일을 읽으며, 작업을 끝낼 상세한 계획을 세웁니다. 계획을 마치면 무엇을 할지 정확히 알려 주고, 그때 계획을 수락하거나(그러면 Claude가 구현합니다) 빠진 파일·고려 못 한 시나리오가 있으면 방향을 다시 잡아 줄 수 있습니다.

둘째는 사고(thinking)를 켜는 것입니다. 이건 Claude의 확장 사고 기능을 켜서 특정 작업을 더 깊이 추론하게 합니다. 사고를 켜는 트리거 문구가 몇 가지 있는데, 각 문구는 점점 더 큰 토큰 예산을 사고에 줍니다. 이번엔 까다로운 작업이라 'ultrathink(울트라싱크)'로 가장 깊이 생각하라고 요청할 수 있습니다. 그리고 플래닝과 사고는 함께 쓸 수 있어서, ultrathink에 더해 플랜 모드도 같이 켭니다.

언제 플래닝을 쓰고 언제 사고를 쓰면 좋을까요? 둘을 '넓이 대 깊이'로 생각하면 됩니다. 플랜 모드는 코드베이스를 넓게 이해해야 하거나 여러 영역을 살펴야 하는 작업, 그리고 여러 단계가 필요한 작업에 좋습니다. 사고는 까다로운 로직 한 부분에 집중하거나 어려운 버그를 파헤칠 때 좋습니다. '그냥 항상 둘 다 켜면 되지 않냐'고요? 그래도 됩니다. 다만 플래닝과 사고는 추가 토큰을 쓰므로 비용이 따른다는 점만 기억하세요.

몇 분 작업하니 기능이 완성된 것 같습니다. 에디터로 돌아가 테스트해 보면, 이전보다 더 나은 상태 정보가 보입니다 — 사용자에게 파일이 생성되고 있다고 알려 줍니다. 후속 요청으로 제목을 바꿔 보면, 이번엔 파일을 편집 중이라는 표시가 보입니다 — app.jsx 파일을 편집 중이라고요. Claude가 이 기능을 확실히 잘 구현했습니다. 이제 변경을 했으니 커밋하는 게 좋겠습니다. Claude Code는 든든한 Git 도우미라, 변경을 스테이징·커밋해 달라고 하면 알맞은 커밋 메시지까지 써 줍니다.