커서로 만든 사이트, vercel 배포에 도전해본 이야기

소개

시도하고자 했던 것과 그 이유를 알려주세요.

커서(Cursor)를 활용해 정적인 웹페이지를 만들어본 경험은 있었지만 지난번에 깃허브에 올리는 것과 버셀 배포는 시도도 하지 못했습니다. 이번엔 GitHub와 Vercel을 통한 배포에 도전해보았습니다. 그리고 단순한 정적 사이트가 아닌, Node.js를 이용한 동적인 웹사이트를 만들어보고 싶었고, 이를 실제로 배포해보는 과정을 통해 전체 개발 흐름을 이해하고자 했습니다.

진행 방법

어떤 도구를 사용했고, 어떻게 활용하셨나요?

  • Cursor (AI 기반 코딩 에디터)

  • GitHub (소스코드 업로드)

  • Vercel (정적/동적 웹사이트 배포 플랫폼)

  1. 커서에서 Node.js를 활용한 웹사이트 구현

  2. 로컬에서는 정상 작동 확인 (브라우저에서 미리보기 OK)

  3. GitHub에 소스코드 push

  4. Vercel과 GitHub 연동하여 배포 시도

문제 발생:

  • Vercel에서 배포 중 실패

  • 커서로 디버깅 시도 하였지만 수차례의 수정에도 결국은 실패했음

<커서에서 확인 가능한 페이지>

musa21 -musa21 -musa21 -musa21 -musa21 -

커서에서 보이는 페이지

루트디렉토리를 뭐로 설정해야 하는지도 모르겠고.

스파게티 코딩이 되어서 그 과정에서 문제가 생겼을수도 있다.

결과와 배운 점

  • 배포는 실패했지만, 실패의 원인을 고민하고 분석하는 과정에서 많은 걸 배움

  • 로컬에서 잘 되는 것과 배포 환경에서 잘 작동하는 것은 다르다는 것을 체감

  • 다시 시도할 계획:

      1. Vanilla JS 기반 간단한 사이트로 Vercel 배포 재도전

      1. 기존 Node.js 기반 구조도 Vercel 또는 다른 플랫폼으로 배포 가능성 모색

  • 특히 커서를 쓰면서 여러 번 설치/디버깅 과정을 거치며 커서와 훨씬 더 친해졌음

자동화는 쉽지 않지만, 하나하나 넘다 보면 결국 도착하게 될 것이라는 걸 느꼈습니다 🚶‍♀️

도움 받은 글 (옵션)

참고한 지피터스 글이나 외부 사례를 알려주세요.

(내용 입력)

👉 이 게시글도 읽어보세요