JYP Garden Internal

yt a4CK72s5tyA 호스팅거에 웹사이트 업로드하기

Properties1
tagshostinger, web-hosting, 정적-사이트-배포, html, ssl, tutorial, affiliate, 사이드프로젝트, personal

8 min read

🎬 자막

영상 정보

한 줄 요약

AI(예: Claude)로 만든 정적 HTML/CSS/JS 사이트를 Hostinger에 업로드해 도메인 + HTTPS까지 한 번에 띄우는 9분 튜토리얼. 핵심은 ZIP → public_html 추출 워크플로우와 자동 SSL 발급.

핵심 절차 (요약)

  1. Hostinger 가입 → premium plan 선택 (3 사이트 / 20 GB / 1년 무료 도메인)
  2. 무료 도메인 청구 (.com 권장) + 이메일 인증
  3. 사이트 파일 준비
    • 기존 정적 사이트 있으면 그대로 사용
    • 없으면 Claude 등 AI로 HTML/CSS/JS 생성 (스크린샷 + 설명 입력)
  4. 사이트 파일 전체를 ZIP 압축 (macOS: 우클릭 → Compress / Windows: 우클릭 → 압축)
  5. 대시보드 → Websites → Setup → “Bring your website” → “Upload backup files”
  6. 도메인 선택 → ZIP 업로드 → 마이그레이션 요청
  7. 자동 SSL 발급 확인 (HTTPS로 자동 로딩)
  8. 이후 수정: hPanel → File Manager → public_html 폴더에서 직접 편집

재배포 (replace) 워크플로우

  1. File Manager → public_html 진입
  2. 기존 파일 전체 선택 → Delete
  3. 새 ZIP 업로드 → 우클릭 → Extract
  4. ⚠️ “Folder name”에 . (점 하나)만 입력 — 그래야 서브폴더 없이 public_html 루트로 풀림

IDEAS (12개)

  • 정적 HTML/CSS/JS 사이트는 빌드 파이프라인 없이 ZIP 업로드만으로 공유 호스팅에 배포 가능하다.
  • Hostinger premium은 1년 무료 도메인을 번들로 제공해 신규 사이트 진입 비용을 낮춘다.
  • SSL/HTTPS는 Hostinger가 백그라운드에서 자동 발급해 수동 설정 단계를 제거한다.
  • 어필리에이트 파트너 링크로 들어가면 쿠폰(MM10)이 자동 적용된다 (추가 10% 할인).
  • AI 도구(Claude 등)는 스크린샷 + 자연어 설명만으로 완성형 HTML 사이트를 수 분 안에 생성한다.
  • Hostinger 약정 기간이 길수록(48개월) 월 단가가 가장 저렴해진다.
  • 12개월 단기 약정도 무료 도메인 1년 혜택은 동일하게 포함된다.
  • 배포된 사이트 파일은 반드시 public_html/ 디렉터리에 위치해야 서빙된다.
  • 재배포 시 압축 해제 폴더명을 .으로 지정해야 서브폴더 중첩을 피한다.
  • hPanel File Manager가 출시 후 in-place 편집의 기본 인터페이스다.
  • Hostinger 이메일 인증은 가입 후 약 1~2주 안에 완료해야 안전하다.
  • “It just works out of the box” — 모던 공유 호스팅이 SSL을 기본값으로 흡수했다는 신호.

INSIGHTS (5개)

  • AI 코드 생성 + 정적 호스팅 조합은 과거 수 주 걸리던 “사이트 만들기”를 한나절 작업으로 압축한다 — 병목이 “HTML을 아는가”에서 “AI에게 뭘 시킬지 아는가”로 이동했다.
  • 도메인을 호스팅 플랜에 묶어 파는 패키징은 초보자가 DNS/레지스트라 개념을 학습하기 전에 사이트를 가지게 만드는 UX 트릭이다.
  • 이런 튜토리얼은 본질적으로 어필리에이트 퍼널이다 — 콘텐츠는 진짜이지만, 동선이 파트너 링크 + 쿠폰을 거치도록 설계돼 있다 (창작자·시청자 양방향 인센티브).
  • public_html이라는 디렉터리 컨벤션은 cPanel 시대 유산이다 — 현대 호스트가 여전히 이걸 노출한다는 사실은 “정적 호스팅”이 지난 20년간 거의 변하지 않았다는 증거다.
  • “Extract into .” 같은 작은 운영 팁이 동작하는 배포와 헷갈리는 배포를 가른다 — 모든 배포 튜토리얼에서 가장 가치 있는 부분은 이런 부족 지식(tribal knowledge)이다.

인용구

“By the end of this video, your site will be live at a real domain name that anyone anywhere can visit.” “If you don’t have a website yet, the fastest way to make one today is just to describe what you want to an AI like Claude.” “That’s something that you sometimes have to do manually on other hosts, but here it just works out of the box.” — SSL 자동 발급 “For the folder name, just give it a single period so that we don’t create a subfolder.”

FACTS

  • Hostinger premium plan: 3 웹사이트, 20 GB 스토리지, 1년 무료 도메인 포함
  • 기본 약정 기간: 48개월
  • 최단 약정 기간(영상 기준): 12개월 (무료 도메인 동일 포함)
  • 파트너 쿠폰 MM10 = 추가 10% 할인
  • 이메일 인증 권장 마감: 가입 후 약 1~2주
  • 배포 폴더: public_html/
  • HTTPS 자동 발급 (별도 설정 불필요)

RECOMMENDATIONS (실행 권고)

  • 사이트 파일은 통째로 ZIP 압축한 뒤 업로드 — 개별 파일 업로드는 비효율.
  • 도메인 확장자는 .com 우선 (가용성 있다면).
  • 가입 직후 이메일 인증을 바로 처리해 잊지 않기.
  • 마이그레이션 완료 후 반드시 공개 도메인에서 사이트 동작 확인 후 “끝났다”고 간주.
  • 재배포는 public_html 내부 파일 삭제 → 새 ZIP 업로드 → . 폴더명으로 Extract 순서.

REFERENCES (언급된 도구·개체)

  • Hostinger (org / 공유 호스팅 플랫폼)
  • Claude (tool / AI 코드 생성 어시스턴트)
  • 정적-사이트-배포 (concept / 본 영상의 핵심 워크플로우)
  • HTML / CSS / JavaScript (web 기술 스택)
  • hPanel (Hostinger의 호스팅 컨트롤 패널)
  • public_html (cPanel 계열 호스팅의 표준 웹 루트 디렉터리)
  • SSL / HTTPS
  • macOS / Windows (압축 방법 차이)
  • Metics Media (영상 채널)
  • Dan (영상 호스트)

관련 노트

  • 개인 사이드 프로젝트(블로그·공부방 사이트 등) 배포 시 참고
  • AI 코드 생성 워크플로우와 함께 묶기: Claude, claude-code
  • 정적 사이트 배포 일반 개념: 정적-사이트-배포

원본 자막

00-Inbox/youtube/a4CK72s5tyA.en.vtt (raw VTT, 불변) 00-Inbox/youtube/a4CK72s5tyA.cleaned.txt (cleanup 후 텍스트, 8.3 KB / 1558 단어)

그래프 뷰

백링크