ngjapan報告会
DESCRIPTION
angularTRANSCRIPT
Angularが好き？ ～ ngJapan総まとめ ～
@albatrosaryhttp://albatrosary.hateblo.jp/ http://html5experts.jp/albatrosary/
佐川 夫美雄 HTML5 Experts.jp エキスパート html5j（スタッフ） AngularJS Japan User Group（スタッフ）(Fumio SAGAWA)
http://kagoshima.html5j.org/html5conference.2015/
http://ngjapan.org/
http://ngjapan.org/
New Router Pluralization and Gender support ng-animate update ng-message update ng-cookies update
リリースサイクル
Angularコミュニティ
10万人 1600ほどの新しいissueやPR 新しい200ほどのコントリビュータが新しいPRやissueを立てていたり、ドキュメントを修正するということを行っています
（二週間の間に）
HTML5ハイブリットアプリ用のUIフレームワーク Angularをベースにしている iOS, Androidをサポートしている 高速な動作
Angularのルーティングコンポーネントに対してマッピング
$routeConfigangular.model('example', [ 'example.goobye', 'example.welcame', 'ngAnimate', 'ngNewRouter' ]) .controller('AppController', ['$router', AppController]); AppController.$routeConfig = [ { path: '/', redirectTo: '/welcome' }, { path: '/welcame', component: 'welcome' }, { path: '/goodbye', component: 'goodbye' } ]; function AppController($router) { this.greeting = ‘Hello'; }
ng-link<body ng-app="example" ng-strict-di ng-controller="AppController as app"> <nav> <ul> <li><a ng-link="welcame">welcame</a></li> <li><a ng-link="goodbye">goodbye</a></li> </ul> </nav> <ng-viewport></ng-viewport> </body>
ngViewport
プレスフォルダに対しアクセス プレスフォルダの中はコンテンツに基づいて管理
Sibling RoutesAppController.$routeConfig = [ { path: '/', redirectTo: '/users/posts' }, { path: '/users/posts', components: { left: 'users', right: 'posts' } }, { path: '/posts/users', components: { left: 'posts', right: 'users' } } ];<nav> <a href="./users/posts">users then posts</a> <a href="./posts/users">posts then users</a> </nav> <div class="container"> <div ng-viewport="left"></div> <div ng-viewport="right"></div> </div>
マイグレーション- NewRouterは、Angular 1からAngular 2へのマイグレーションを簡単にする
Angular 1とAngular 2とで同じコンフィグレーションを使っていく 新しいRouterを使っていくことで一部はAngular 1で他の一部Angular 2で動く
ECMAScriptとは
JavaScriptの元となる仕様のこと DOMの仕様は入っていない 最近のブラウザはECMAScript 5をサポート そろそろ6の仕様が確定（現在RC2）
AtScriptとは
AtScript=ES6+A (A=Annotiosion, AnnotationはES6に含まれない) Super set of TypeScript
TypeScriptとは
TypeScriptはJavaScriptを拡張した言語 静的型付け ECMAScript6規格の文法を取り込み中 読みやすい変換後JavaScript Java, C#とかにやさしい言語仕様
Angular 2とTypeScript
TypeScriptに必要な機能が入る Angularチームが作りたいのはAtScriptではなくAngular本体 TypeScriptのスーパーセットを作るのが困難
なぜAngular 2を作ることにしたのか Angular 2はどういうものにあるのか いつ出てくるか
どのくらい使われてる？
Angular 2 - 機能Viewports New languages Web Components New template syntax Unidirectional data flow Ultra-fast change detection
Angular 2
生産性向上 パフォーマンス向上
パフォーマンス
https://angular.io/
https://angular.github.io/router/
vs React
ReactとAngular 2はゴールが一緒でアプローチが違うだけ AngularのチームとReactのチームはコミュニケーションをとっている
<ng-thanks>