ANGULAR 2.0A BEGINNER'S GUIDE

Kevin Hennessy

Applied Information Sciences

@kevinmhennessy

https://github.com/kevinhennessy/AllThingsOpen

AGENDAWhy a new version of AngularAngular 2.0 DesignBrowser SupportWeb Components, ES6 and TypeScriptDemos!What's Next

WHY A NEW VERSION OF ANGULAR?The Web has changed in six years!ES6 will transform JavaScript programmingWeb Components are on their wayAngular will need a new implementation of databindingAngular not designed for mobile appsPerformance issues, inability to cache pre-compiled views,lackluster touch supportAngular needs to be easier to learn!

  Source: http://eisenbergeffect.bluespire.com/all-about-angular-2-0/

ANGULAR 2.0 DESIGNModular, mobile-first design that also scales for the desktopSupport for Web Components out of the boxBuilt using Typescript, with easy transpilation to ES5Can also use ES6 and ES5New databinding implementation improves performanceWon't rely on jQLite or DOM wrappers in generalDDO, $scope, Controllers, angular.modules all go awayWill be easier to learn!

  Source: http://angularjs.blogspot.com/2014/10/ng-europe-angular-13-and-beyond.html

BROWSER SUPPORTWill support modern browsers that auto-update - Chrome,FireFox, Opera, Safari and IE11.Recently announced support for IE 9 and 10.On mobile, Chrome on Android, iOS 7+, Windows Phone 8+and Firefox Mobile.Support for older versions of Android going back to 4.1.

WEB COMPONENTSUmbrella term for four different W3C specs:

Custom ElementsHTML TemplatesShadow DOMHTML Imports

Provides composability, encapsulation, and reusability.

ECMA SCRIPT 6New version of JavaScript adopted in JulyProvides:

ClassesModule SystemAnd much more

Can still use ES5 with Angular 2.0

TYPESCRIPTProvides Static Typing for JavaScriptMicrosoft/Google collaboration

Decorators added by MSAngular 2.0 built with TypeScript

Use of TypeScript is optional

DEMOS

WHAT'S NEXTFinish Core, API Sugaring, Perf+, DocsMigration Support, Animate, Material Design, CLIServer Render, Native, Web WorkersAngular Ships When?

ANGULAR 2: WHAT HAVE WE LEARNED?Mobile first designEvergreen browsersBuilt on Emerging StandardsImproved PerformanceEasy to LearnUses TypeScript

RESOURCESThe source: The website for Angular 2.0: Today's Demos:

https://github.com/angular/angularhttps://angular.io/

https://github.com/kevinhennessy/AllThingsOpen