비개발자가 1년 1만 원대로 내 사이트를 연 과정

이 사이트 비개발자 연구실은 하루 만에 열었습니다. 돈이 든 건 도메인(nondevlab.com) 1년 비용 하나뿐이고, 사이트를 만드는 도구, 파일 보관, 24시간 운영은 모두 무료입니다. 서버를 직접 관리할 필요도 없습니다.

이 글은 어떻게 했는지 순서대로 정리한 기록입니다. 저처럼 “내 사이트 하나쯤 있었으면” 하는 비개발자분께 참고가 되면 좋겠습니다.

왜 사이트가 필요했나

처음부터 사이트를 만들 생각은 아니었습니다. 필요한 일이 겹치면서 자연스럽게 정해졌습니다.

• 크롬 확장 Easy SNS를 웹스토어에 올리려면 개인정보처리방침 주소가 필요합니다.
• 구글 로그인 동의 화면을 정식으로 게시하려면 홈페이지·약관 주소가 필요합니다. (관련 글)
• 앞으로 만들 여러 프로젝트를 한곳에 모으고, 구글 애드센스로 수익도 내고 싶었습니다.

블로그 서비스 대신 직접 만든 이유

네이버 블로그나 티스토리처럼 이미 있는 블로그 서비스를 쓰는 방법도 있습니다. 가입만 하면 바로 쓸 수 있으니 훨씬 쉽습니다. 그런데 제 경우에는 몇 가지가 맞지 않았습니다.

• 내 주소: 프로젝트마다 nondevlab.com/easy-sns/처럼 깔끔한 주소를 주고 싶었습니다.
• 자유로운 페이지: 블로그 글뿐 아니라 프로그램 소개, 개인정보처리방침, 나중에는 “광고 보고 무료 이용권 받기” 같은 페이지도 만들어야 했습니다.
• 오래 쓸 집: 서비스 정책이 바뀌어도 내 글과 주소는 그대로 남아 있기를 바랐습니다.

반대로 직접 만들면 처음 설정이 조금 번거롭습니다. 다행히 AI와 함께하니 그 번거로운 부분을 대부분 맡길 수 있었습니다.

사용한 것과 비용

무엇	역할	비용
Astro	사이트를 만드는 도구. 글은 메모장처럼 쓰는 Markdown 파일	무료
GitHub (비공개 저장소)	사이트 파일 보관	무료
Cloudflare	사이트를 인터넷에 24시간 올려 둠	무료
도메인 nondevlab.com	내 주소	1년 1만 원대

Astro는 글이 많은 사이트를 만들기 좋은 도구입니다. 글 하나를 Markdown 파일 하나로 쓰면, 목록 페이지와 글 페이지가 자동으로 만들어집니다. Cloudflare는 원래 사이트를 빠르고 안전하게 해 주는 회사인데, 정적인 사이트를 무료로 올려 두는 기능도 제공합니다.

순서

1. 사이트 만들기

AI에게 “깔끔한 블로그형, 글 목록 중심”으로 만들어 달라고 했습니다. 처음부터 들어간 페이지는 이렇습니다.

• 홈 (소개 + 만든 것들 + 최근 글)
• 연구 기록 (블로그)
• 만든 것들 (프로젝트 소개)
• 소개, 문의
• 개인정보처리방침, 이용약관 (애드센스 쿠키 안내 포함)

사이트 이름, 운영자, 문의 이메일은 설정 파일 한 곳에만 적어 두고 모든 페이지가 가져다 쓰게 했습니다. 나중에 이메일이 바뀌어도 한 곳만 고치면 됩니다.

2. GitHub에 비공개로 올리기

사이트 파일을 GitHub 비공개 저장소에 올렸습니다. 비공개라서 다른 사람은 코드를 볼 수 없습니다. GitHub는 사이트 파일의 “원본 보관소” 역할을 하고, 뒤에서 설명할 자동 배포의 출발점이 됩니다.

3. Cloudflare 가입과 도메인 구입

Cloudflare에 무료로 가입하고, 왼쪽 메뉴 Domains → 도메인 구매에서 nondevlab.com을 검색해 샀습니다.

도메인을 고를 때는 몇 가지 후보를 놓고 비어 있는지부터 확인했습니다. 짧고, 뜻이 통하고, 기억하기 쉬운 이름으로 “non-dev lab”, 즉 비개발자 연구실을 골랐습니다. Cloudflare는 도메인을 원가에 가깝게 팔고, 등록자 정보(이름·주소)도 기본으로 가려 줍니다.

