Help us understand the problem. What is going on with this article?

SPA(Single Page Application)の基本

More than 1 year has passed since last update.

SPA(Single Page Application)の基本

by takanorip
1 / 9

SPA(Single Page Application)って何?

  • 単一ページで構成されるWebアプリケーション
  • 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として提供されている


仕組みの違い


従来のWebアプリケーション

スクリーンショット 2016-10-20 12.59.39.png


SPA

スクリーンショット 2016-10-20 12.59.47.png


主なライブラリ、Framework

  • React
    • Facebook製のViewライブラリ
  • Vue.js
    • オープンソースなフレームワーク
  • Angular
    • Google製のフレームワーク
takanorip
都内でフロントエンドエンジニアをやっています。
https://takanorip.com
folio-sec
誰もがかんたんに資産運用することができるサービス「フォリオ」を作っているFinTech系スタートアップ
https://corp.folio-sec.com/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした