React Router(react-router-dom) 설치

SPA와 React

React프로젝트를 시작하려면 기본적으로 SPA의 개념을 이해할 필요가 있습니다. 
SPA는 Single Page Application 즉 단일페이지 어플리케이션이라는 의미인데요, 일반적으로 어떤 웹사이트를 이용할 때 url을 통해 유저가 새로운 페이지를 요청하면 해당되는 페이지리소스를 서버로부터 받아 새로운 화면을 브라우저를 통해 보게 됩니다. 이에 따른 서버의 역할을 라우팅(Routing) 이라고 하지요. 그래서 전통적으로 웹 어플리케이션은 각 url에 해당하는 여러 페이지로 구성되어 있었고 규모가 큰 어플리케이션의 경우 요즘과 같이 사용자와의 많은 상호작용과 데이터전송량에 따라 렌더링을 위한 서버자원사용에 따른 불필요한 트래픽, 속도저하 등의 문제가 생기게 되었습니다. 

React는 이와 같은 문제점을 해결하기위해 전통방식과 다른 개념을 도입한 라이브러리 또는 프레임워크입니다. 
서버측에서는 한 개의 페이지만 제공하고 해당하는 뷰 렌더링은 유저의 브라우저에게 역할을 넘겨 필요한 데이터만 전달한 뒤 적절한 뷰를 보여주도록 한 것입니다. 이때 해당뷰에 따른 url이 필요한 경우가 많은데 이 역할이 React에는 기본적으로 내장되어있지 않아 React Router를 별도 설치 후 사용해야 합니다.

 

 

 

react-router-dom 설치

cmd 또는 콘솔창을 열어 생성한 프로젝트폴더로 이동한 뒤 아래 설치명령어를 입력합니다.

npm install --save react-router-dom

 

설치완료 후 프로젝트 root폴더의 package.json파일을 열어 dependencies항목에 "react-router-dom"이 추가되었는지 확인합니다.