[React] 리액트 프로젝트 Netlify로 배포하기

알고보면 넘나 유용한 사이트인 Netlify! 주로 호스팅을 하기 위해서 썼는데, netlify dev 라는 기능도 있어서 백엔드부분까지 살짝 도와줄 수 있는 기능도 가지고 있다. dev 기능을 알게 된지 얼마 안 되서 깊이 공부를 아직 못 했지만 유용하다고 생각했음 ㅎ

오늘은 react netlify 배포에 대해서 알아보자!

 

Netlify ( https://app.netlify.com/ )

 

1. 계정을 생성합니다

이메일로도 계정을 만들 수 있지만 git과 연동할 수 있답니다. git 계정이 있다면 손쉽게 계정을 만드실 수 있어요

 

 

2. 상단 메뉴의 [Sites] 나 [new site from git] 을 클릭합니다.

netlify로 배포하는게 무료라는 이점도 있지만, git에 올라가 있는 프로젝트를 바로 가져올 수 있기에 더 유용하고 편하답니다. 다양한 플랜이 있지만, 토이 프로젝트라던가, 포트폴리오를 만드는 용이라면 무료 플랜으로도 충분하답니다. 리소스의 사용량일 많다면 유료 플랜을 써야해합니다.

 

 

 

• [Sites] 페이지로 넘어가셔도 보실 수 있는 버튼이에요

아래처럼 페이지가 넘어가면 해당하는 버튼을 눌러서 가져오면 됩니다.

git연동해서 해당 repository를 만들어 오면 된답니다!

 

딱히 수정해야하는 부분은 없고요. Build command부분만 아래와 같이 수정해주시면 된답니다. 그리고 deploy site를 클릭!

 

 

 

이렇게 git을 통해서 배포를 하신다면 해당 레포지토리가 업데이트 될 때마다 자동으로 수정된답니다

 

 

 

3. 배포 진행 상황을 아래와 같은 곳에서 확인하실 수 있답니다

현재는 배포 진행 중~~~

 

 

배포가 끝나셨다면 Site setting 로 들어가셔서 원하는 이름으로 site name을 변경해주시면 됩니다. 그 전까지는 랜덤한 네임으로 배포되어있어요.

 

 

 

 

 

 

 

 

 

If 배포에 실패했다면?

사실 그냥 배포에 바로 성공해버리면 배우는 게 없갰죠…아하하하하하하 ;
이미 두 차례 실패 , 배포에 실패했다면 아래와 같이 해당 deploy log로 들어가서 오류를 확인하시면 됩니다.