Claude Code 시작하기: 비개발자의 첫 결과물 만들기

한눈에 요약

• 이 편은 설치 설명서가 아니라 “첫 결과물 하나 만들기” 실습이에요. 설치와 개념은 C12. Claude Code 개요에 있어요.
• 빈 폴더에서 시작해 계획 모드로 계획 확인 → 승인 → 파일 생성 → 브라우저로 확인 → 수정 요청 순서로 웹페이지 하나를 만들어요.
• 코드를 읽을 줄 몰라도 돼요. 대신 무엇을 만들지 말로 정하고, 바뀌는 내용을 승인 화면에서 확인하는 습관이 필요해요.
• 잘못되면 /rewind로 되돌릴 수 있어요. 작은 요청 → 확인 → 다음 요청으로 가세요.
• Claude Code는 Pro 이상 유료 플랜에서 쓸 수 있어요(2026-10-10 기준).

이 튜토리얼로 할 수 있게 되는 것

• 빈 폴더에서 Claude Code를 시작하고, 만들고 싶은 것을 일반 문장으로 설명할 수 있어요.
• 계획 모드로 “무엇을 할지” 먼저 확인한 뒤 승인해서 실제 파일을 만들 수 있어요.
• 만든 결과를 브라우저에서 열어 보고, 고칠 점을 말로 요청할 수 있어요.
• 마음에 안 들면 되돌리는 방법과, 다음에 같은 프로젝트를 이어서 하는 방법을 알아요.

먼저 알아둘 개념

설치 방법과 용어 전체는 C12에서 다뤄요. 이 실습에서 꼭 필요한 것만 짚을게요.

용어	이 실습에서의 뜻
터미널	글자로 컴퓨터에 일을 시키는 창이에요. 처음이라면 공식 문서의 터미널 안내(terminal guide)가 여는 법과 명령 붙여넣는 법을 설명해요.
작업 폴더	Claude Code가 읽고 쓰는 범위예요. 빈 폴더 하나를 만들어 거기서만 시작하면 안전해요.
권한 모드	Claude가 승인 없이 해도 되는 동작 범위예요. Shift+Tab으로 바꿔요. 이 실습에서는 바꾸기 전에 묻는 수동(Manual) 모드로 두는 게 안전해요. 공식 문서에 따르면 Claude Code v2.1.283 이상의 터미널 기본 시작 모드는 자동(auto) 모드이니, 시작 화면의 모드 표시를 확인하세요(2026-10-12 기준).
계획 모드	파일을 바꾸지 않고 읽기만 하면서 계획을 제안하는 모드예요. 승인 전에는 편집이 막혀요.
CLAUDE.md	프로젝트에 대한 안내 메모예요. 다음 세션에서도 Claude가 읽어요.

어떤 화면에서 하나요?

이 실습은 터미널 기준이에요. 터미널이 낯설다면 데스크톱 앱의 Code 탭에서도 같은 일을 할 수 있어요. 앱은 변경 내용을 시각적으로 검토하기 좋고, CLI를 따로 설치하지 않아도 돼요(유료 구독 필요). 선택 기준은 C12의 표를 보세요.

단계별 따라하기

이번에 만들 것은 **“회의 안내 한 장짜리 웹페이지”**예요. 날짜, 장소, 안건, 준비물을 보여 주는 페이지로, 코딩 지식 없이도 결과가 눈에 보여서 첫 실습으로 좋아요. 다른 주제여도 순서는 같아요.

0/7 완료

• 빈 폴더를 만들고 그 폴더에서 claude를 실행했어요
• 계획 모드에서 계획을 먼저 받았어요
• 계획을 읽고 승인해서 파일을 만들었어요
• 만들어진 index.html을 브라우저에서 열어 봤어요
• 고칠 점을 말로 요청해서 반영했어요
• /rewind 또는 되돌리기 방법을 확인했어요
• CLAUDE.md를 만들어 다음 세션 준비를 했어요

1. 빈 폴더를 만들고 시작하기

   바탕화면 등에 meeting-page라는 빈 폴더를 만들어요. 터미널을 열고 그 폴더로 이동한 뒤 claude를 실행해요.

   cd ~/Desktop/meeting-page
   claude

   처음이라면 로그인 안내가 나와요. 브라우저에서 인증을 마치면 돼요(자세한 로그인 동작은 C12 참고). 일부러 빈 폴더에서 시작하는 이유는, 기존 파일을 건드릴 일이 없어서 실수해도 부담이 없기 때문이에요.

   이 단계에서 보게 될 화면

   빈 폴더에서 claude를 실행한 첫 화면

   공식 도움말에서 이 화면 보기 ↗

   실제 화면은 서비스 업데이트에 따라 다를 수 있어요

2. 계획 모드로 바꾸고 계획부터 받기

   Shift+Tab을 눌러 권한 모드를 계획 모드로 바꿔요. 자동 모드에서 시작했다면 수동 → 편집 자동 승인 → 계획 모드 순서로 돌아가니 여러 번 눌러야 할 수 있고, 화면 아래 상태 표시줄에 현재 모드가 나와요. 또는 처음부터 claude --permission-mode plan으로 시작하거나, 요청 앞에 /plan을 붙일 수 있어요. 계획 모드에서는 Claude가 파일을 바꾸지 않고 계획만 제안해요.

   이 프롬프트를 복사해서 붙여넣으세요복사

   회의 안내용 웹페이지 한 장을 만들고 싶어. 코딩은 전혀 몰라. 보여줄 내용은 회의 제목, 날짜와 시간, 장소, 안건 3개, 준비물이야. 어떤 파일을 만들고 화면이 어떻게 보일지 쉬운 말로 계획을 먼저 알려 줘. 파일은 index.html 하나로만 만들어 줘.

   계획이 나오면 읽어 보세요. 파일 이름이 하나뿐인지, 외부 서비스에 연결하지 않는지 확인하면 충분해요. 마음에 안 드는 부분은 말로 고쳐 달라고 하세요.

3. 계획을 승인하고 파일 만들기

   계획이 괜찮으면 승인해서 실행으로 넘어가요. 공식 문서 기준 선택지는 “Yes, and use auto mode”, “Yes, manually approve edits”, “No, keep planning”이에요(표기는 상황에 따라 다를 수 있어요). 처음에는 편집마다 확인할 수 있는 “Yes, manually approve edits”가 안전해요. Claude가 변경 내용을 보여 주며 승인을 물으면 어떤 파일이 만들어지는지만 확인하고 Yes를 선택해요.

   승인 화면에서 볼 것

   처음에는 코드를 읽을 필요가 없어요. (1) 작업 폴더 안의 파일인지, (2) 처음 말한 파일(index.html)이 맞는지, (3) 내가 시키지 않은 파일 삭제나 폴더 밖 접근이 없는지만 보세요.

4. 브라우저에서 결과 확인하기

   폴더 안에 index.html이 생겼을 거예요. 파일을 더블클릭하면 브라우저에서 열려요. 파일 열기 방법이 헷갈리면 Claude에게 물어보세요.

   이 프롬프트를 복사해서 붙여넣으세요복사

   만들어진 index.html을 내 컴퓨터에서 어떻게 열어 보면 되는지 알려 줘. 그리고 지금 페이지에 어떤 내용이 들어 있는지 한 줄씩 요약해 줘.

   이 단계에서 보게 될 화면

   브라우저에서 연 회의 안내 페이지

   실제 화면은 서비스 업데이트에 따라 다를 수 있어요

5. 고칠 점을 말로 요청하기

   보면서 바꾸고 싶은 점을 하나씩 요청해요. 한 번에 한두 가지만 하면 무엇이 바뀌었는지 알기 쉬워요.

   이 프롬프트를 복사해서 붙여넣으세요복사

   제목 글자를 더 크게 하고, 안건 3개는 번호가 있는 목록으로 바꿔 줘. 전체 배경은 연한 회색으로, 글꼴은 읽기 편한 기본 글꼴로 해 줘. 바꾸기 전에 무엇을 어떻게 바꿀지 한 줄로 알려 줘.

   요청한 뒤에는 브라우저에서 새로고침(F5)으로 확인해요. 모르는 용어가 나오면 “방금 한 변경을 초등학생도 알게 설명해 줘”라고 요청하세요.

6. 되돌리기 연습하기

   일부러 마음에 안 드는 변경을 요청해 보고 되돌려 보세요. 세션 안에서 /rewind를 입력하면 이전 체크포인트로 되돌리는 화면이 나와요. 선택지의 정확한 표기는 화면 안내를 따르세요. 중요한 결과물은 별도 폴더에 복사해 두면 더 안전해요.

7. CLAUDE.md로 다음을 준비하기

   내일 다시 열어도 Claude가 이 프로젝트를 이해하도록 안내 메모를 만들어요.

   이 프롬프트를 복사해서 붙여넣으세요복사

   이 프로젝트가 무엇이고 어떤 파일이 있는지, 내가 코딩을 모르니 설명은 쉬운 말로 하고 파일을 바꾸기 전에 항상 알려 달라는 내용을 CLAUDE.md로 정리해서 저장해 줘.

   /init 명령은 코드베이스를 분석해서 시작용 CLAUDE.md를 만들어 줘요. 파일이 거의 없는 지금은 위처럼 직접 요청하는 쪽이 더 잘 맞아요. 이어서 작업하려면 같은 폴더에서 claude -c(가장 최근 대화 이어가기)나 claude -r(고르기)를 쓰세요.

