Tweet
Tweet

Slide 1

Slide 1 text

Todo App Angular 2 Andres Osorio @codeandrop

Slide 2

Slide 2 text

Agenda ● Angular 1 ● Angular 2 ● Angular 1 and ES6 ● Demo time!

Slide 3

Slide 3 text

Angular 1 ● The code base for Angular dates back to 2009 ● Angular2 is 5x faster than Angular 1* ● Angular 1.x has many concepts ● Concepts have a learning curve

Slide 4

Slide 4 text

Angular 1 Concepts ● Controller ● Factory ● Service ● Provider ● Directive ● Transclusion ● Module

Slide 5

Slide 5 text

Angular 2 ● Work in progress ● ES5, ES6, Dart or Typescript ● Everything is a component ● Components: Break UI into reusable pieces ● Tree of components ● Possible migration from Angular 1.5.x

Slide 6

Slide 6 text

Angular 2 - Component Syntax

Slide 7

Slide 7 text

Angular 2 - Component Syntax Annotation Controller

Slide 8

Slide 8 text

Angular 2 - Controller

Slide 9

Slide 9 text

Angular 2 - Template Syntax ● Local Variables - #localvar ● Event Handlers - (click) ● Property Bindings - [innerText]

Slide 10

Slide 10 text

Angular 2 - Template Syntax

Slide 11

Slide 11 text

Angular 1 and ES6 http://www.michaelbromley.co.uk/blog/350/exploring-es6-classes-in-angularjs-1-x https://github.com/Swiip/generator-gulp-angular

Slide 12

Slide 12 text

Demo time!

Slide 13

Slide 13 text

THE END