처음에 github page를 통해서 배포해보려고 했는데 잘 안되었다.
몇번을 해도 안되서 다른 배포수단을 찾아보았다
처음에는 vercel로 해봤는데 이것도 오류가 나서 netlify를 한번 써볼까 하고 써봤다.
페이지 이름도 바꿀수 있어서 좋았다. (vercel도 되겠지?..)
vercel배포하면서 알게된 사실인데, 내가 만든 페이지는 디렉토리를 하나 더 타고 들어가서 배포가 되야된다.
github page 가 안되었던 이유는 아마 상위 디렉토리에서 배포가 되어서 그런 것 같다.(추측)
vercel은 기존에 해봐서 netlify를 써볼까하고 오류나자마자 넘어갔다.
순서는 이러하다
- basic디렉토리를 client폴더로 설정해주고 /build 폴더를 설정해주었다.
- build 명령어를 `CI= yarn run build` 를 입력해주어야한다. (띄어쓰기도 주의해야한다.)
- 빌드가 되고 사이드이름도 간단하게 바꿔서 되는 줄 알았는데, 다른페이지를 들어가니깐 404오류가 떴다.
- 찾아보다가, react-router는 다른 설정을 해줘야 하는걸 알아냈다. 그리고 이사이트를 참조하고 해결해냈다.
! React Router 문제 해결하기 이러한 문제가 발생하는 이유는 우리가 각 URL에 맞추어 페이지를 보여주는 Router 역시 React에 포함되어 있기 때문입니다. netlify의 최초 설정은 / 로 들어왔을 때, index.html을 내려주는 것으로 되어 있습니다. 그런데 netlify에는 /result/elon 으로 들어왔을 땐 어떤 html을 내려주어야 할지 설정이 되어 있지 않습니다. 그래서 /result/elon url로 들어오더라도 index.html을 내려주고, index.html에 있는 React-Router가 Routing을 해 결과 페이지를 보여주도록 변경하여야 합니다. ! netlify Redirect 조건 설정하기 public 폴더 내에 \_redirects 파일을 하나 만듭니다. 확장자 없이 \_redirects입니다. 그리고 아래의 코드를 저장합니다. * /index.html 200 위 코드의 의미는 어떠한 경로로 들어오던 간에 index.html를 내려주겠다는 의미입니다. 위 코드를 추가하고 커밋을 하여, 배포합니다