> For the complete documentation index, see [llms.txt](https://shhn0509.gitbook.io/react/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://shhn0509.gitbook.io/react/react-router/what-is-react-router.md).

# React Router란?

## MAP & SPA

멀티 페이지 애플리케이션은  페이지를 이동 할 때마다 다시 렌더링  되는 단점 때문에 각 페이지로 이동하는데 시간이 걸리고 페이지가 무거워진다. 

싱글 페이지 애플리케이션은 **하나의 페이지** 안에서 특정 영역에 View가 다시 그려지는 것이다. 페이지에 여러 컴포넌트를 구성해서 사용자가 요청할 시에 컴포넌트를 보여주고 제거하기 때문에 페이지가 가벼워지고 빠르게 사용자가 요청하는 것을 불러올 수 있다. 

{% hint style="info" %}
하지만 싱글 페이지 애플리케이션은 검색 엔진 최적화에 적합하지 않다. 
{% endhint %}

## React Router

싱글 페이지 애플리케이션(Single Page Application, SPA)를 React앱에서 사용할 수 있도록 하는 라이브러리다. 

{% embed url="<https://reactrouter.com/>" %}

## React Router 워크 플로우 <a href="#work-flow" id="work-flow"></a>

![](https://831271375-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MSRg9KgNRIGErVFy_6g%2F-MUlo5vHWZy9_iRp_Tp9%2F-MUlqbHsmHi1vQFkDFjo%2Fimage.png?alt=media\&token=282423be-e319-4228-b107-792ec7ce551f)

## 설치  <a href="#install" id="install"></a>

```bash
$ npm i react-router-dom
```