ステートフルJavaScript

―MVCアーキテクチャに基づくWebアプリケーションの状態管理

[cover photo]
TOPICS
Web , HTML/CSS , JavaScript
発行年月日
PRINT LENGTH
304
ISBN
978-4-87311-554-2
原書
JavaScript Web Applications
FORMAT
PDF
Ebook
3,080円
Ebookを購入する

ステートフルなJavaScriptアプリケーション開発についての解説書。HTML5とCSS3のおかげで単に自律的なだけではなく外見も美しくデスクトップアプリと同様のエクスペリエンスをブラウザ上で得られるようになりました。本書ではステートフルなWebアプリをMVCモデルに沿って開発しながら、その背後にある理論から各種ライブラリを利用した実践に至るまで幅広く解説します。ステートフルなコードとMVCを組み合わせることにより、MVCの3要素をクライアント側で実行することが可能になり、単なるAjaxアプリケーションでは実現できないよりデスクトップアプリに近いエクスペリエンスを提供できます。

関連ファイル

目次

目次
まえがき

1章  MVCとクラス
    1.1 初期の JavaScript
    1.2 アプリケーションの構造化
    1.3 MVCとは
        1.3.1 モデル
        1.3.2 ビュー
        1.3.3 コントローラ
    1.4 モジュール性のためのクラス設計
    1.5 クラスへの関数の追加
    1.6 クラスライブラリへのメソッドの追加
    1.7 プロトタイプを使ったクラスの継承
    1.8 クラスライブラリに継承を追加する
    1.9 関数呼び出し
    1.10 有効範囲を制限する
    1.11 プライベート関数の追加
    1.12 その他のクラスライブラリ

2章 イベントと監視
    2.1 イベントの監視
    2.2 イベントの発生順序
    2.3 イベント処理のキャンセル
    2.4 イベントオブジェクト
    2.5 イベントライブラリ
    2.6 コンテキストの変化
    2.7 イベントの委譲
    2.8 カスタムイベント
    2.9 カスタムイベントと jQueryプラグイン
    2.10 非 DOMイベント

3章 モデルとデータ
    3.1 MVCと名前空間
    3.2 ORMの作成
        3.2.1 プロトタイプによる継承
        3.2.2 ORMのプロパティを追加する
        3.2.3 レコードの永続化
    3.3 ID値の割り当て
    3.4 参照の管理
    3.5 データの読み込み
        3.5.1 初期表示のページへの埋め込み
        3.5.2 Ajaxによるデータの読み込み
        3.5.3 JSONP
        3.5.4 ドメイン間リクエストのセキュリティ
    3.6 データの配置
    3.7 データのローカル保存
        3.7.1 ORMでのローカル保存
    3.8 新規レコードのサーバへの送信

4章 コントローラと内部状態
    4.1 Moduleパターン
        4.1.1 グローバル変数のインポート
        4.1.2 グローバル変数のエクスポート
    4.2 コンテキストの定義
        4.2.1 ライブラリへの抽象化
        4.2.2 ドキュメントの後にコントローラを読み込む
        4.2.3 ビューへのアクセス
        4.2.4 イベント処理の委譲
    4.3 状態機械
    4.4 ルーティング
        4.4.1 URLのハッシュ
        4.4.2 ハッシュの変化の検知
        4.4.3 Ajax Crawling
        4.4.4 HTML5のHistory API

5章 ビューとテンプレート
    5.1 ビューの動的な描画
    5.2 テンプレート
        5.2.1 テンプレートヘルパ
        5.2.2 テンプレートの配置
    5.3 バインディング
        5.3.1 モジュールへのバインディング

6章 依存性の管理
    6.1 CommonJS
        6.1.1 モジュールの宣言
        6.1.2 モジュールとブラウザ
    6.2 モジュールローダー
        6.2.1 Yabble
        6.2.2 RequireJS
    6.3 複数のモジュールのラッピング
    6.4 その他の依存性管理ツール
        6.4.1 LABjs
    6.5 FUBC

7章 ファイルの操作
    7.1 各ブラウザの対応状況
    7.2 ファイルについての情報の取得
    7.3 ファイル用 inputタグ
    7.4 ドラッグ&ドロップ
        7.4.1 ドラッグ
        7.4.2 ドロップ
        7.4.3 デフォルトの処理の抑止
    7.5 コピー&ペースト
        7.5.1 コピー
        7.5.2 ペースト
    7.6 ファイルの読み込み
        7.6.1 Blobとslice()
    7.7 カスタムの参照ボタン
    7.8 ファイルのアップロード
        7.8.1 アップロードの進捗表示
    7.9 ドラッグ&ドロップ対応アップローダー
        7.9.1 ドロップ先の領域
        7.9.2 ファイルのアップロード

8章 リアルタイム Web
    8.1 リアルタイム Webの歴史
    8.2 WebSocket
        8.2.1 Node.jsとSocket.IO
    8.3 リアルタイムアーキテクチャ
    8.4 体感速度

