60분 · 30장 · 시연 관람형 · VS Code + Claude Code
체크 상태는 이 브라우저에 저장됩니다. 각 항목이 안 될 때의 대응을 아래에 같이 적었습니다.
발표 전날 이 순서대로 하면 시연 환경이 완성됩니다. 단계마다 성공 확인 방법을 적었으니, 확인되지 않으면 다음으로 넘어가지 마세요.
+ → New repositoryteam-notice-page, Public 선택index.html, 아래 내용 붙여넣기<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>팀 공지</title>
<style>
body{margin:0;font-family:system-ui,-apple-system,sans-serif;
display:grid;place-items:center;min-height:100vh;
background:#f5f6f8;color:#0e1116}
.notice{font-size:52px;font-weight:700;letter-spacing:-.02em}
p{font-size:20px;color:#565e6a;margin-top:16px;text-align:center}
</style>
</head>
<body>
<main>
<div class="notice">3월 정기 점검 안내</div>
<p>매월 첫째 주 화요일 02:00 ~ 04:00</p>
</main>
</body>
</html>글자를 크게 둔 이유 — 시연에서 문구 한 줄만 바꿔도 뒷자리에서 바뀐 게 바로 보여야 합니다.
team-notice-page Import이 단계가 준비의 핵심입니다. 22번 슬라이드 전체가 여기에 달려 있습니다.
index.html 열고 연필 아이콘 클릭확인이 끝나면 이 검토 요청은 닫고 브랜치도 지워서 깨끗한 상태로 두세요.
git clone https://github.com/<내계정>/team-notice-page.git
cd team-notice-page
code .gh auth status — 로그인 안 되어 있으면 gh auth logingh auth status가 로그인 상태를 보여 줍니다.gh가 없으면 — 말로 검토 요청을 올릴 수 없습니다. brew install gh로 설치하거나, 4번 단계를 GitHub 웹 화면에서 직접 하는 것으로 시연을 바꾸세요.아래 시연 프롬프트 순서대로 끝까지 한 번 돌려 보세요. 중간에 막히는 곳이 있으면 그 자리가 당일에도 막힙니다.
대사는 그대로 소리 내어 읽어도 되는 문장이고, 키워드는 대사를 잊었을 때 이것만 보고 말할 수 있게 남긴 것입니다. 구간이 바뀔 때 여기 시작을 누르면 위 타이머가 예정 대비 얼마나 빠른지 느린지 알려 줍니다.
15번 → 13번 → 5번 → 27번 순으로 덜어내세요.
절대 자르면 안 되는 것: 3(지도) · 6(브랜치) · 8(검토 요청) · 22(미리보기) · 28~29(마무리)
1·2·3·4번 문장은 슬라이드에 적힌 것과 글자 하나까지 같습니다. 청중이 화면과 슬라이드를 비교하므로 바꾸지 마세요. 5·7번은 프롬프트가 아니라 화면 조작입니다.
각 단계가 끝날 때마다 "지금 서비스는 어떤 상태일까요?"를 물어보세요. 6번 전까지는 답이 계속 "아직 그대로"입니다. 이 반복이 이해를 단단하게 만듭니다.