Downloaded 18 times
Uploaded byKazuyoshi Tsuchiya
13,527 views
Angular jsの継続的なバージョンアップ
第1回ペパボテックカンファレンスhttp://pepabo.connpass.com/event/13208/#pbtech AngularJSの継続的なバージョンアップ
Recommended
More Related Content
What's hot
Viewers also liked
Similar to Angular jsの継続的なバージョンアップ
Angular jsの継続的なバージョンアップ
- 1.
- 2.自己紹介● 土屋和良● @tsuchikazu( nessy )● http://tsuchikazu.net● PHP/rails/angular● カラーミーショップ
- 4.
- 5.
- 6.Angularとは● JavaScriptフレームワーク● Googleが開発●フロントエンドの生産性向上が目的● フルスタック (MVW)
- 8.
- 9.
- 10.
- 11.
- 12.
- 13.アウトライン● 次期バージョンを見据えた実装● テスト●他技術のキャッチアップ
- 14.アウトライン● 次期バージョンを見据えた実装● テスト●他技術のキャッチアップ
- 15.
- 16.
- 18.Angular2へ● New Router○1系と2系を 共存可能 (まだ試せてない)● Migration 機能は今後もリリースされる
- 19.
- 20.
- 21.● TypeScript○ これから始める人○恩恵を受けれそう● ES6○ ES5で書いている人● CoffeeScript○ (これ使ってるけど、正直失敗感）Angular2へ
- 22.
- 23.● Serviceは単なるclassへ○ なるべくserviceを使う○resourceを使うものは、serviceにしにくい●今のところfactoryAngular2へ
- 24.
- 25.
- 26.● scopeはなくなる○ DirectiveでlinkではなくControllerを○controller as を使う○ componentらしくAngular2へ
- 27.
- 28.
- 29.アウトライン● 次期バージョンを見据えた実装● テスト●他技術のキャッチアップ
- 30.
- 31.
- 32.
- 33.
- 34.
- 35.Unit テスト• Controller/ Service / Directive• 自分の不安解消のため– 細かな分岐/パターン網羅• 自動テスト– Jasmine & Karma & CI• 構成が大きく変わった時は対応不可
- 36.
- 37.• Angular +API + (他システム) 全て• 期待した通りの動作をしているか– UI&UXも含む• 自動化するにはデータや環境準備などコスト高• 手動テストでカバーE2Eテスト
- 38.
- 39.• フロントエンドのみ （APIはMock）•内部実装に依存せずに、フロントエンド全体が期待通りに動作しているか• 自動テスト– Protractor & ngMockE2E & CIE2E with API Mockテスト
- 40.• 課題– APIのMockがズレるリスク–テストは通るのに、動かない– レスポンスの項目が増えた減った• Mock自体のテスト?E2E with API Mockテスト
- 41.E2E with APIMockテストを書こう
- 42.アウトライン● 次期バージョンを見据えた実装● テスト●他技術のキャッチアップ
- 43.他技術のキャッチアップ• Angular2– ES6module– Shadow DOM– HTML5 template tag
- 44.まとめ● 次期バージョンを見据えた実装○ Migration機能を取り入れよう●テスト○ E2E with API Mock テストをしよう● 他技術のキャッチアップ○ がんばろう
- 45.
- 46.