Download as PDF, PPTX
Uploaded byFITC
Getting Started with Angular 2
The document provides an overview of Angular 2, highlighting its foundational technologies such as ES6, TypeScript, and Observables. It mentions various resources for learning Angular 2, including examples and documentation, and contrasts the practices in Angular 1.x with those in Angular 2. Key topics covered include template syntax, components, and shadow DOM strategies.
Getting Started with Angular 2
- 1. Getting Started with Angular2 Slides: tinyurl.com/ng2-slides
- 3.
- 4.
- 5. might seem liketoo much to learn
- 6. Angular 2 isBased on: ○ ES6/TypeScript ○ Module Loaders ○ DOM ○ Web Components ○ Observables ○ ZoneJS ○ AngularJS 1.x
- 7.
- 8. Angular 2 Resources ●Example: Quickstart ● Example: Hello World - Plunker ● Example: angular-2-samples ● Example: ng2-movies ● Docs: API Reference ● Docs: Changelog ● Docs: Milestones ● Docs: Weekly Meeting Notes ● Blog: Thoughtram ● Blog: Victor Savkin
- 10. Template Syntax /DOM ● No more jqLite ● No more ng-click, ng-mousedown, ng-blur, etc. ● No more ng-show, ng-hide, ng-disabled, etc. ● Relies directly on the DOM
- 11. ES6/TypeScript - Resources ●ES6 Feature overview ● Egghead ES6 videos ● Thoughtram - dependency-injection-in-angular-2 ● TypeScript Deep Dive ● Victor Savkin - writing-angular-2-in-typescript ● TypeScript Tutorial
- 12. Components Angular 1.x: http://plnkr.co/edit/fZKUdNpN3k2joBVrXz5r?p=preview Angular2.0: http://plnkr.co/edit/GA57df9esLI7MyPbyXjb?p=preview
- 13. AngularJS 1.x Component:Best Practices
- 14. Angular 1 to2: Component
- 15. Angular 1 ComponentsBest Practices Avoid ● $scope ● $scope ● $scope ● The link function ● $parse, $observe, $eval Use ● Isolated Scope ● ControllerAs ● BindToController ● ES6 classes
- 16. Shadow DOM -Resources ● ng-conf: Creating Container Components ● Thoughtram - styling-angular-2-components ● Thoughtram - shadow-dom-strategies-in-angular2 ● webcomponents.org - introduction-to-shadow-dom ● html5rocks - Shadowdom Tutorial
- 17.
- 18. Observables ● The introductionto Reactive Programming you've been missing ● Sample App - angular2-rxjs-chat ● Egghead videos - RxJS
- 19. Angular AMA 3:45 -4:30pm B-SIDE ROOM Aysegul Yonet Nick Van Weerdenburg Rob McDiarmid
- 20.