빠른 참조표

첫 결과물 만들기 흐름

단계	하는 일	쓰는 것
1	빈 폴더에서 시작	cd, claude
2	계획 먼저 받기	Shift+Tab 또는 claude --permission-mode plan
3	승인하고 만들기	승인 화면
4	눈으로 확인	브라우저로 index.html 열기
5	한 번에 한두 가지씩 수정 요청	일반 문장
6	되돌리기	/rewind
7	다음을 위한 메모	CLAUDE.md, claude -c

비개발자에게 도움이 되는 명령

명령	용도
/help	명령어 목록
/rewind	체크포인트로 되돌리기
/clear	새 대화 시작(파일은 그대로)
/resume, claude -r	이전 대화 골라서 이어가기
claude -c	이 폴더의 가장 최근 대화 이어가기
/init	CLAUDE.md 만들기
Shift+Tab	권한 모드 순환

요청이 좋아지는 문장 틀

상황	이렇게 말해 보세요
막막할 때	“어떤 방법들이 있는지 쉬운 말로 3가지만 알려 줘. 아직 파일은 바꾸지 마.”
바꾸기 전 확인	“바꾸기 전에 무엇을 어떻게 바꿀지 한 줄로 알려 줘.”
이해가 안 될 때	“방금 변경을 코딩을 모르는 사람에게 설명하듯 알려 줘.”
끝낼 때	“오늘 한 일과 남은 일을 CLAUDE.md에 정리해 줘.”

자주 막히는 지점

Claude가 너무 많은 파일을 만들었어요

• 원인: 요청에서 파일 개수를 정하지 않았을 수 있어요.
• 해결: /rewind로 되돌리고, “파일은 index.html 하나로만”처럼 범위를 못 박아 다시 요청하세요. 계획 모드에서 계획을 먼저 보면 이런 일을 줄일 수 있어요.

브라우저에서 열었는데 아무것도 안 보이거나 깨져 보여요

• 원인: 저장 위치가 다르거나, 브라우저가 이전 화면을 보여 주고 있을 수 있어요.
• 해결: 새로고침(F5)을 해 보세요. 그래도 같으면 Claude에게 “브라우저에서 열었더니 빈 화면이야. 원인을 찾아서 고쳐 줘”라고 화면 상황을 말로 설명하세요.

승인을 계속 눌러야 해서 번거로워요

• 원인: 수동(Manual) 모드는 변경마다 승인을 묻는 방식이에요.
• 해결: 익숙해지면 Shift+Tab으로 파일 편집을 자동 승인하는 모드(acceptEdits, 화면 표기 “accept edits”)를 쓸 수 있어요. 대신 되돌릴 수 있는 폴더(빈 폴더나 Git 저장소)에서만 쓰세요. 모드별 의미는 C14를 보세요.

claude를 찾을 수 없다고 나와요 / 로그인이 안 돼요

• 원인: 설치 직후 열어 둔 터미널을 그대로 쓰거나, 플랜이 Free일 수 있어요.
• 해결: 새 터미널을 열고 claude --version을 확인하세요. Claude Code는 Pro 이상 유료 플랜에서 쓸 수 있어요(2026-10-10 기준). 자세한 해결은 C12의 막히는 지점을 보세요.

결과물을 남에게 보여 주려면요

• 방법: index.html 파일 자체를 메일 등으로 보낼 수 있어요. 웹 주소로 공개하고 싶다면 8편 GitHub Pages 배포 실습을 보세요. 공개 전에는 이름, 연락처 등 개인정보가 들어 있지 않은지 꼭 확인하세요.

실전 팁

• 처음에는 늘 작게. “전체 홈페이지”보다 “한 장짜리 페이지”가 성공하기 쉬워요.
• 보이는 것으로 확인하세요. 코드를 못 읽어도 브라우저 화면은 읽을 수 있어요. 틀린 부분은 화면 기준으로 말하면 돼요.
• 한 번에 한두 가지만 바꿔 달라고 하세요. 어디서 망가졌는지 찾기 쉬워요.
• 개인정보와 회사 기밀은 넣지 마세요. 연습용 예시 내용으로 시작하세요.
• 계속 쓰고 싶다면 데스크톱 앱의 Code 탭이나 Claude Academy의 Claude Code 101 같은 무료 강좌를 활용해 보세요.

다음에 볼 튜토리얼

• 7. 코딩을 몰라도 되는 업무용 웹 도구 만들기 — 견적 계산기로 한 걸음 더
• C12. Claude Code 개요 — 설치와 표면 선택
• C14. Claude Code 핵심 기능 — CLAUDE.md, 권한 모드, 계획 모드