부엉이쌤의 디지털공방

Netlify로 10초 만에 웹사이트 만들기!

곽성호(자유) 2026. 1. 1. 15:15

👩🏫 선생님, 웹사이트 만들기가 이렇게 쉬웠나요? Netlify로 10초 만에 웹사이트 만들기!

중고등학교 선생님들께서 수업 자료를 만드시거나 학생들과 프로젝트를 진행할 때,
가장 큰 고민 중 하나가 "내가 만든 결과물을 어떻게 온라인에 올릴까?" 하는 점일 것입니다.

 

오늘은 코딩이나 복잡한 서버 설정을 전혀 몰라도, 단 10초 만에 내가 만든 파일을 웹사이트로 만들어주는 마법 같은 서비스, 'Netlify(넷리플라이)'를 소개해 드립니다.

이런 선생님들께 강력 추천합니다!

  • 학생들에게 보여줄 수업 안내 페이지를 직접 만들고 싶은 분
  • 학생들의 코딩 결과물(HTML/CSS)을 실제 URL로 만들어 전시하고 싶은 분
  • 포트폴리오나 학급 게시판을 가볍게 운영하고 싶은 분

🛠 1단계: 준비물 확인하기 (딱 2가지만 있으면 됩니다)

시작하기 전에, 선생님의 컴퓨터에 다음 두 가지만 준비해 주세요.
  1. 웹사이트 파일이 담긴 폴더: 폴더 안에는 반드시 메인 화면인 index.html 파일이 있어야 합니다.
    • 예시 폴더 구조:
      나의_수업_사이트/
      ├── index.html
      ├── style.css
      └── images/    
      └── logo.png
  2. Netlify 계정: Netlify 홈페이지에서 이메일이나 구글 계정으로 간편하게 가입하세요.

🚀 2단계: 10초 만에 웹사이트 배포하기 (전체 과정)

가장 쉬운 '드래그 앤 드롭' 방식을 설명해 드립니다. 인공지능이나 복잡한 기술을 몰라도 마우스만 쓸 줄 알면 끝납니다!

1.  로그인 후 'Sites' 메뉴 클릭

로그인하면 나오는 첫 화면 상단에서 [Sites] 탭을 클릭합니다.

2.  폴더 끌어다 놓기 (가장 중요!)

화면 아래쪽을 보면
"Want to deploy a new site without connecting to Git? Drag and drop your site folder here"
라는 문구와 함께 점선 박스가 보입니다.
  • 선생님이 준비한 웹사이트 폴더를 마우스로 잡고, 이 점선 박스 안으로 툭! 던져 넣어주세요.

3.  URL 확인하기

잠시 "Uploading"이라는 메시지가 뜬 뒤, 화면 상단에 https://random-name-123.netlify.app 같은 주소가 생깁니다.
이 주소를 클릭하면 선생님의 사이트가 전 세계 어디서든 접속 가능한 상태가 됩니다!

💡 3단계: 나만의 예쁜 주소로 바꾸기 (구체적 팁)

기본으로 제공되는 주소는 영어 단어가 무작위로 섞여 있어 외우기 어렵습니다. 우리 반 이름이 들어간 주소로 바꿔볼까요?
  1. 배포된 사이트 화면에서 [Site configuration] 버튼을 누릅니다.
  2. [Change site name]을 클릭합니다.
  3. 원하는 이름(예: our-class-2026)을 입력하고 저장합니다.
  4. 이제 주소는 https://our-class-2026.netlify.app으로 바뀝니다!

🌟 선생님들이 Netlify를 쓰면 좋은 이유

  • 완전 무료: 학교 예산 걱정 없이 학생 수백 명의 과제를 각각 사이트로 만들어줄 수 있습니다.
  • 수정의 편리함: 파일 내용을 수정했다면? 다시 폴더를 드래그해서 던지기만 하면 실시간으로 업데이트됩니다.
  • 보안 우수: HTTPS(자물쇠 표시)가 자동으로 적용되어 학생들에게 안전한 인터넷 환경을 제공합니다.

🎓 수업 활용 아이디어

  • 정보 교과: 학생들이 만든 자기소개 웹페이지 배포하기
  • 동아리 활동: 우리 학교 축제 안내 페이지 만들기
  • 학급 운영: 한 달간의 학급 소식을 담은 '디지털 뉴스레터' 제작
이제 더 이상 "서버"라는 단어에 겁먹지 마세요. Netlify와 함께라면 선생님도 오늘부터 멋진 웹 마스터가 될 수 있습니다!