본문 바로가기

React

Netlify로 react 프로젝트 배포하기

반응형

여태 github page로 배포했는데 이번에는 다른 방법으로 배포해보려고 여러 웹호스팅 서비스를 알아보다가 무료 웹 호스팅 서비스 Netlify를 알게 되었다.

aws, heroku, github pages 등 어떤 서비스로 배포해볼까 고민이 있었는데, 그중에서 Netlify를 선택한 이유는

1. github pages는 몇번 사용해봐서 다른 서비스를 사용해보고 싶었고

2. aws 서비스는 단순한 정적 웹사이트 배포에 좀 과한 것 같아서 (개인적인 내 생각..)

3. heroku는 무료버전에서는 30분간 서비스 트래픽이 없다면 sleep 모드로 들어가고 다시 서버 실행할 때 응답이 느리다 하여

결론은,

 

 - 무료이고

- 깃허브 연동으로 간단하게 빌드 및 배포할 수 있어서

 

Netlify를 선택했다. 

 


 

- Netlify 회원가입 및 배포

 

 

Netlify App

Loading Netlify dashboard

app.netlify.com

 

🚨 헤맨 부분 🚨

 

배포하고 페이지 주소도 제대로 생성됐는데, api key를 받아오지 못하고 url만 받아와서 401 error가 생겼다. 

 

 

위 영상으로 api key를 제대로 받아올 수 있는 방법을 찾았다.

 

 

위 사진을 보면 Netlify에서 따로 key를 설정하는 탭이 있었다. 

 

 

프로젝트에서 사용하는 api key를 설정한 후, 'trigger deploy' 하면 이제 제대로 api key를 받아온다.