course-template

Claude Code 와 함께 강의용 정적 웹사이트를 만드는 작업 흐름과, 그 흐름의 결과로 만들어진 한 가지 예시(Spring 기초) 가 들어 있는 저장소입니다.

이 저장소가 존재하는 이유 — 강사 누구나 같은 형태의 강의 사이트를 쉽게 만들 수 있도록 준비된 public 저장소 입니다.
① GitHub 에서 클론 해 받으면 ② 6 개의 영구 에이전트 (content-author · visual-designer · convention-auditor · flow-verifier · documentation-curator · layout-verifier) 가 이미 박혀 있어, claude 한 번 실행하고 "커리큘럼 짜줘" 라고 하면 시작됩니다.
③ 슬라이드 템플릿의 빈 블록 (<div data-infographic="...">) 은 누락된 내용이 아니라 이미지·인포그래픽이 들어갈 자리표시 입니다 — visual-designer 에이전트가 본문이 채워진 뒤 이미지를 자동으로 끼워넣는 자리예요.

이 저장소에서 볼 것

• 강사용 메뉴얼 → CLI 설치부터 첫 차시까지 6단계. 다른 강의를 만들고 싶다면 여기부터.
• 이 사이트가 만들어진 과정 → 실제 대화·삽질·토큰 사용량의 솔직한 기록. 메뉴얼만 보면 빠지는 시행착오들.
• starter/ — 시작 키트 새 코스를 만들 때 그대로 복제해서 쓸 빈 골격. cp -r starter/ ~/my-course/
• spring/ — 결과물 예시 (Spring 기초) → 위 흐름으로 만들어진 코스 사이트 한 채. 슬라이드·예제·실습·핸드아웃 4종 자료가 60+ 차시 분량.

구조

course-template/
├─ index.html              ← 이 페이지
├─ for-instructors.html    ← 6단계 메뉴얼
├─ behind-the-scenes.html  ← 솔직한 회고
├─ starter/                ← 시작 키트 (복제용)
└─ spring/                 ← Spring 기초 — 만들어진 결과물 예시

이 저장소를 어떻게 쓰는가

강의를 들으러 온 학생 이라면 spring/ 만 보면 됩니다 (실제 운영 버전은 mp.smhrd.or.kr/edu/spring).

비슷한 강의 사이트를 만들려는 강사 라면 강사용 메뉴얼 부터 시작하세요. GitHub 에서 저장소를 받은 뒤 starter/ 를 복제해 본인 코스로 채우면 됩니다.

중간 점검 팁 — 본인 코스의 1~2 차시가 만들어진 시점에 spring/ 의 같은 위치를 한 번 열어 톤·구조·흐름도를 비교한 뒤 전체 차시를 이어가세요. 후반부 재작업이 줄어듭니다.