Vibe Coding으로 만든 웹사이트, 도메인 연결은 이렇게 했다

개요

나만의 실험실(Vibinglab)을 만들기 위해 웹사이트를 직접 구축해보기로 결정함. 내가 만든 프로젝트를 정리할 플랫폼이 필요했고, 단순한 테스트가 아니라 실제로 온라인에 배포해 다른 사람들과 공유하고자 했기 때문임.

Vibe Coding을 통해 사이트를 만드는 과정은 비교적 수월했으나, 도메인 연결과 호스팅 설정 단계에서 갑작스럽게 낯선 용어와 개념들이 등장해 당황함. 정적 웹사이트 배포 경험은 있었지만 동적 웹사이트 배포는 처음이었기에 더욱 혼란스러웠음.

특히 Cafe24를 사용하는 과정에서 발생한 실전 문제들을 직접 겪고 해결한 경험이, 나처럼 처음 웹사이트를 배포하는 사람들에게 유용할 것 같아 기록함.

이 웹사이트 외에도 개인 포트폴리오 웹사이트 구축을 위해 node.js 호스팅을 구매했었음. 하지만 실시간 업데이트나 동적 요청이 많지 않은 포트폴리오 특성상 node.js 호스팅은 과하다고 판단하여 웹호스팅으로 전환함.

도메인은 개인적으로 구매한 Cloudflare 도메인을 사용했음. 그러나 국내 호스팅 서비스 사용 시 Cloudflare 도메인은 네임서버 변경이 어렵고, 3개월 동안 이전도 불가능하여 큰 불편을 겪음.

3개월이 지난 후 도메인을 Cafe24로 이전함. 이전 비용은 약 1만 원 초반대였던 것으로 기억함. 이후 도메인을 호스팅 서버와 연동함.

이 글에서는 개인 포트폴리오를 Cafe24로 구축하며 겪은 어려움과 현재 이 웹사이트를 만들며 마주친 문제들을 정리하고자 함.

실험 개요

사용한 도구/AI/기술	Cafe24 호스팅, Cafe24 도메인, Cursor, Github, FileZilla, ChatGPT
사용한 플랫폼	Cafe24 node.js 호스팅, Cafe24 도메인
작업 흐름/시도한 방식	로컬에서 코딩 및 테스트 → Cafe24에서 도메인 연결 → Cafe24 앱 생성 및 Public Key 설정 → Git 업로드 → 브라우저에서 확인

겪은 문제점 + 해결과정

도메인 구매 후 바로 연결이 안됨

도메인을 구매했으나 바로 연결되지 않아 당황함. 브라우저에 입력해도 '사이트 없음' 메시지만 출력됨.

해결방법: Cafe24에서 도메인 설정 → 호스팅 서비스와 연결 → DNS 정보 전파까지 2~24시간 소요됨을 인지함. 다른 웹사이트를 통해 도메인을 구매한 경우, 네임서버 변경이 불가능하면 Cafe24에서 사용하기 어려움을 깨달음. 이 경험을 통해 '도메인은 무조건 싼 곳에서 사면 된다'는 고정관념을 버리게 됨.

node.js 호스팅에 Git 업로드 후 웹사이트가 정상 출력되지 않음

앱은 실행된 것으로 보였지만 브라우저에서 접속 시 503 오류가 지속적으로 발생함.

해결방법: 좌측 메뉴의 '호스팅 관리 > 기본 관리 > 앱 생성/관리'로 들어가, 로그 보기 기능을 통해 오류 원인을 파악함. 로그 내용을 ChatGPT에 공유하면서 하나씩 점검하고 해결함.

용량이 비정상적으로 증가함

npm 캐시와 로그 파일로 인해 용량이 계속 증가함. Shell 접속이 불가능해 직접 정리할 수 없음.

해결방법: 카페24 고객센터에 요청하여 npm 캐시 및 앱 로그 파일 삭제를 요청함. node.js 호스팅은 SSH 및 FTP 접속이 불가능하며, 캐시/로그 관리는 고객센터를 통해서만 가능함을 인지함.

포트 점유 에러(EADDRINUSE), MODULE_NOT_FOUND 에러 발생

앱 실행 중 포트 점유 에러가 발생하고, express 모듈 설치 후에도 MODULE_NOT_FOUND 오류가 발생함.

해결방법: 고객센터 문의를 통해 포트 점유는 앱 중지 후 재실행으로 해결함. 로그에서는 해결 여부가 명확하게 표시되지 않아 불편함을 느낌. node.js 호스팅은 package.json을 기준으로 모듈이 설치되며, 이 파일은 소스 코드 최상단에 위치해야 함을 확인함. 이 내용을 기반으로 AI와 협업하여 문제를 해결함.

느낀 점/깨달은 점

1. 웹사이트 배포는 생각보다 현실적임

막연히 어렵다고만 생각했으나, 한 번 해보니 구조를 이해하고 나면 반복이 가능함. 혼자서도 충분히 할 수 있다는 자신감을 얻음.

2. DNS 설정은 생각보다 느림

즉시 반영되지 않기 때문에, 일정 시간을 기다려야 한다는 점을 몰라 초반에 많이 헤맸음. 여유를 갖고 기다릴 필요가 있음.

3. 도메인은 호스팅과 같은 곳에서 구매하는 것이 유리함

전문가가 아니라면 도메인과 호스팅을 동일한 곳에서 관리하는 것이 연결 및 설정이 훨씬 간단함. 약간의 비용 차이보다 연결 편의성이 더 중요함.

4. node.js 호스팅은 간단하지만 친절하지 않음

복잡한 서버 설정 없이 저렴하게 운영 가능하다는 장점은 있지만, 환경변수(.env) 설정 불가, 캐시 문제, node_modules 직접 푸시 등의 제약이 많음. 실험용으로는 괜찮지만, 장기적으로는 유연성이 떨어지고 비용이 늘어날 가능성이 높음.

다시 시도한다면

Cafe24를 다시 사용한다면 모든 파일을 최대한 최적화해서 업로드할 예정임.

DNS 적용까지 시간이 걸리므로, 연결 후 최소 1~2시간은 기다린 후 오류 여부를 판단할 것임.

프로젝트가 정적인지 동적인지 먼저 구분하고, 그에 적합한 호스팅 서비스를 선택할 것임.

문제가 발생하면 일단 고객센터에 문의를 먼저 넣고 해결을 시도할 것임. 안내나 가이드가 부족하기 때문에 제한 사항에 대한 사전 지식이 중요함. AI와 협업하는 것도 유용하지만, 빠른 대응을 위해 고객센터를 적극 활용할 것임.

3줄 요약

Cafe24 node.js 호스팅과 Cloudflare 도메인 연결 과정에서 DNS 전파 지연, 포트 점유, 용량 문제 등 다양한 기술적 어려움을 겪었지만 모두 해결함.
도메인 구매는 호스팅 서비스와 동일한 곳에서 하는 것이 연결이 간단하고 안정적임. node.js 호스팅은 실험용으로는 괜찮지만 장기적 운영에는 비효율적임.
웹사이트 배포는 구조를 이해하면 충분히 혼자서도 가능하며, 문제 발생 시 고객센터를 적극 활용하는 것이 가장 빠른 해결책임.

Vibe Coding으로 만든 웹사이트, 도메인 연결에 관하여

개요