노래 페이지 웹호스팅
간단한 노래 소개 웹페이지를 만들고 정적 웹호스팅으로 공개하는 실습 강의입니다.
핵심은 완성본을 따라 하는 데서 끝내지 않고, 다음 프로젝트에서도 다시 사용할 수 있는 순서와 판단 기준을 가져가는 것입니다.
이 강의는 수강자가 AI를 활용해 아주 간단한 HTML 웹페이지를 만들고, 그 결과물을 내 컴퓨터와 인터넷에서 확인하는 전체 흐름을 이해하도록 설계한다.

이 강의에서 보는 것
- AI IDE를 처음 사용해보는 입문자
- HTML/CSS를 깊게 배운 적은 없지만 웹페이지 제작을 경험해보고 싶은 수강자
- GitHub Pages, 포트포워딩, 도메인 연결 같은 말을 들어봤지만 실제 의미가 헷갈리는 수강자
- 나만의 작은 소개 페이지, 노래 페이지, 랜딩페이지를 만들어보고 싶은 수강자
- AI에게 웹페이지 제작을 요청할 때 필요한 정보를 정리할 수 있다.
- HTML 파일 하나로 간단한 웹페이지를 만들 수 있다.
핵심 메시지
간단한 노래 소개 웹페이지를 만들고 정적 웹호스팅으로 공개하는 실습 강의입니다. 처음부터 모든 것을 외우기보다, 수업 후에도 스스로 다시 실행할 수 있는 순서와 판단 기준을 가져가는 것이 목표입니다.
추천 수업 흐름
| 단계 | 질문 | 대표 활동 | 결과 |
| 1 | 노래 페이지 만들기와 쉬운 웹 호스팅 기획안에서 무엇을 봐야 할까? | 설명, 예시, 짧은 실습을 연결합니다. | 다음 단계로 넘어갈 기준을 정리합니다. |
| 2 | 교육 목적에서 무엇을 봐야 할까? | 설명, 예시, 짧은 실습을 연결합니다. | 다음 단계로 넘어갈 기준을 정리합니다. |
| 3 | 대상 수강자에서 무엇을 봐야 할까? | 설명, 예시, 짧은 실습을 연결합니다. | 다음 단계로 넘어갈 기준을 정리합니다. |
| 4 | 수강자가 가져가야 할 최종 감각에서 무엇을 봐야 할까? | 설명, 예시, 짧은 실습을 연결합니다. | 다음 단계로 넘어갈 기준을 정리합니다. |
| 5 | 전체 세션 목차에서 무엇을 봐야 할까? | 설명, 예시, 짧은 실습을 연결합니다. | 다음 단계로 넘어갈 기준을 정리합니다. |
| 6 | 반복해서 강조할 핵심 문장에서 무엇을 봐야 할까? | 설명, 예시, 짧은 실습을 연결합니다. | 다음 단계로 넘어갈 기준을 정리합니다. |
1. 노래 페이지 만들기와 쉬운 웹 호스팅 기획안
이 단계에서는 노래 페이지 만들기와 쉬운 웹 호스팅 기획안을 중심으로 수업을 진행합니다. 개념을 먼저 짧게 잡고, 실제 예시나 화면을 보면서 왜 필요한지 확인합니다.

강의 포인트
- 학생이 따라 할 수 있는 최소 단위로 설명합니다.
- 정상적으로 진행되었을 때의 결과를 먼저 보여줍니다.
- 막혔을 때 확인할 항목을 함께 안내합니다.
2. 교육 목적
이 단계에서는 교육 목적을 중심으로 수업을 진행합니다. 개념을 먼저 짧게 잡고, 실제 예시나 화면을 보면서 왜 필요한지 확인합니다.

강의 포인트
- 학생이 따라 할 수 있는 최소 단위로 설명합니다.
- 정상적으로 진행되었을 때의 결과를 먼저 보여줍니다.
- 막혔을 때 확인할 항목을 함께 안내합니다.
3. 대상 수강자
이 단계에서는 대상 수강자을 중심으로 수업을 진행합니다. 개념을 먼저 짧게 잡고, 실제 예시나 화면을 보면서 왜 필요한지 확인합니다.

