vercel 로 react 프로젝트 배포하기 (배포 보호 이슈 해결)

Jiumn·2024년 12월 9일
  • 서버 비용 이슈 등으로 인해 무료 배포를 찾아보던 중 supabase 를 알게 됐고, 백엔드 서버 없이 react 앱만 vercel 로 배포하기로 결정했다. 처음 vercel 을 써보는데 이전에 ec2 랑 github 연결해서 배포 자동화를 직접 했던 걸 생각하니 vercel 은 넘나 신세계인 것!

  • vercel 계정 만들고 github repo 연결해주고 deploy 하면 된다.

  • deploy 시 입력해야 하는 build, 패키지 설치 등의 명령어만 입력하면 알아서 배포가 되고 코드를 푸쉬할 때마다 자동 배포가 된다.

  • 배포 branch 는 디폴트가 main 으로 되어 있기 때문에 settings > git > production branch 에서 배포를 원하는 branch 로 변경해주면 그 브랜치로 감지를 해준다.

  • 배포 후에 다른 사람한테 해당 링크를 보내면 vercel 로그인을 하라는 화면이 떠서 난감했는데 배포 보호가 돼있어서 그런 것이었다...

  • project settings > deployment protection > vercel authentication 들어가서 해당 옵션을 비활성화(disable)해줘야 한다.

  • 이제 vercel 인증 기능을 비활성화해줬으니 도메인 연결을 해줘야 하는데... project settings > domain 들어가면 도메인이 있는데 failed to assign 이 뜨고 다음 배포 시에 연결이 된다는 메시지만 있길래 계속 기존 배포를 redeploy 해봤다. 그런데도 안 돼서.. deployment 들어가면 우측 케밥 메뉴 클릭해서 펼쳐보면 promote to Production 메뉴가 있다. 이걸 클릭하면... 도메인이 뜨면서 뭔가 될 것 같은 기운이..! 그리고 Promote to Production 을 클릭하면..!

  • Environment 가 Production 상태로 바뀐 것을 볼 수 있다.
    이전 배포 환경을 보면 Preview 상태였던 것을 알 수 있다..

그럼 이제 도메인으로 접속하면 접속 성공!

profile
Back-End Wep Developer. 꾸준함이 능력이다. Node.js, React.js를 주로 다룹니다.

0개의 댓글