「最新ＳＰＡ開発を学ぼう　ウェブエンジニアのためのAngular.js入門」

10月11日、PHP Conference 2014に行ってきて、聞いて聞いた内容をメモメモ

次は「最新ＳＰＡ開発を学ぼう　ウェブエンジニアのためのAngular.js入門」をメモメモ



・ＳＰＡって何？
　　Single Page Application
　　１つのページでアプリが完結する
　より流動的なＵＸ
　　　いままで→マルチページアプリケーション：ＵＲＬで遷移
　　　　ＵＲＬ遷移はＵＸ的には断絶
　　　ＤＯＭ操作で画面遷移
　なぜ、ＳＰＡ開発が増えている？
　　　デスクトップアプリのＵＸをウェブへ
　　　ＲＩＡプラットフォームの受け皿→ＨＴＭＬ５のＳＰＡへ
　　　　　apache flex ,curl, silverlight
　　　基礎技術の確立
　　　　　pushStateなどHistoryAPI
　　　　　JSライブラリ、フレームワーク
　　　　　JavaScript実行高速化
　　　利用されるフレームワーク：たくさんある
　　　　　今日はAngularJS
・AngularJSの特徴
　　ＨＴＭＬを拡張してアプリを記述
　　ＳＰＡに適した機能セット
　　　ルーティング
　　　データバインディング
　　　ＤＩコンテナ
　　　ディレクティブ

　　ルーティング
　　　ＵＲＬのハッシュやＨｉｓｔｏｒｙＡＰＩでビュー切り替え
　　　画面の一部が遷移
　　　　ng-view：サーバーサイドのルーティングににてる
　　　　なぜ必要：なくても良い

　　データバインディング
　　　　ＪＳオブジェクトとＤＯＭを結びつける
　　　　スコープ：ＤＯＭツリーと一対
　　　　ng-controller
　　　　テンプレートエンジンではない→即座にＤＯＭに反映
　　　→今ではモダンＪＳフレームワークではほぼ必須機能
　　　　JQuery的手続き処理からの脱却

DIコンテナ
　　　DIパターン
　　　依存を外から渡してもらう設計パターン
　　　ＤＩコンテナ使うと比較的簡単にできる

　　ディレクティブ
　　　ng-click
　　　ディレクティブのしくみ
　　　　→タグとして使える

まとめ

Q&A
ＳＰＡの弱点：SEOがきかない