← 전체 커리큘럼
WEEK 01

작업 환경 만들고, 설계·시안까지

오늘은 웹과 앱을 실제로 코딩하지 않고 시안까지만 만듭니다. 시안은 아티팩트로 띄워 확인합니다. 끝날 때면 뭘 만들지 · 뭘 안 만들지 · 어떻게 생겼는지가 전부 정해져 있습니다. 다음 주에는 그 문서를 보면서 그대로 만듭니다.

날짜9월 14일 (월)
시간21:00~23:00
난이도입문
선수 학습Week 0 설치 세션

학습 목표

이 회차가 끝나면 여러분은:

  • 새 폴더를 Claude Code workspace로 꾸밀 수 있다 — CLAUDE.md · .claude/skills/ · docs/ 폴더
  • Claude에게 물어봐 달라고 해서 만들 것을 하나로 좁힐 수 있다
  • 만들 것과 안 만들 것을 나눌 수 있다
  • 정한 것을 설계 문서(PRD)로 남기고, 화면을 보고 나서 고쳐 쓸 수 있다
  • 웹(관리하는 쪽)과 앱(신청하는 쪽) 화면 시안을 보고 고를 수 있다

커리큘럼 구성

2부 · 21:00~23:00 · 준비된 프롬프트 상자를 붙여넣으며 진행합니다

1부 · 프로젝트 환경 설정

setup-prompt — 새 폴더를 workspace로

  • 새 폴더 만들기 → VS Code로 열기 → Claude Code에 프롬프트 붙여넣기
  • CLAUDE.md — Claude가 매 대화 시작 때 먼저 읽는 규칙 문서
  • .claude/skills/ — Skill을 넣어 두는 폴더
  • docs/ 하위 폴더 4개 — 10.input 원본 · 20.working 작업 중 · 30.output 결과물 · 90.reference 참고
  • 매번 붙여넣기 싫으면 /init-workspace Skill로 한 줄 실행
2부 · 웹과 앱 제작을 위한 사전준비 · 시안 작성

제작prompt — 0단계부터 9단계까지, 한 번에 한 단계씩

  • 0단계 인사하기 — 설치가 잘 됐는지 확인
  • 1단계 무엇을 만들지 정하기 — 예시 12개 중 고르거나 직접 말하기
  • 2단계 어떻게 쓰이는지 이야기하기 — 지금은 어떻게 하고, 뭐가 불편한지
  • 3단계 무엇을 만들지 정하기
  • 4단계 정한 것을 문서로 모으기 → 브레인스토밍.md
  • 5단계 남들은 어떻게 하나 보기 — 비슷한 서비스 찾아보기
  • 6단계 갈림길 고르기 — 누가 신청하나 · 마감 · 취소 · 받을 정보
  • 7단계 설계 문서 만들기 → PRD.md
  • 8단계 ⭐ 화면 골라보기 — 두 장씩 네 번 (웹 8-1·8-2, 앱 8-3·8-4). 시안은 아티팩트 링크로 열어 A·B·C 중에 고릅니다
  • 9단계 설계 문서 고쳐 쓰기 — 화면을 보고 바뀐 것과 이유를 남기기

오늘 끝나면 폴더에 남는 것

  • CLAUDE.md · .claude/skills/ · docs/ — 1부에서 만든 workspace
  • docs/20.working/브레인스토밍.md — 정해 온 과정
  • docs/20.working/PRD.md — 설계 문서 (화면 반영본)
  • docs/90.reference/참고링크.md — 찾아본 서비스
  • 화면 시안 네 장 — 아티팩트 링크 (아티팩트가 안 뜨면 docs/30.output/시안-8-*.html 파일)

이론 · 미리 읽을거리

강의 전에 읽어두면 훨씬 수월합니다. 몰라도 수업은 따라올 수 있습니다.

1. Claude Code는 무엇이 다른가

  • ChatGPT 웹은 답을 말해주고, Claude Code는 내 컴퓨터의 파일을 직접 만들고 고칩니다.
  • 작업은 항상 폴더 단위로 이루어집니다. 폴더를 열어주는 것이 곧 “여기서 일해라”라는 뜻입니다. 그래서 1부에서 폴더부터 꾸밉니다.

2. CLAUDE.md — 매번 설명하지 않는 법

  • workspace에 CLAUDE.md 파일을 두면 Claude가 대화를 시작할 때마다 그 내용을 먼저 읽습니다.
  • 폴더 구조와 작업 규칙을 여기 적어두면 매번 말하지 않아도 그대로 따릅니다.

3. Skill — 반복 작업에 이름 붙여 저장하기

  • 같은 요청을 매번 붙여넣는 대신, 작업 순서를 글로 적어 두고 이름만 불러 쓰는 것입니다. /init-workspace 가 그 예입니다.
  • 저장 위치는 .claude/skills/{이름}/SKILL.md 입니다.
  • CLAUDE.md항상 적용되는 배경 규칙이고, Skill은 부를 때만 실행되는 작업 절차입니다.

4. 왜 코드보다 설계가 먼저인가

  • 화면이나 코드가 먼저 나오면 그게 정답 행세를 해서 정하는 과정이 통째로 날아갑니다.
  • 그래서 정하기(1~4단계) → 남들과 견주기(5단계) → 갈림길 고르기(6단계) → 문서로 굳히기(7단계) → 화면 보기(8단계) 순서로 갑니다.
  • PRD는 한 번 쓰고 끝나는 문서가 아닙니다. 화면을 보고 나면 고쳐 씁니다. 그게 9단계입니다.

5. 막혔을 때 그대로 치세요

  • 질문을 한꺼번에 여러 개 한다 — 한 번에 하나씩만 물어봐
  • 답이 너무 길다 — 짧게
  • 자꾸 코드를 짜려고 한다 — 아직 코드 쓰지 마
  • 뭘 해야 할지 모르겠다 — 내가 지금 뭘 하면 돼?
  • 되돌리고 싶다 — 방금 건 취소하고 다시 하자

강의 영상

🎬 Week 1 녹화본

▶ 1주차 녹화본 보기 ↗

암호: ?gew1m4i

강의 자료

📘 Week 1 가이드북

⬇ 1주차 가이드북 PDF 내려받기

설치부터 PRD 고쳐 쓰기까지, 1주차 내용을 책으로 정리했습니다. 127쪽 · 약 15MB

📦 Week 1 실습 자료

⬇ month-claude-2-week1.zip 내려받기

압축을 풀어 workspace에 넣으세요.

압축 안에 들어 있는 파일
  • setup-prompt.md — 1부 환경 설정 프롬프트
  • 제작prompt.md — 2부 단계별 프롬프트 상자 (📋 상자만 복사해서 붙여넣기)
  • 지침서.md — Claude가 읽는 진행 규칙. 제작prompt.md 와 같은 폴더에 둡니다

이번 주 과제

📝 설계 문서 마무리하기

  • 수업에서 9단계까지 못 갔다면 이어서 끝내 오기
  • PRD.md 를 한 번 읽어 보기 — 다음 주에 이 문서를 보면서 만듭니다
  • 막힌 지점은 카톡방에 남기기 — 다음 회차에서 함께 풉니다
  • ⭐ 개발자 계정 신원 확인이 아직이라면 반드시 이번 주에 마무리
NEXT · WEEK 02
안드로이드 앱 만들기