アイソモーフィックJavaScriptは、クライアントサイド(ブラウザ)とサーバーサイドで同じコードを実行できるようにするためのフレームワークの総称。本書では、従来のアプリケーションが持つ問題点(読み込みの遅さ、SEO対策の困難さなど)を明らかにするところから始め、アイソモーフィックなアプリケーションの分類やアイソモーフィックさの度合いについて理解したうえで、アイソモーフィックなJavaScriptフレームワークを構築するための実践手法を解説し、Walmart、Airbnb、Facebook、Netflixといった大企業がアイソモーフィックJavaScriptを選んだ理由を明らかにします。読者は、なぜこのアプリケーションアーキテクチャーが、ページ読み込み速度やSEOコンパチビリティといった、ビジネス面でクリティカルな問題を解決するためのソリューションとして人気上昇中なのかを学べます。
アイソモーフィックJavaScript
Jason Strimpel、Maxime Najim 著、牧野 聡 訳
- TOPICS
- Web , JavaScript
- 発行年月日
- 2017年07月
- PRINT LENGTH
- 256
- ISBN
- 978-4-87311-807-9
- 原書
- Building Ismorphic JavaScript Apps
- FORMAT
- PDF EPUB
関連ファイル
目次
賞賛の声 まえがき 第Ⅰ部 イントロダクションと基本的な概念 1章 アイソモーフィックJavaScriptが求められる理由 1.1 アイソモーフィックJavaScriptの定義 1.2 Webアプリケーションのアーキテクチャーの評価 1.2.1 変化を求める風潮 1.2.2 エンジニアとしての懸念 1.2.3 利用可能なアーキテクチャー 1.3 アイソモーフィックさが必要ない場合 1.4 まとめ 2章 アイソモーフィックJavaScriptのスペクトル 2.1 ビューの共有 2.1.1 テンプレートの共有 2.1.2 ビューのロジックの共有 2.2 ルーティングの共有 2.3 モデルの共有 2.4 まとめ 3章 アイソモーフィックJavaScriptのカテゴリー 3.1 環境に依存しないコード 3.2 それぞれの環境にシムが用意されたコード 3.3 まとめ 4章 サーバー側での描画を超えて 4.1 リアルタイムWebアプリケーション 4.1.1 アイソモーフィックなAPI 4.1.2 双方向のデータの同期 4.1.3 サーバー上でのクライアントのシミュレーション 4.2 まとめ 第Ⅱ部 アプリケーションの作成 5章 アプリケーションの基盤 5.1 Node.jsのインストールと実行 5.1.1 ソースコードからのインストール 5.1.2 Node.jsのREPLの操作 5.1.3 npmを使ったプロジェクトの管理 5.2 プロジェクトのセットアップ 5.2.1 プロジェクトの初期化 5.2.2 アプリケーションサーバーのインストール 5.2.3 次世代JavaScript(ECMAScript 6)のコード 5.2.4 ECMAScript 6からECMAScript 5へのトランスパイル 5.2.5 開発のワークフローのセットアップ 5.3 まとめ 6章 HTMLドキュメントを公開する 6.1 HTMLのテンプレートの提供 6.2 パスパラメーターとクエリ文字列 6.3 まとめ 7章 アプリケーションの設計 7.1 課題を理解する 7.2 ユーザーのリクエストに応答する 7.2.1 Applicationクラスの作成 7.2.2 コントローラーの作成 7.2.3 コントローラーのインスタンス化 7.2.4 コントローラーの拡張 7.2.5 レスポンスのフローの改善 7.3 まとめ 8章 アプリケーションをクライアント側に転送する 8.1 クライアント向けアプリケーションのバンドル化 8.1.1 バンドル化ライブラリの選択 8.1.2 バンドル化のタスクの作成 8.1.3 クライアント側の実装の追加 8.2 ユーザーのリクエストに応答する 8.2.1 History APIの利用 8.2.2 History APIへの応答と呼び出し 8.3 クライアント側でのルーティング 8.3.1 コントローラー上でレスポンスのフローを実行する 8.4 コードの整理 8.5 まとめ 9章 よく使われる抽象化 9.1 抽象化する理由とタイミング 9.2 cookieの読み書き 9.2.1 APIを定義する 9.3 リクエストのリダイレクト 9.3.1 APIを定義する 9.4 まとめ 10章 シリアライズ、デシリアライズ、関連付け 10.1 データのシリアライズ 10.2 コントローラーのインスタンス化 10.3 データのデシリアライズ 10.4 DOMイベントのハンドラの関連付け 10.5 リハイドレートの動作確認 10.6 まとめ 11章 ここまでの振り返り 11.1 実運用への対応 11.2 どの程度の構造が必要か知る 11.2.1 変化を受け入れる 11.3 まとめ 第Ⅲ部 実世界でのソリューション 12章 WalmartLabsでのアイソモーフィックなReact 12.1 種の起源 12.1.1 課題 12.1.2 ソリューション 12.2 Reactでのひな型のコードとパターン 12.2.1 サーバー側での描画 12.2.2 クライアント側での処理の継続 12.3 Walmartでのアプローチ 12.4 課題の克服 12.4.1 1バイト目までの時間 12.4.2 コンポーネントの描画の最適化 12.4.3 パフォーマンスの改善 12.5 今後の展望 12.6 謝辞 12.7 追記 13章 フルスタックのAngular 13.1 アイソモーフィックJavaScript:未来のWebアプリケーション 13.2 アイソモーフィックなAngular 1 13.2.1 ng-conf 2015にて 13.3 Angular 2でのサーバー側の描画 13.3.1 サーバー側での描画のユースケース 13.3.2 Webアプリケーションでのギャップ 13.3.3 Angular 2の描画アーキテクチャー 13.3.4 Prebootライブラリ 13.4 Angular Universal 13.4.1 フルスタックのAngular 2 13.5 GetHuman.comの現状 13.6 追記 14章 Brisket 14.1 課題 14.2 両者の長所 14.3 初期のBrisket 14.4 実現に向けて 14.5 コードの自由 14.5.1 テンプレート言語の自由 14.6 すべての環境で一貫したAPI 14.6.1 モデルとコレクション 14.6.2 ビューのライフサイクル 14.6.3 子ビューの管理 14.6.4 環境を問わず期待どおりに機能するツール 14.7 開発者の邪魔をしない 14.7.1 ClientAppとServerApp 14.7.2 レイアウトのテンプレート 14.7.3 その他の知見 14.8 今後の展望 14.9 追記 15章 ColonyのNode.jsを使わないアイソモーフィックアプリケーション 15.1 課題 15.2 テンプレート 15.3 データ 15.4 トランスパイルされたビューモデル 15.5 レイアウト 15.6 ページメーカー 15.7 フロントエンドのSPA 15.8 最終的なアーキテクチャー 15.9 今後の展望 16章 アイソモーフィックJavaScriptとユニバーサルJavaScript 16.1 デザインパターン群、Flux、アイソモーフィックJavaScript 16.2 いつでもJavaScriptに賭けよう 16.3 用語と理解 索引