리엑트 라우터란 express 와 마찬가지로 라우터 하는 용도로 쓰이고있다.
사전준비
1.yarn add react-router-dom
2.Router.js 파일 생성
// src/Components/Router.js
import React from "react";
import { HashRouter as Router, Route } from "react-router-dom";
import Home from "Routes/Home";
import TV from "Routes/TV";
import Search from "Routes/Search";
export default () => (
<>
</>
);
그리고 각각의 url 에 행당되는 js 폴더를 만든다
// src/Routes/Detail.js
export default() => "Detail";
// src/Routes/Home.js
export default() => "Home";
// src/Routes/TV.js
export default() => "TV";
// src/Routes/Search.js
export default() => "Search";
그리고 헤더 폴더를 하나 만들어서 엥커를 렌더링한다
//src/Components/Header.js
import React from "react";
export default () => (
);그리고 나서 다시 라우터 폴더로 들어간후
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";
export default () => (
);
Switch 를 임폴트 해준다 이때 Switch 를 불러오는 이유는 오직 하나의 Route만 Render를 하기 해주기 위함이다.
이렇게하면 간단한 라우터 만들기가 끝이난다.