팁: 자동 갱신은 켜 두세요. 깜빡하고 1년이 지나면 주소를 잃을 수 있습니다.

4. GitHub 저장소 연결

Cloudflare Workers & Pages → 만들기 → Connect GitHub에서 GitHub 권한을 줬습니다. 이때 꼭 “선택한 저장소만(Only select repositories)” 을 골라 사이트 저장소 하나만 허락했습니다. “모든 저장소”를 고르면 다른 프로젝트의 비공개 저장소까지 Cloudflare가 읽을 수 있게 되니까요.

빌드 명령은 npm run build, 배포 명령은 npx wrangler deploy가 자동으로 들어가 있어서 그대로 Deploy를 눌렀습니다. 2~3분 뒤 ○○.workers.dev라는 임시 주소로 사이트가 열렸습니다.

5. 내 주소 붙이기

같은 화면의 Domains → Add Domain에서 nondevlab.com을 고르고 추가했습니다. www.nondevlab.com도 같은 방법으로 추가했고요. 몇 분 만에 두 주소 모두 열렸습니다. 도메인을 같은 Cloudflare에서 샀기 때문에 복잡한 연결 설정(DNS)을 따로 할 필요가 없었습니다.

가장 좋은 점: 고치면 자동으로 반영

이제 글을 하나 쓰거나 문구를 고쳐서 GitHub에 올리면, Cloudflare가 알아서 다시 빌드해서 1~2분 안에 사이트에 반영합니다. 실제로 운영자 이름과 이메일을 고쳤을 때 약 1분 30초, 디자인을 통째로 바꿨을 때는 약 45초 만에 바뀌었습니다.

한 가지 더 해 둔 것이 있습니다. 글을 한꺼번에 올리지 않고 날짜와 시각을 정해 하나씩 공개되게 만들었습니다. 글마다 공개 시각을 적어 두면, GitHub의 예약 실행 기능이 하루 몇 번 확인해서 시각이 된 글이 있을 때 사이트를 다시 만들게 했습니다. 컴퓨터를 꺼 둬도 정해진 날에 글이 열립니다.

디자인은 시안 3개를 놓고 골랐다

처음 연 사이트는 흰 바탕에 글만 있어서 너무 밋밋했습니다. 그래서 같은 내용으로 디자인 시안 세 가지를 만들어 비교해 봤습니다.

• A. 연구 노트: 모눈종이 바탕, 손글씨 메모, 형광펜 강조
• B. 모던 테크: 어두운 남색 첫 화면, 세련된 카드
• C. 친근한 파스텔: 둥근 모서리, 파스텔 카드, 이모지

B는 멋있지만 “비개발자” 느낌보다는 개발자 블로그처럼 보였고, A는 개성이 강한 대신 조금 딱딱했습니다. 결국 C를 바탕으로 A의 손글씨 메모와 형광펜 강조를 섞기로 했습니다. 다가가기 쉬우면서도 “실험하고 기록하는 연구실” 분위기가 나도록요.

글 읽기 화면은 소제목에 형광펜을 칠하고, 인용문은 노란 메모지처럼 꾸몄습니다. 휴대폰에서도 읽기 편하게 맞췄고, 카카오톡이나 SNS에 링크를 붙였을 때 보이는 공유 미리보기 이미지도 따로 만들었습니다.

해 보니 알게 된 것

• 처음 하루가 가장 어렵다. 가입, 도메인, 연결만 끝나면 그다음부터는 글만 쓰면 된다.
• 권한은 최소한으로. GitHub 권한은 필요한 저장소 하나만 준다.
• 방침 페이지는 미리. 개인정보처리방침과 약관은 웹스토어, 구글 로그인, 애드센스 어디서나 요구한다.
• 디자인은 비교해서 고르면 빠르다. 말로 설명하기 어려운 취향도 시안을 나란히 놓으면 바로 정해진다.

정리

• 돈이 드는 건 도메인 1년 비용뿐이다.
• Astro + GitHub(비공개) + Cloudflare 조합이면 서버 관리 없이 사이트를 운영할 수 있다.
• 도메인을 Cloudflare에서 사면 연결이 훨씬 간단하다.
• 이후로는 GitHub에 올리기 = 사이트 업데이트다.