Claude Code 설치부터 첫 교구 만들기 | 윈도우 교사용 15분 가이드 — 터미널이 처음이어도 OK

터미널? 까만 화면? 무서워하지 마세요.
저도 처음엔 그랬는데, 한번 해보니까 이게 진짜 세상이 바뀌더라고요.

오늘은 윈도우 PC에서 Claude Code를 설치하고, 첫 번째 수업 교구(OX퀴즈 HTML)를 직접 만들어 보는 과정을 15분 안에 함께 해보겠습니다. 코딩 경험이 전혀 없어도 괜찮습니다.

📌 한눈에 보기

  • 대상: 코딩 경험 없는 교사 (윈도우 사용자)
  • 소요 시간: 약 15분
  • 준비물: 윈도우 PC, 인터넷 연결
  • 결과물: 수업에 바로 쓸 수 있는 OX퀴즈 HTML 교구
  • 핵심 명령어 3개: npm install -g @anthropic-ai/claude-codeclaude → 한국어로 요청

Claude Code가 뭔가요?

여러분, 웹에서 ChatGPT나 Claude 쓸 때 이런 경험 있지 않으세요?

  1. AI한테 코드를 만들어 달라고 한다
  2. 코드를 복사한다
  3. 메모장이나 VS Code를 열어서 붙여넣기한다
  4. 파일을 저장한다
  5. 브라우저로 열어본다
  6. 수정할 게 있으면 다시 1번으로...

솔직히, 피곤하죠.

Claude Code는 이 과정을 완전히 바꿔줍니다. 터미널(까만 화면)에서 Claude와 대화하면, Claude가 직접 파일을 만들고, 수정하고, 실행까지 해줍니다. 여러분은 그냥 한국어로 "이거 만들어줘"라고 말하면 됩니다.

❌ 웹 Claude 작업 흐름

코드 생성 → 복사 → 붙여넣기 → 저장 → 확인 → 수정 요청 → 다시 복사...

5~6단계 반복

✅ Claude Code 작업 흐름

요청 → 파일 자동 생성 → 확인 끝!

수정도 "여기 고쳐줘" 한 마디면 OK

Step 1. Node.js 설치하기

💻 Node.js가 뭔가요?

Claude Code를 실행하려면 Node.js라는 프로그램이 필요합니다. 어렵게 생각하지 마세요. 그냥 "Claude Code가 돌아가는 엔진" 정도로 이해하시면 됩니다.

  1. nodejs.org에 접속합니다.
  2. 화면에 보이는 초록색 LTS 버튼을 클릭해서 다운로드합니다.
    • LTS = Long Term Support. 안정적인 버전이라는 뜻이에요.
  3. 다운로드된 설치 파일을 실행합니다.
  4. 다음 → 다음 → 다음 → 설치 완료! (기본 설정 그대로 두시면 됩니다.)

설치가 잘 됐는지 확인해 볼까요? 아래처럼 해보세요.

# 키보드에서 Win 키를 누르고 "PowerShell"을 검색해서 실행하세요
# 그리고 아래 명령어를 입력하세요

node --version
# v22.x.x 같은 숫자가 나오면 성공! 🎉

숫자가 나왔으면 완벽합니다! 다음 단계로 넘어가세요.

Step 2. Claude Code 설치하기

Node.js가 설치됐으면, 이제 진짜 주인공인 Claude Code를 설치할 차례입니다.

# PowerShell에서 아래 명령어를 입력하세요 (복사해서 붙여넣기 OK)

npm install -g @anthropic-ai/claude-code

뭔가 주루룩 글자가 올라가면서 설치가 진행됩니다. 1~2분 정도 기다리면 끝!

💡 "npm이 뭐예요?"

npm은 Node.js와 함께 자동으로 설치되는 프로그램 관리 도구입니다. 앱스토어에서 앱 설치하는 것처럼, npm으로 Claude Code를 설치한다고 생각하시면 됩니다. 별도로 설치할 필요 없어요!

Step 3. 인증하기 (Anthropic 계정 연결)

설치가 끝났으면, Claude Code를 Anthropic 계정과 연결해야 합니다.

# PowerShell에서 입력
claude
  1. claude라고 입력하면, 터미널에 로그인 링크가 나타납니다.
  2. 그 링크를 클릭하면 브라우저가 열립니다.
  3. Anthropic 계정으로 로그인합니다. (계정이 없다면 이때 만드시면 됩니다.)
  4. 로그인이 완료되면 터미널로 돌아와서 자동으로 연결됩니다.

터미널에 > 표시가 나타나면서 입력을 기다리고 있으면 성공입니다!

💡 요금 안내

Claude Code는 Anthropic의 API 사용료가 발생합니다. 처음 가입하면 소액의 무료 크레딧이 제공되는 경우가 있고, 이후에는 사용량에 따라 과금됩니다. 간단한 교구 한두 개 만드는 데는 보통 몇백 원 수준이에요. 또는 Claude Pro/Max 구독이 있다면 구독 내에서 사용할 수도 있습니다.

Step 4. 첫 교구 만들기 🎉

드디어 진짜 재미있는 부분입니다! 바로 수업용 교구를 만들어 봅시다.

🎯 목표

학생들이 브라우저에서 바로 풀 수 있는 OX퀴즈 HTML 교구를 만듭니다.

4-1. 작업 폴더로 이동하기

먼저, 파일을 저장할 폴더를 정해야 합니다. 바탕화면에 만들어 볼게요.

# 바탕화면에 교구 폴더 만들기
mkdir ~/Desktop/교구

# 그 폴더로 이동하기
cd ~/Desktop/교구

4-2. Claude Code 실행하고 요청하기

# Claude Code 실행
claude

Claude Code가 실행되면, 그냥 한국어로 말하면 됩니다.

> OX퀴즈 HTML 교구를 만들어줘.
  과목은 통합사회, 주제는 "인권의 의미와 발전".
  문제는 5개로 하고, 정답을 맞히면 초록색,
  틀리면 빨간색으로 표시해줘.
  마지막에 점수도 보여줘.

이렇게 입력하면 Claude가 잠시 생각하더니... 파일을 직접 만들어 줍니다!

터미널에 이런 메시지가 나타납니다:

✅ Created ox-quiz.html

네, 진짜 이게 끝입니다. 파일이 이미 여러분의 폴더에 저장되어 있어요.

Step 5. 결과 확인하기

  1. 파일 탐색기에서 바탕화면 → 교구 폴더를 엽니다.
  2. ox-quiz.html 파일이 보일 거예요.
  3. 이 파일을 더블클릭하면 브라우저에서 열립니다.
  4. 🎉 퀴즈가 작동하는 걸 확인해 보세요!

어떤가요? 코드를 한 줄도 직접 쓰지 않았는데, 수업에 바로 쓸 수 있는 교구가 만들어졌습니다.

이게 왜 대단한 건가요?

"웹 Claude로도 코드 만들어 달라고 할 수 있잖아요?"라고 생각하실 수 있어요. 맞습니다. 하지만 결정적인 차이가 있습니다.

웹 Claude

  1. 코드 만들어 달라고 요청
  2. 생성된 코드를 눈으로 찾아서 복사
  3. 메모장 열어서 붙여넣기
  4. 파일 이름 정하고 저장
  5. 브라우저에서 열어보기
  6. 수정할 부분 발견하면 다시 1번으로

매번 복사-붙여넣기의 반복...

Claude Code

  1. 한국어로 요청
  2. 파일 자동 생성!
  3. 수정? "타이머 추가해줘" 한 마디면 끝

손이 편하니까 아이디어에 집중할 수 있어요

특히 교구를 만들 때는 "한 번에 완벽하게" 되는 경우가 드물잖아요. "여기 색깔 바꿔줘", "문제 3개 더 추가해줘", "모바일에서도 잘 보이게 해줘" 같은 수정 요청을 계속하게 되는데, 이때 Claude Code의 진가가 발휘됩니다. 매번 복사-붙여넣기 할 필요 없이, 그냥 말하면 파일이 바로 수정되니까요.

💡 꼭 기억할 팁: 후속 요청이 핵심!

Claude Code의 진짜 힘은 "대화"에 있습니다

첫 번째 결과물이 마음에 100% 들지 않아도 괜찮습니다. 오히려 그게 자연스러운 거예요. 핵심은 후속 요청입니다.

이런 식으로 계속 대화하면서 다듬어 보세요:

> 이 파일에서 글자 크기를 좀 더 키워줘

> 정답 해설도 추가해줘

> 타이머 기능을 넣어줘. 문제당 30초

> 배경색을 좀 더 밝게 바꿔줘

> 학생 이름을 입력하는 칸을 맨 위에 추가해줘

이렇게 한 마디씩 요청할 때마다, Claude가 기존 파일을 직접 수정해줍니다. 새로 복사-붙여넣기 할 필요가 전혀 없어요. 마치 옆에 개발자 동료가 앉아서 실시간으로 고쳐주는 느낌이랄까요.

이게 바로 Claude Code를 쓰는 진짜 이유입니다. "만들기"보다 "다듬기"가 더 중요하고, 더 쉬워집니다.

🚀 다음 글 예고

Claude Code로 디버깅하기
"어? 왜 안 되지?" 하는 순간, Claude Code에게 "이거 왜 안 돼?"라고 물어보면 됩니다.
에러 메시지를 읽고, 원인을 찾고, 고치는 것까지 자동으로!

곧 찾아옵니다 👋

이 글이 도움이 되셨다면 댓글로 알려주세요! 궁금한 점이나 설치 중 막히는 부분이 있으면 편하게 질문해 주시고요. 같은 고민을 하는 선생님이 분명 계실 거예요. 😊

현직 고교 교사가 전하는 통합사회·경제의 정석. 고퀄리티 수업 PPT와 HTML 시뮬레이션 교구, 생생한 여행 기록을 통해 사회를 풀어냅니다.