タダです。
今回はサーバーレスシングルページアプリケーション2章で勉強したことをまとめていきます。 www.oreilly.co.jp
章立ては以下のようになっています。
- 1章 シンプルにはじめる
- 2章 ハッシュイベントによるビューのルーティング
- 3章 シングルページアプリケーションに必要なもの
- 4章 Amazon CognitoによるIdentity as a Service
- 5章 DynamoDBにデータを格納する
- 6章 Lambdaを使って(マイクロ)サービスを作る
- 7章 サーバーレスのセキュリティ
- 8章 スケールアップする
2章のまとめ
- 今回はハッシュイベントを使って、動的マークアップの作成と表示をトリガーするルータを作る
- ルータは事前に定義されているルータを使って、URLハッシュとビュー関数を対応づける
- テストファーストのアプローチで書いたユニットテストを使ってルータをテストする
- テストを書くためにJasmineを使う
- Jasmineでは、describeとitという二つの関数を渡すコールバックにテストを書くことでテストをまとめられる
- describeは、テストにコンテキストとセットアップを加えられる
- itは、個別のテストを書くために使う
- 簡単なテストのためのコードを書いてアクセスするとこちらのようなページに遷移する
describe('Learnjs', function(){ it('can show a problem view', function() { learnjs.showView('#problem-1'); expect($('.view-container .problem-view').length).toEqual(1); }); });
- ルータ関数のテストを成功させるためには3つのことを追加する必要がある
- ルータにビューを追加する場所を与えるため、ビューコンテナを追加する必要がある
- showView関数をつくって最小限の問題ビューを作る必要がある
- ルータ関数と残りのアプリケーションを配置する名前空間を作成する必要がある
- ルートを導入するためには別のテストw作ることでその振る舞いを作る必要がある
- ビューをパラメータ化する
- ハッシュを二つのパーツ、名前とパラメータに分割して、区切り文字としてハイフンを入れる
- 振る舞いをテストするために、スパイ(spy)という新しい要素を導入する
- スパイはテストダブルの一種
- 実際のオブジェクトや関数の代役を務めることでテストをサポートする
- スパイを使ってルータと問題ビュー関数の相互作用を確認する
- JasmineのspyOn関数を使う
- 問題ビューのテストをもっと大きなスコープにまとめるために問題ビューのためのdescribeセクションを作って、describe関数に入れる方が良い
- シングルページアプリケーションは一度ロードするだけで処理が終わらないこともあるので、JavaScriptを置いてページローディング機構を作る
- jQueryの$.ready()関数を使う
- 最終的にテストが通るように改修していくと、以下の画面のようにオールグリーンになる
次は3章で問題ビューを実装していきます。