SPA (Single Page Application)의 기본

1588 단어 SPAHTML5자바스크립트

SPA(Single Page Application)란 무엇인가?


  • 단일 페이지로 구성된 웹 응용 프로그램
  • JavaScript에서 DOM을 조작하고 페이지를 전환합니다.
  • Ajax 및 WebSocket 사용


    • SPA까지의 변천


  • 2010년 스티브 잡스가 Thoughts on Flash을 발표.
  • 그것이 계기가 되어 Flash등의 Proprietary Software(소프트웨어의 배포자가 독점적으로 제공하고 있는 소프트웨어)가 쇠퇴
  • 2014년에 HTML5 정식 권고가 된 적도 있어, Flash등을 대신하는 기술로서 HTML5가 추진되어 왔다.
  • HTML5에서 Flash와 동등한 UI/UX를 구현하기 위해 SPA가 개발되었다.


    • SPA에서 사용되는 기술


  • JavaScript 프레임 워크, 라이브러리 (Angular, Vue.js, React 등)
  • CSS Preprocessor (sass, stylus 등)
  • 통신 기술 (Ajax, WebSocket 등)
  • 백엔드 기술(Ruby on Rails 등)
  • HTML5/CSS3


    • SPA의 장점


  • 풍부한 표현력
  • 크로스 브라우저
  • 응답이 빠르다
  • 개발 속도가 빠릅니다

    • 푸시 알림 등도 API로 제공됩니다.

    메커니즘의 차이



    기존 웹 애플리케이션





    SPA





    주요 라이브러리, Framework


  • React
  • Facebook에서 만든 View 라이브러리

  • Vue.js
  • 오픈 소스 프레임 워크

  • Angular
  • Google 프레임 워크

    • Mithril.js(+Node.js+MongoDB)에서 회의실 예약 웹 앱
    Rails에서 jQuery를 사용하여 SPA와 같은 화면 전환이없는 다중 모델 추가로드

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage