이제 진짜로 화면 하나를 만들어볼게요! 웹서비스에서 눈에 보이는 부분을 '프론트엔드(화면)'라고 해요. 우리가 가장 먼저 정복할 조각이죠.
1️⃣ 클로드에게 부탁해요. 두 번째 이미지처럼 "내 소개 웹페이지 만들어줘"라고 하면, HTML이라는 '화면 코드'를 만들어줘요.
2️⃣ 코드를 저장해요. 받은 코드를 전부 복사 → 메모장(또는 메모 앱)에 붙여넣고, 'index.html'처럼 .html로 끝나게 저장해요.
3️⃣ 더블클릭! 저장한 파일을 더블클릭하면 브라우저에 내가 만든 화면이 떠요. 세상에 하나뿐인 내 페이지예요 🎉
claude.ai에서는 만든 화면을 대화창 옆에서 바로 미리보기로 볼 수도 있어요. 마음에 안 들면 "글씨 더 크게", "배경 파랑으로"처럼 말로 고치면 됩니다.
다음 편(#4)에서는 이 화면을 '살아 움직이게' 만들어볼게요 — 버튼을 누르면 반응하도록요! 여러분은 첫 화면으로 뭘 만들어보고 싶으세요?