강의 포인트
- 학생이 따라 할 수 있는 최소 단위로 설명합니다.
- 정상적으로 진행되었을 때의 결과를 먼저 보여줍니다.
- 막혔을 때 확인할 항목을 함께 안내합니다.
4. 수강자가 가져가야 할 최종 감각
이 단계에서는 수강자가 가져가야 할 최종 감각을 중심으로 수업을 진행합니다. 개념을 먼저 짧게 잡고, 실제 예시나 화면을 보면서 왜 필요한지 확인합니다.

강의 포인트
- 학생이 따라 할 수 있는 최소 단위로 설명합니다.
- 정상적으로 진행되었을 때의 결과를 먼저 보여줍니다.
- 막혔을 때 확인할 항목을 함께 안내합니다.
5. 전체 세션 목차
이 단계에서는 전체 세션 목차을 중심으로 수업을 진행합니다. 개념을 먼저 짧게 잡고, 실제 예시나 화면을 보면서 왜 필요한지 확인합니다.

강의 포인트
- 학생이 따라 할 수 있는 최소 단위로 설명합니다.
- 정상적으로 진행되었을 때의 결과를 먼저 보여줍니다.
- 막혔을 때 확인할 항목을 함께 안내합니다.
6. 반복해서 강조할 핵심 문장
이 단계에서는 반복해서 강조할 핵심 문장을 중심으로 수업을 진행합니다. 개념을 먼저 짧게 잡고, 실제 예시나 화면을 보면서 왜 필요한지 확인합니다.

강의 포인트
- 학생이 따라 할 수 있는 최소 단위로 설명합니다.
- 정상적으로 진행되었을 때의 결과를 먼저 보여줍니다.
- 막혔을 때 확인할 항목을 함께 안내합니다.
7. 실습이 필요한 지점
이 단계에서는 실습이 필요한 지점을 중심으로 수업을 진행합니다. 개념을 먼저 짧게 잡고, 실제 예시나 화면을 보면서 왜 필요한지 확인합니다.

강의 포인트
- 학생이 따라 할 수 있는 최소 단위로 설명합니다.
- 정상적으로 진행되었을 때의 결과를 먼저 보여줍니다.
- 막혔을 때 확인할 항목을 함께 안내합니다.
8. 마무리 메시지
이 단계에서는 마무리 메시지을 중심으로 수업을 진행합니다. 개념을 먼저 짧게 잡고, 실제 예시나 화면을 보면서 왜 필요한지 확인합니다.

강의 포인트
- 학생이 따라 할 수 있는 최소 단위로 설명합니다.
- 정상적으로 진행되었을 때의 결과를 먼저 보여줍니다.
- 막혔을 때 확인할 항목을 함께 안내합니다.
실습 미션
미션 1. 핵심 흐름 다시 설명하기
- 오늘 배운 과정을 3단계로 요약합니다.
- 각 단계에서 확인해야 할 결과를 한 문장씩 적습니다.
- 내가 헷갈렸던 지점을 질문으로 바꿔봅니다.
미션 2. 내 상황에 적용하기
- 같은 흐름을 내 아이디어나 프로젝트에 적용합니다.
- 필요한 준비물, 도구, 확인 기준을 목록으로 만듭니다.
- 다음 수업에서 보여줄 결과물을 하나 정합니다.
퀴즈
- 이 강의에서 가장 먼저 확인해야 하는 준비나 판단 기준은 무엇인가요?
- 실습 중 문제가 생기면 어떤 항목부터 확인해야 하나요?
- 오늘 배운 내용을 내 프로젝트에 적용한다면 첫 행동은 무엇인가요?
수업 체크리스트
- 제목과 목표를 학생이 이해했는가?
- 단계별 정상 결과를 확인했는가?
- 이미지나 예시가 설명과 함께 연결되어 있는가?
- 마지막에 학생이 직접 해볼 미션이 남아 있는가?