[React] Router 란 무엇인가

리액트 라우터

---

라우터란?

• 클라이언트에게 정해진 컴포넌트를 전송해주는 클래스.
• 웹 사이트에서 여기 저기 페이지를 옮겨다닐 때 사용한다. - href와 비슷한 역할이구나
• Switch는 한 페이지만 라우팅하고 싶을 때, exact는 정확히 일치하는 페이지만 주고 싶을 때 사용함

예제 코드

import React from "react";
import {
  BrowserRouter as Router,
  Route,
  Redirect,
  Switch
} from "react-router-dom";
import Home from "Routes/Home";
import TV from "Routes/TV";
import Search from "Routes/Search";

//exact 들어가면 반드시 일치해야됨
//Switch : 한번에 한 놈만 라우팅 시켜줌
//Redirect : 특정 패스를 다른 패스로 리디렉션 시켜줌(지금은 나머지 주소를 전부 루트로보냄)
export default () => (
  <Router>
    <Switch>
      <Route path="/" exact component={Home} />
      <Route path="/TV" exact component={TV} />
      <Route path="/TV/popular" render={() => <h1>popular!</h1>} />
      <Route path="/Search" component={Search} />
      <Redirect from="*" to="/" />
    </Switch>
  </Router>
);