안녕하세요!
오늘은 제가 네트리파이(Netlify) 배포를 진행하며 겪었던 문제들과 해결 방법을 공유하려고 해요.
특히, 깃허브 액션이나 CLI를 사용하면서 발생했던 환경 변수 문제를 중점적으로 다뤄보겠습니다.
1. 네트리파이 환경변수 undefined 문제
깃허브 액션을 통해 네트리파이에 배포했을 때, API 주소를 환경 변수로 설정했는데 undefined로 출력되는 문제가 생겼어요. 코드를 직접 작성했을 땐 잘 작동했는데, 환경 변수로 설정하면 계속 문제가 발생하더라고요.
처음에는 오타 때문일 거라고 생각했어요. (배포 계정이 팀원 분 계정이었는데, 바쁘셔서 이것저것 요청드리기 어려운 상황이었답니다.)
깃허브 오가나이제이션 저장소에서 프로젝트를 포크한 뒤, 제 계정에서 NETLIFY_AUTH_TOKEN과 NETLIFY_SITE_ID가 제대로 인식되지 않았어요. 이로 인해 깃허브 액션의 Secrets와 네트리파이 환경 변수 설정이 일치하지 않았던 거죠.
문제를 깨달은 건 이틀 넘게 고민하던 3일 차였어요. 처음엔 "이것만 고치면 되겠지?" 싶어서 계속 수정했지만, 해결이 쉽지 않았어요. 결국, "시간만 낭비하겠다" 싶어서 CLI로 배포 방식을 바꾸는 결정을 하게 되었답니다.
2. 네트리파이 CLI로 배포하기
Netlify CLI 설치 및 기본 사용법
- Netlify CLI 설치하기
먼저, npm 홈페이지에서 Netlify CLI 설치 명령어를 찾아주세요.(Netlify CLI 설치 링크) - Netlify 계정 로그인하기
설치가 끝났다면 netlify login 명령어를 입력해 Netlify 계정에 로그인해 주세요.
이 과정을 통해 CLI와 계정을 연결할 수 있어요.
Netlify CLI를 활용한 배포 프로세스
- 프로젝트 빌드 및 Preview 배포
빌드 과정도 정말 간단하답니다.
1. netlify build 명령어를 사용해 프로젝트를 빌드하세요.
2. netlify deploy 명령어로 preview 배포를 진행할 수 있어요!
이렇게 하면 다른 사람과 공유할 수 있는 Preview 링크를 얻을 수 있답니다. 😊 - 프로덕션 배포
Preview 배포가 아닌, 실제 사용자에게 공개하는 프로덕션 배포도 간단해요.
netlify deploy --prod 명령어 하나면 바로 프로덕션에 배포 완료! 🚀
Netlify CLI의 주요 장점
- 환경 변수 관리가 간편해요
.env 파일로 환경 변수를 관리하면 설정이 정말 직관적이랍니다. - 빠르고 유연한 배포
깃 커밋 없이도 배포가 가능해 급한 상황에서도 편리해요. - PR별 Preview 배포
PR(풀 리퀘스트)을 올리면 자동으로 Preview 배포가 생성돼 리뷰할 때 아주 유용합니다. 🛠️
3. 깃허브 액션 vs CLI: 무엇이 더 나을까?🤔
네트리파이 배포를 진행할 때, 깃허브 액션과 CLI 중 어떤 방식을 선택할지 고민될 수 있어요.
각각의 장단점을 이해하고 상황에 맞게 선택하는 것이 중요하답니다.
상황별 선택 기준
- 자동화된 배포를 원한다면 → 깃허브 액션
- 커밋을 트리거로 자동으로 배포가 진행돼 팀 단위 협업에서 특히 유용해요.
- 깃허브에 푸시하면 설정된 워크플로에 따라 빌드와 배포가 자동으로 이루어져요.
- 빠르고 실험적인 배포가 필요하다면 → CLI
- 환경 변수가 자주 변경되거나, 빠른 테스트 배포가 필요한 경우 CLI가 적합해요.
- 로컬에서 바로 배포 과정을 제어할 수 있어 매번 커밋하지 않아도 돼요.
지금 저희 팀에서도 CLI로 배포를 진행 중인데, 로컬에서 바로 배포 환경을 확인할 수 있다는 점이 특히 편리했어요.
팁아닌 팁을 드리자면 환경 변수 이름의 오타를 점검하고, 배포 과정에서 로그를 꼼꼼히 확인하는 습관을 들이면 문제를 빠르게 찾을 수 있어요!
결론적으로, 깃허브 액션과 CLI는 모두 훌륭한 배포 도구이지만, 자동화된 배포를 중시하는지, 유연성과 속도를 중시하는지에 따라 선택이 달라질 수 있어요. 여러분의 프로젝트 성격에 맞는 방법을 선택해 성공적인 배포를 경험해 보세요! 🚀
