본문 바로가기
IT기술노트/소프트웨어공학

SPA(Single Page Web Application)

by 비트코기 2021. 2. 1.

I. 데이터만 변경하여 사용할 수 있는 웹 페이지, SPA의 개요

가. SPA(Single Page Web Application)의 정의

   - 데이터가 변경 시 리로딩 하는 웹 어플리케이션의 문제를 해결하기 위해 최초 로딩 후 데이터만 변경해서 사용할 수 있도록 구현한 웹 어플리케이션

나. SPA의 특징

특징

내용

라우팅(Routing)

네비게이션과 페이지를 리로드하지 않고 해시데크와 URL 변수를 통해 구현

UI 구현

UI DOM HTML 템플릿에 대한 선언적 바인딩으로 대체

동적 제어

AJAX 를 통해 상태 변경, 데이터관리 등을 동적으로 제어하고 관리

청킹(Chunking)

요청 시 전체 HTML 대신 JSON데이터나 부분적 HTML을 받아 처리


II. SPA의 구성 및 구현기술

가. SPA의 구성

나. SPA의 구현기술

구현기술

내용

종류

JavaScript

UI, 이벤트 및 동적 처리를 위한 Client기반 스크립트 언어

Angular.JS

Ajax

XMLJavaScript를 활용한 Polling방식 비동기 데이터 통신

XMLHttpRequest

HTML5

리치 웹 및 로컬 스토리지 등 다양한 웹 프로그래밍 API 제공

Web Socket

JSON

데이터 송수신 서비스를 위한 경량의 데이터 교환 포맷

문자열데이터객체화

RESTful Service

HTTP 기능만으로 데이터를 전달하는 프레임워크로 클라이언트와 서버간 구성요소 분리, 구현 단순화

POST, GET, PUT


III. SPA의 고려사항

   - 초기구동속도, 보안, 검색엔진 최적화 문제, 브라우저 버전

반응형

댓글