9章 テストとデバッグ
    9.1 ユニットテスト
        9.1.1 アサーション
        9.1.2 QUnit
        9.1.3 Jasmine
    9.2 ドライバ
    9.3 無人テスト
        9.3.1 Zombie.js
        9.3.2 Ichabod
    9.4 分散テスト
    9.5 サポートの提供
    9.6 インスペクタ
        9.6.1 Webインスペクタ
        9.6.2 Firebug
    9.7 JavaScriptコンソール
        9.7.1 コンソールヘルパ
    9.8 デバッガ
    9.9 ネットワークリクエストの分析
    9.10 プロファイリングと計測

10章 アプリケーションのデプロイ
    10.1 処理速度
    10.2 キャッシュ
    10.3 コードの最小化
    10.4 GZIP圧縮
    10.5 CDN
    10.6 監査
    10.7 参考資料

11章  Spineライブラリ
    11.1 セットアップ
    11.2 クラス
        11.2.1 インスタンス化
        11.2.2 クラスの拡張
        11.2.3 コンテキスト
    11.3 イベント
    11.4 モデル
        11.4.1 レコードの検索
        11.4.2 モデルのイベント
        11.4.3 データの検証
        11.4.4 永続化
    11.5 コントローラ
        11.5.1 プロキシ
        11.5.2 要素
        11.5.3 イベントの委譲
        11.5.4 コントローラのイベント
        11.5.5 グローバルなイベント
        11.5.6 Renderパターン
        11.5.7 Elementパターン
    11.6 連絡先管理アプリケーションの作成
        11.6.1 Contactモデル
        11.6.2 Sidebarコントローラ
        11.6.3 Contactsコントローラ
        11.6.4 Appコントローラ

12章  Backboneライブラリ
    12.1 モデル
        12.1.1 モデルと属性
    12.2 コレクション
        12.2.1 コレクション内での順序
    12.3 ビュー
        12.3.1 ビューの描画
        12.3.2 イベントの委譲
        12.3.3 コンテキストの関連づけ
    12.4 コントローラ
    12.5 サーバとの同期
        12.5.1 コレクションへの格納
        12.5.2 サーバ側での処理
        12.5.3 永続化処理のカスタマイズ
    12.6 ToDoリストアプリケーションの作成

13章  JavaScriptMVCライブラリ
    13.1 セットアップ
    13.2 クラス
        13.2.1 インスタンス化
        13.2.2 親クラスのメソッドの呼び出し
        13.2.3 プロキシ
        13.2.4 静的継承
        13.2.5 イントロスペクション
        13.2.6 モデルの例
    13.3 モデル
        13.3.1 属性と監視
        13.3.2 モデルの拡張
        13.3.3 セッタ
        13.3.4 デフォルト値
        13.3.5 ヘルパメソッド
        13.3.6 サービスのカプセル化
        13.3.7 型の変換
        13.3.8 CRUDのイベント
    13.4 クライアント側でのテンプレートの利用
        13.4.1 基本的な利用方法
        13.4.2 jQueryのDOM操作メソッド
        13.4.3 scriptタグからの読み込み
        13.4.4 $.Viewとサブテンプレート
        13.4.5 deferredオブジェクト
        13.4.6 パッケージ化、事前読み込み、処理速度
    13.5 $.Controller(jQueryのプラグインファクトリ)
        13.5.1 概要
        13.5.2 コントローラのインスタンス化
        13.5.3 イベントへの関連づけ
        13.5.4 アクションのテンプレート
    13.6 まとめ(CRUDに対応した汎用的なリスト)

付録 A jQuery入門
    A.1 DOM内の移動
    A.2 DOMの操作
    A.3 イベント
    A.4 Ajax
    A.5 他のライブラリとの共存
    A.6 拡張
    A.7 Growl風 jQueryプラグインの作成

付録 B CSSの拡張
    B.1 変数
    B.2 ミックスイン
    B.3 入れ子のルール
    B.4 他のスタイルシートのインクルード
    B.5 色の指定
    B.6 利用法
        B.6.1 コマンドライン
        B.6.2 Rack
        B.6.3 JavaScript
        B.6.4 Less.app

付録 C CSS3リファレンス
    C.1 接頭辞
    C.2 色
    C.3 角の丸め
    C.4 ドロップシャドウ
    C.5 文字の影
    C.6 グラデーション
    C.7 複数の背景画像
    C.8 セレクタ
        C.8.1 n番目の要素
        C.8.2 直接の子要素
        C.8.3 セレクタの否定
    C.9 トランジション
    C.10 枠線の画像
    C.11 ボックスのサイズ
    C.12 2D変換
    C.13 柔軟なボックスモデル
    C.14 フォント
    C.15 エラーのない機能制限
        C.15.1 Modernizr
        C.15.2 Google Chrome Frame
    C.16 レイアウトの作成
索引