react-router-dom 환경 구축하기

1. react-router-dom 설치

npm install react-router-dom

 

2. Router 환경 구축하기

import { createBrowserRouter } from 'react-router-dom'

import HomePage from '~/pages/MainPage'

export const router = createBrowserRouter([
  {
    path: '/',
    element: <HomePage />
  }
])

3. App.tsx에 라우터 호출하기

import { RouterProvider } from 'react-router-dom'
import { router } from './routes/Router'

function App() {
  const [theme, onToggle] = useTheme()
  return (
    <>
           ...      
           
           <RouterProvider router={router} />
           
           ...
  
    </>
  )
}

export default App