Deploy

내 컴퓨터에서만 열리던 화면에
주소를 붙입니다

배포는 개원에 해당합니다. 지금까지는 원내에서만 보던 것을 밖에서도 찾아올 수 있게 만드는 일입니다. 다행히 개원과 달리 대부분 무료이고, 빠르면 5분이면 끝납니다.

대부분 무료명령어 없이도 가능https 자동 적용

01Routes

세 가지 경로

어느 쪽이든 결과는 같습니다. 지금 손에 있는 것이 무엇이냐에 따라 고르면 됩니다.

  • 버튼 한 번

    만든 도구에서 바로 공개

    웹 빌더형으로 만든 경우

    Lovable이나 v0에는 공개 기능이 들어 있습니다. Publish를 누르면 주소가 나옵니다. 따로 할 일이 없습니다.

    감안할 점 주소에 서비스 이름이 섞여 나옵니다. 나중에 내 도메인으로 바꿀 수 있습니다.

  • 5분

    파일을 끌어다 올리기

    HTML 파일 하나를 만든 경우

    Cloudflare Pages나 Netlify에 가입한 뒤 만든 파일이 든 폴더를 화면에 끌어다 놓으면 끝납니다. 명령어를 한 줄도 쓰지 않습니다.

    감안할 점 고칠 때마다 다시 올려야 합니다. 몇 번 하다 보면 번거로워집니다.

  • 30분 (처음 한 번만)

    GitHub에 올리고 자동 배포

    계속 고쳐가며 쓸 경우

    코드를 GitHub에 올려두고 Cloudflare Pages와 연결하면, 이후로는 수정할 때마다 저절로 반영됩니다. HyperDoctor의 도구들이 이 방식으로 운영됩니다.

    감안할 점 처음 한 번은 설정이 필요합니다. 그 이후로는 가장 편합니다.

02Domain

내 주소 갖기

기본으로 주어지는 주소는 길고 서비스 이름이 섞여 있습니다. 도메인을 사서 연결하면 간판이 바뀝니다.

  1. 01

    도메인을 구입합니다

    가비아 같은 국내 업체나 Cloudflare에서 살 수 있습니다. 연 2만 원 안팎이고, .com 이나 .kr 이 무난합니다.

  2. 02

    배포 서비스에 도메인을 등록합니다

    Cloudflare Pages의 설정에서 Custom domain 항목에 구입한 주소를 넣습니다.

  3. 03

    안내받은 값을 도메인 설정에 입력합니다

    복사해서 붙여넣으라는 값이 나옵니다. 의미를 이해할 필요 없이 그대로 옮기면 됩니다.

  4. 04

    잠시 기다립니다

    몇 분에서 길면 몇 시간이 걸립니다. 자물쇠 표시가 있는 https 주소도 자동으로 붙습니다.

03Subdomain

하나 사면 여러 개를 씁니다

도메인을 하나 사두면 그 앞에 이름을 붙여 새 주소를 무제한으로 만들 수 있습니다. 추가 비용이 들지 않습니다. 도구를 만들 때마다 새로 살 필요가 없다는 뜻입니다.

실제 사례

HyperDoctor는 도메인 하나를 사두고 도구마다 앞에 이름을 붙여 운영합니다. 지금 보고 계신 이 사이트도 그중 하나입니다.

  • hyperdoctor.app — 본체
  • finance.hyperdoctor.app — 개원 금융 플랜
  • english.hyperdoctor.app — 의료 영어 연습
  • coding.hyperdoctor.app — 지금 이 페이지

04After

올리고 나서 할 일

휴대폰에서 직접 열어보기

PC에서 멀쩡하던 화면이 휴대폰에서 깨지는 일이 흔합니다. 주소를 본인 휴대폰으로 보내 실제로 확인하세요. 직원 한 명에게 부탁해 열어보게 하면 더 좋습니다.