React Router란?

React는 SPA(Single Page Applicatoin)이다.

• SPA : 페이지(Page)가 하나(Single)인 어플리케이션(Application)

 

React Router란?

여러개의 페이지를 사용하며, 새로운 페이지를 로드하는 기존의 MPA(<a href="xxx.html>" 방식과 달리 새로운 페이지를 로드하지 않고 하나의 페이지 안에서 필요한 데이터만 가져오는 형태를 가진다. 이처럼 페이지가 하나이기 때문에, 페이지 이동이 불가능하지만 일반 웹 사이트처럼 URL에 따른 페이지 이동을 할 수 있게 해주는 기능이 React Router이다.

⇒ 한 페이지 안에서 여러 페이지를 보여주는 것.

 

즉, 둘의 차이는 단순하게

현재의 페이지를 완전히 다시 로드해서 새로 구성을 하느냐

아니면 필요한 데이터만 가지고 와서 재로드 없이 렌더링하느냐의 차이이다.

 

Link는 <Route>안에 있어야 작동하고 app을 감싸는 router가 있어야하며 그 안에서 switch(router안에 없어도됨)로 해당 url별 컴포넌트를 정의해줌. 컴포넌트들 안에서 이동은

 

import { useHistory } from "react-router-dom";

const history = useHistory();
history.push("/login");

 

---

[참고]

 React로 블로그 만들기 14 : 리액트 라우터 (React Router. 1)

https://dev-yakuza.posstree.com/ko/react/react-router/