21.06.30 React / Router

라우팅 = Router 를 말하기전에,

Single Page Application !! 즉, SPA를 알아야한다.
단어 처럼 증멜 간단하다. 서버에서 주는 html이 하나뿐인 어플리케이션이다!

딱 한번만 정적자원을 받아 오기만 하면 되는거고 사용성이 매우좋다.
페이지를 이동할 때마다 서버에서 주는 html로 화면을 바꾸다보면 상태 유지가 어렵고, 바뀌지 않은 부분까지 새로 불러오니까 비효율 적인 반면에

SPA는 한번만 부르면 되는거라 사용성이 좋다!

SPA도 브라우저 주소창대로 다른 페이지를 보여주는데 브라우저 주소에 따라 페이지를 보여주는걸
라우팅 이라고 한다.

라우팅을 쓰기위해서는
yarn add react-router-dom 패키지를 설치해야한다

라우팅 공식문서

패키지를 설치하고 나서!
import { BrowserRouter } from "react-router-dom";으로 임포트 해주면

라우팅 쓸 준비 끝 진짜 끝
<Route path="주소[/home 처럼 /와 주소를 적어요]" component={[보여줄 컴포넌트]}/>
이런 기본 형식에 불러올 컴포넌트를 적으면 된당

라우터 된 컴포넌트가 여러개이면 한 뷰에 다같이 보일 수가 있는데



이렇게 exact만 적어주면 해결된다.

모를때 볼 나를 위한 테그
https://www.notion.so/3-4a9eb47b9d774e19abeb815e13308768#9190a4a8d211451d93b8317e6fced66d