FrontEnd/React

[ReactJS] Router

kurooru 2023. 1. 13. 17:06

Router란 http 주소 내에서 보여줄 페이지를 골라주는

길잡이 역할을 한다.

import { BrowserRouter as Router, Routes, Route, } from "react-router-dom";
import Home from "./routes/Home";
import Movie from "./routes/Detail"
function App() {
  return (
    <Router>
      <Routes>
        <Route path="/movie" element={<Movie />}></Route>
        <Route path="/" element={<Home />}></Route>
      </Routes>
    </Router>
  )
}

export default App;

윗 코드에서 react-router-dom으로부터 BrowserRouter, Routes, Route를 빌려 와

주소 뒤에 /movie가 붙었을 때는 Movie component를,

아무 것도 붙어 있지 않을 때는 Home component를 불러 옴을 알 수 있다.