[트러블 슈팅] Next Vercel 배포 환경 개선 - Dev 환경 최신화 문제 해결

 

dev 브랜치 최신화 이슈 📖

발생한 오류 🔥

Next.js 프로젝트를 배포하던 중 `dev`브랜치에서 배포 최신화 문제가 발생했습니다.

 

`dev`브랜치에서 새로운 코드를 푸시해도 배포 환경에서 반영되지 않는 상황이 발생해서 팀 내 검토 과정에서 일관된 최신 버전을 확인하기 어려운 문제가 있었습니다.

 

 

Vercel 배포 구조와 dev 환경의 충돌 📖

문제 원인 🔎

Vercel의 기본 배포 구조에서는 한 개의 URL을 기준으로 메인 브랜치만 관리하다 보니, `dev` 브랜치가 배포될 때 자동으로 최신화가 안 되는 문제가 있었습니다. 

 

그래서 `dev` 환경과 `production`환경의 변경 사항을 독립적으로 관리할 필요가 있었습니다.

 

 

해결 방법 : dev 전용 Preview 배포 환경 추가 ✨

Vercel의 Settings > Domains 탭에 들어가 `dev`환경용 URL에 `-dev`를 붙여서 새로운 배포 링크를 생성했습니다.

dev 배포 링크 생성

기존 URL `st8.vercel.app`

dev 환경의 URL `st8-dev.vercel.app`

 

✨ dev 브랜치에 변경 사항이 있을 때마다 자동으로 최신화되도록 설정했습니다. 

 

 

 

❗여기서 문제 발생

 

Settings > Deployment Protection 탭에 `Vercel Authentication`이 활성화되어 있어서 다른 팀원들이 dev 환경에 접근하지 못하는 문제가 발생했습니다. (plan upgrade 비용 발생)

Vercel Authentication 버튼 활성화

 

 

그래서 `Authentication`설정을 `Disabled`로 변경해 팀원들이 dev 배포 환경을 확인할 수 있게 설정했습니다.