개인 기술 블로그를 하나 만들어볼까 하다가 제일 먼저 든 생각은 “이걸 굳이 처음부터 돈 내면서 시작해야 하나?”였습니다. 아직 글도 별로 없고 사이트 이름도 바뀔 수 있는데 도메인부터 사는 건 순서가 아닌 것 같았습니다.

그래서 이번에는 목표를 아주 작게 잡았습니다. GitHub에 있는 HTML/CSS/JS 사이트를 인터넷에서 실제로 열리게 만들기. 그 이상은 나중 문제로 두기로 했습니다.

GitHub에 올렸다고 바로 웹사이트가 되는 건 아니었습니다

처음에는 저장소에 index.html이 있으면 바로 주소 하나가 생기는 줄 알았습니다. 정확히는 코드는 GitHub에 있고, 그 파일을 웹에서 서비스해줄 호스팅이 하나 더 필요했습니다.

GitHub Pages를 쓸 수도 있었지만, 이번에는 Cloudflare Pages에 GitHub 저장소를 연결했습니다. 이유는 간단했습니다. 정적 사이트를 그대로 올릴 수 있고, 나중에 도메인을 붙이기도 편해 보였기 때문입니다.

제가 실제로 넣은 설정

이 사이트는 프레임워크 없이 저장소 루트에 index.html이 있는 구조입니다. 그래서 빌드 과정도 거의 없었습니다.

Production branchmain
Framework preset없음
Build command비워둠
Build output directory.

이렇게 연결하고 배포를 누르니 Cloudflare가 GitHub 저장소 내용을 가져가서 사이트를 만들어줬습니다. 이후에는 main에 변경사항이 들어가면 다시 배포되는 구조가 됩니다.

원했던 주소는 못 얻었습니다

사이트 이름을 NOTFINAL로 정했으니 당연히 notfinal.pages.dev를 기대했습니다. 그런데 실제로는 뒤에 문자가 조금 붙은 주소가 나왔습니다.

사이트 이름과 무료 pages.dev 주소는 꼭 똑같을 필요가 없었습니다. 무료로 시험하는 동안은 그냥 임시 주소로 쓰기로 했습니다.

주소가 예쁘지 않다고 다시 프로젝트를 만들고 지우는 것보다, 지금은 글을 하나라도 더 쌓는 게 낫다고 생각했습니다. 나중에 이 사이트를 계속 운영하고 싶어지면 그때 별도 도메인을 붙이면 됩니다.

이번에 알게 된 것

  1. 사이트 코드와 호스팅은 별개였습니다.
  2. 처음부터 React나 별도 서버가 없어도 HTML/CSS/JS만으로 충분히 시작할 수 있었습니다.
  3. GitHub를 원본으로 두면 수정 이력이 남고, 배포 서비스는 그 결과물을 보여주는 역할로 나눌 수 있었습니다.
  4. 도메인은 사이트가 계속 굴러갈 것 같을 때 사도 늦지 않았습니다.

다음은 사이트보다 글을 채우는 쪽

배포 자체는 생각보다 빨리 끝났습니다. 문제는 이제부터입니다. 껍데기만 계속 만지면 결국 아무도 볼 게 없는 사이트가 됩니다.

그래서 다음부터는 제가 실제로 만지고 있는 AI, 서버, 장비 같은 주제를 하나씩 정리하면서, 필요한 경우 작은 계산기나 도구를 같이 붙여보려고 합니다.