비개발자도 따라 할 수 있는 홈페이지 배포 가이드를 만든 이유

홈페이지를 운영하다 보면 문구 몇 줄을 바꾸려고 제작자에게 다시 연락해야 하는 일이 생깁니다. 가격표의 숫자 하나, 오탈자 한 글자를 고치는 데도 메일을 쓰고 답을 기다립니다.
코딩을 못해서 생기는 문제라기보다는, 내가 고친 파일이 어떤 경로로 인터넷에 반영되는지 알기 어려워서 생기는 문제에 가깝습니다. GitHub에 가입까지는 해봐도 그다음 화면에서 멈추는 경우가 많습니다.
이번에 데이터공방 가이드를 보강하면서 이 지점을 다시 설계했습니다. 어떤 판단으로 만들었는지 기록해 둡니다.
1. 검색해서 나오는 설명은 대부분 개발자를 향해 있습니다
GitHub나 웹 배포를 검색하면 자료는 많습니다. 다만 대부분 개발자를 독자로 두고 쓴 글입니다.
터미널을 열어 명령어를 입력하는 화면부터 나오고, 저장소와 브랜치 같은 용어를 이미 안다고 전제합니다. 비개발자는 내용이 어려워서가 아니라 입구에서 막힙니다. 무엇을 모르는지 설명할 언어가 없으니 질문도 만들기 어렵습니다.
그래서 가이드의 목표를 이렇게 잡았습니다.
Git 명령을 외우게 하는 것이 아니라, 수정한 파일이 어디에 기록되고 언제 GitHub로 올라가며 어느 순간 공개 주소에 반영되는지를 스스로 설명할 수 있게 하는 것.
2. 내 컴퓨터와 인터넷은 서로 다른 공간입니다
가장 먼저 정리한 개념은 로컬과 클라우드의 구분입니다.
로컬은 내 컴퓨터 안입니다. 파일을 고치고 저장해도 그 변화는 아직 내 책상 위에만 있습니다. 클라우드는 GitHub나 배포 서비스처럼 인터넷 너머에 있는 공간입니다. 누구나 볼 수 있는 곳이지요.
이 두 공간이 자동으로 같아지지 않는다는 점, 사이를 건너가려면 내가 직접 보내는 동작이 필요하다는 점. 여기서부터 시작해야 뒤의 설명이 순서대로 들어옵니다.
그래서 인터넷 환경인 GitHub에 자료를 올려서 홈페이지를 띄웁니다. 내 컴퓨터에서 고친 파일을 GitHub로 보내고, 그 파일을 실제 주소에서 볼 수 있게 만드는 것까지가 한 묶음입니다.
▷ 먼저 전체 흐름을 익혀보세요: 비개발자를 위한 GitHub 시작 가이드
3. 클릭 순서가 아니라 진단하는 법을 담았습니다
따라 하기 방식 튜토리얼의 약점은 분명합니다. 화면이 조금만 달라지거나 처음 보는 메시지가 뜨면 그 자리에서 멈춥니다. 서비스 화면은 계속 바뀌니 언젠가는 반드시 어긋납니다.
그래서 세 가지를 원칙으로 삼았습니다.
▣ 지금 어느 단계인지 알게 합니다
작업 하나하나를 외우기보다, 내가 지금 로컬에 있는지 GitHub에 있는지 배포 단계인지 인식하도록 구성했습니다. 위치를 알면 막혔을 때 어디를 봐야 하는지도 알게 됩니다.
▣ 연습용이 아니라 실제 흐름으로 만듭니다
샘플 화면만 만들고 끝나지 않도록, GitHub에 올린 정적 페이지를 Cloudflare Pages로 배포하는 실제 작업 흐름을 기준으로 구성했습니다.
▣ 비용 조건을 미리 밝힙니다
Cloudflare Pages 무료 요금제는 정적 홈페이지에 활용하기 좋습니다. 다만 무료 제공 범위와 조건이 있으므로, 어떤 경우에 해당하는지 가이드 안에서 함께 설명합니다. 초기 호스팅 비용 부담을 낮추는 선택지이지 모든 상황에서 공짜라는 뜻은 아닙니다.
4. 이번에 정리한 가이드 네 개
배포 흐름을 다루는 가이드와, AI 도구로 작업 방식을 정리하는 가이드를 구분해 두었습니다.
홈페이지를 올리는 흐름:
AI 도구로 작업 방식을 정리하는 흐름:
뒤의 두 가지는 홈페이지 배포와는 다른 주제입니다. AI에게 같은 지시를 매번 새로 설명하는 대신, 반복되는 요구사항과 작업 절차를 규칙으로 정리해 두는 방법을 다룹니다.
5. 가이드를 만들며 확인한 것
이 가이드의 목적은 홈페이지 관리를 혼자 하게 만드는 데 있지 않습니다. 남에게 맡기더라도 무엇을 맡기고 있는지는 알자는 쪽에 가깝습니다.
흐름을 알면 요청이 구체적으로 바뀝니다. 홈페이지 좀 고쳐주세요가 아니라, 이 파일의 이 문구를 바꾸고 배포까지 부탁드립니다로 바뀝니다. 그 차이가 실무에서는 꽤 큽니다. (이 문장을 쓰려고 가이드를 만든 것 같기도 함!)
직접 적용하기 어렵거나 팀의 공통 작업 방식으로 정리해야 한다면 교육·협업 문의를 남겨주세요.