본문 바로가기

react

create-react-app을 github page로 배포하기

레퍼지토리에 올려놓은 create-react-app으로 만든 앱을 github page로 호스팅 할 수 있습니다.

 

방법은 

https://facebook.github.io/create-react-app/docs/deployment

 

Create React App · Set up a modern web app by running one command.

Set up a modern web app by running one command.

facebook.github.io

이 페이지에 자세히 나와있고 생각보다 금방 세팅할 수 있다.

추가로 클라이언트에서 라우팅 하는 부분은 github page에서 제공해주지 않아서 추가로 설정해줘야 할 게 있다. 해쉬 라우팅을 사용해서 해결했다.

 

react-router-dom 모듈에서 BrowserRouter 사용 부분을 HashRouter로 사용하도록 수정하고 배포하니깐 바로 작동하는 걸 확인할 수 있었다. 아래 링크를 참고했는데 create-react-app 문서를 다시 찾아보니 제대로 봤으면 헤매지 않고 바로 찾아서 적용할 수 있었을 것 같다.

다른 부분에서 문제를 찾느라 좀 헤맸다.

https://stackoverflow.com/questions/52024667/react-client-side-routing-with-react-router-on-gh-pages

const Root = () => (
    <Provider store={store} basename={process.env.PUBLIC_URL}>
        <HashRouter>
            <App/>
        </HashRouter>
    </Provider>
);