netlify 배포

[seongwon030]

원래 사이트에서 하다가 not found가 계속 떠서 터미널로 했는데 아무리 생각해도 아닌것 같았다. 여기에 이유가 있다.

사이트로 계속 시도하다가 일단 성공을 했다..

not found

deploy log는 모두 성공했는데 사이트를 접속하니 not found가 떴다.

리디렉션

spa 방식인 리액트가 하나의 페이지인 index.html만 렌더링한다. 최초 접속할 때 url이 루트("/")인데 서버는 URL요청 들어올 때 index.html만 보내기 때문에, 화면을 넘길 때마다 라우팅된 다른 url들이랑 자원이 안 맞아서 오류가 발생한다.

public폴더에 _redirect를 추가한다.

/* : 어떤 경로로 들어오든지
200 : 200 상태코드를 내려주고 index.html 파일을 렌더링 한다.

브라우저 라우터

React App 을 루트 디렉토리에서 호스팅하면 BrowserRouter 사용할 때 별다른 설정이 필요없다, 하지만 나는 루트 디렉토리가 아닌 서브 디렉토리에서 호스팅하고 있어서 브라우저가 앱의 URL을 잘못 해석해서 정적 리소스를 찾지 못한다고 한다...

해결 방법

BrowserRouter 의 prop인 basename을 사용하면 React 앱이 서브 디렉토리에 있을 때도 올바른 URL 생성이 가능하다. {process.env.PUBLIC_URL} 는 앱이 호스팅되는 환경에 맞게 기본 URL을 가져올 수 있다.

netlify.toml

나중에 추가예정