(React) SPA -> Single Page Application

원래 html만을 사용해서 웹 페이지를 만든다면 가정 합시다.

시작은 index.html에서 만약 a href를 사용한 링크를 누른다면 다른 페이지로 이동할겁니다.

이러한 페이지들은 어쩌구.html , 저쩌구.html 등등으로 웹페이지를 갈아엎고
어쩌구 or 저쩌구 .html로 바뀌도록 해왔습니다.

하지만 React 혹은 Vue를 사용한다면 이렇게 진행 되지 않는다.

Why -> React와 Vue는 SPA ( Single Page Application )로 만들어지기 떄문이다. 

Single Page Application이란 index.html이라는 화면을 사용자에게 보여주고
다른 페이지로 이동할때, 페이지 전체가 바뀌는것이 아닌 일부분만 바뀌는 것을 뜻한다.

쉽게 말해, 단일 페이지로 구현한 사이트를 말하는데
만약 화면에 Header, Main, Footer 이렇게 세가지 컴포넌트가 존재하고,
다른 페이지에도 Header, Main2, Footer 이런식으로 Main만 Main2로 교체 되었다면
Header와 Footer는 페이지 이동을 할때 새로 로딩되지 않고 Main만 Main2로 바뀌는 것이다.

--- SPA장점 ---

- 화면을 이동할때 마다 서버에 요청을 하지않아서 서버에 대한 부담이 줄어듬.

- Back과 Front가 분리되었음으로 업무에 대한 분담이 쉬워진다.

--- SPA단점---

- 처음 접속할때 모든 리소스를 한번에 실행하고 받아와서 초기 실행이 느릴수도 있다.