[React] react-router로 SPA 개발

16.1 SPA

1. spa란 single page application

2. 리액트 같은 라이브러리 또는 프레임워크를 사용해서 뷰 렌더링을 유저의 웹 브라우저가 담당하도록, 애플리케이션을 우선 웹 브라우저에 로드시킨 후 필요한 데이터만 전달받아 보여 주는 것

3. SPA는 서버에서 제공되는 페이지가 하나이지만, 로딩을 한 번 하고 나면 웹 브라우저에서 나머지 페이지들을 정의한다.

4. 페이지에 들어온 후 다른 페이지로 이동할 때는 서버에 새로운 페이지를 요청하는 것이 아니라, 새 페이지에 필요한 데이터만 받아 와 그에 따라 웹 브라우저가 다른 종류의 뷰를 만들어 주는 것

5. 주소에 따라 다른 뷰를 보여주는 것을 Routing이라고 한다.

6. react-router를 사용해서 구현할 수 있다.

7. react-router는 third-party-library, 이 라이브러리는 클라이언트 사이드에서 진행하는 라우팅 과정을 간략하게 해 줌

8. SPA 단점 : 앱 규모가 커지면 JS 파일 크기도 커진다는 것
   페이지를 로딩할 때, 유저가 실제 방문하지 않을 수도 있는 페이지와 관련된 컴포넌트 코드도 넘어가기 때문
   이는 코드 스플리팅으로 개선할 수 있다고 함

16.2 프로젝트 구성