[0614] React Router

리액트는 다른 화면을 보여줄 때
새로운 페이지를 로드하는 것이 아니라
하나의 페이지에서 url에 따라 데이터를 렌더링 해주는 SPA(Single Page Application)이다.
이를 구현하기 위해 사용하는 라이브러리가 React Router이다.

설치

npm install react-router-dom

사용 V5

App.js에 다음의 내용을 추가하여 사용

import { BrowserRouter, Routes, Route } from "react-router-dom";

// pages
import Main from "./pages/Main";

import PATH from "./common/constants/path";

function App() {
  return (
    <BrowserRouter>
      <Routes>
        <Route path={PATH.main} element={<Main />}></Route> // PATH.main === '/'
      </Routes>
    </BrowserRouter>
  );
}

export default App;

V6