React
[React] React Router Dom
낮에만코딩함
2022. 7. 21. 22:46
React Router Dom이란?
React Router Dom을 사용하면 웹 앱에서 동적 라우팅을 구현할 수 있다
라우팅이 실행중인 앱 외부의 구성에서 처리되는 기존 라우팅 아키텍쳐와 달리 React Router Dom은 앱 및 플랫폼의 요구 사항에 따라 컴포넌트 기반 라우팅을 용이하게 한다.
Single Page Application (SPA)
리액트는 SPA이기 떄문에 하나의 index.html 파일을 가지고 있다. 이 하나의 템플릿에 자바스크립트를 이용해서 다른 컴포넌트들이 index.htrml 템플릿에 넣으므로 페이지를 변경하게 된다. 이때 이 React Router Dom 라이브러리가 새 컴포넌트로 라우팅/탐색을 하고 렌더링하는데 도움을 준다.
React Router 설정하기
src 폴더에서 index.js 파일을 열고 react-router-dom에서 BrowserRouter를 가져온 다음 루트 구성 요소를 그 안에 래핑한다.
(이 글은 JohnAhn님의 강의를 참고하였습니다.)