처음으로 도전할 바이브코딩 프로젝트

소개

기본적인 쇼핑몰 웹사이트를 만들기엔 저희 스터디원분들께서 너무 쉬워서 무익하다(?)고 여기실까봐 기본 쇼핑몰이 아닌 새로운 타입의 쇼핑몰을 만들어보자는 생각을 했습니다.

제가 이번 스터디동안 만들어보려는 것은 미술품경매사이트입니다.

입찰신청 버튼을 누르면 계정 생성 및 구매희망자의 인적사항, 입찰희망가격을 작성하게되며,

이후 관리자가 관리자 페이지에서 입찰 희망자의 정보를 확인 후 선택한 희망자에게만 결제 링크를 보내어 결제를 받을 수 있게 합니다.

하지만 해당자가 결제를 하지 않을 수 있기에, 일정 시간 후에는 결제 페이지가 차단되고 다음 사람에게 턴이 넘어가도록 설계하여 개발하고자 합니다.

진행 방법

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

바이브코딩 툴로는 클로드코드+커서를 활용하고, 개발환경 구성을 위해

anaconda, node.js, git을 설치했습니다

(각 사이트에서 다운로드 후 환경변수 설정 및 프롬프트를 통한 설치를 완료했습니다. 아래는 실제사용코드가 아닌 예시입니다.)

  • Anaconda 설치:

    PowerShell

    사본

    winget install Anaconda.Anaconda
    
  • Node.js 설치 (LTS 버전 추천):

    PowerShell

    사본

    winget install OpenJS.NodeJS.LTS
    
  • Git 설치:

    PowerShell

    사본

    winget install Git.Git

회원가입 및 로그인은 clerk를 사용할 계획이고,

결제는 paypal을 적용할 계획입니다.

또한 구매희망자의 인적사항 DB는 superbase에 저장할 예정입니다.

쌩초보 1트 바이브코딩 개발자인 제가 직접 AWS로 DB를 구성하는 등 모든 보안을 튼튼하게 개발하기엔 역량이 많이 부족하여, clerk, paypal, superbase와 같은 대기업(?) API를 사용해서 개발해보려합니다.

결과와 배운 점

이번 개발을 위해 어떤 것들이 필요할지 알아가는 과정에서 세상에는 정말 많은 코딩툴들이 있었구나.. 하며 레거시코드 개발자인 저는 신문명을 발견한 원시인마냥 경이로움을 느끼고 있습니다. 아직 클코한테 제대로 뭘 시켜보기 전이라 소스가 뭐가 꼬이거나 이런 경우는 없었지만, 앞으로 부디 시행착오를 최소화하며 순조로운 개발이 될 수 있길 바라봅니다...★(회사에서도 삽질 많이 해봐서 바이브코딩하면서는 덜했으면 좋겠어요 ㅠ)

도움이 필요한 부분은,

단계별로 클코한테 프롬프트 사용하면 코드꼬이는 불상사를 최소화하며 안정적인 코딩이 가능하다 하셨는데 실제로 어떤 프롬프트를 단계별로 사용하시는지 프롬프트 예시를 알려주시면 너무나 피와 살이 되는 가르침(?)일것 같습니다.

앞으로의 계획이 있다면

이번 4주의 강의 안에 계획한 사이트를 실제로 구축하기가 목표입니다!

1
밀어주고 끌어주는

온·오프라인 AI 스터디

AI로 어디까지 할 수 있는지
직접 확인하실 분만 신청하세요.