[WEB] SPA란?

● SPA란?

---

- Single Page Application(단일 페이지 어플리케이션)

- 기존 웹 서비스는 요청시마다 서버로부터 리소스, 데이터를 해석하고 화면에 랜더링 하는 방식

- 그러나 SPA형태는 브라우저에 최초에 한번 페이지 전체 로드 후 이후 부터 특정 부분만 Ajax를 통해 데이터를 바인딩하는 방식

- 전통적인 페이지 vs 단일 페이지 어플리케이션 비교

- 예전부터 개발자들은 지속적으로 웹서비스와 개발방식을 발전 시켜옴

- CSS, JS 리소스 등 CDN형태로 캐싱 및 압축하고, View에서 템플릿엔진 들을 사용하고, 초기 SPA개념인 Backbone.js, Angular.js 라이브러리들이 나왔고, 지금은 템플릿 개념을 지나 컴포넌트 개념인 React.js, Vue.js, Angular2 등 이렇게 다양한 라이브러리와 프레임워크가 등장했고 자바스크립트는 발전해 나가고 있음.

- 컴포넌트 개념

- 컴포넌트들이 모여 한 페이지를 작성하고, 특정 부분만 데이터를 바인딩 하는 개념.

- SPA 구현을 쉽게 말하면 jsp파일 없이 index.html파일 하나에서 js, css등 리소스 파일들과 모듈들을 로드해서 페이지 이동 없이 특정영역만 새로 모듈을 호출하고 데이터를 바인딩하는 개념.

- 물론 이와 같이 개발하기 위해서는 ES6, Node.js와 npm 그리고 webpack, Babal같은 번들러 등 개념을 한번 정도는 잡고 접근해야 할게 많음.

- SPA 중심에는 Vue, Angular, React가 존재.

---

출처

https://linked2ev.github.io/devlog/2018/08/01/WEB-What-is-SPA/