Robin Böhm - Angular 2 - code.talks 2015

Preview:

Citation preview

@RobinBoehm

symetics

Angular 2Robin BöhmCodeTalks, Hamburg, 29.09.2015

symetics

@RobinBoehm

About Us

Robin Böhm● robin.boehm@angularjs.de● @RobinBoehm● Co-founder of http://angularjs.de (Symetics)

● Web development: 10+ years● PHP -> Java -> JavaScript● Trainer & Coach: 4 years

@RobinBoehm

About Us

AngularJSEine praktische Einführungin das JavaScript-Framework

● First German AngularJS book

● dpunkt.verlag● April 2014● ca. 360 pages

http://dpunkt.de/buecher/4489/angularjs.html

@RobinBoehm

About Us

AngularJS CookbookAngularJS Cookbook70 Recipes for AngularJS 1.2

● Free ca. 160 pages● English ● Self Published (Leanpub)● Feb. 2014

https://leanpub.com/angularjs-cookbook

@RobinBoehm

About Us

AngularJS.DE● Promoting AngularJS in

Germany

● Developer network

● Trainings and workshops

● Open source book

● Articles and blog posts

@RobinBoehm

Symetics GmbH

The business backing AngularJS.DE

symetics

@RobinBoehm

OU

R L

OVE

OU

R B

USI

NES

S symetics training

ANGULARJS.DE

In-house WorkshopsOpen Workshops

symeticsC

OR

E

PRODUCT DEVELOPMENT

Webinars

@RobinBoehm symetics

ANGULARJS 2

@RobinBoehm symetics

The year AngularJS was born

2009

@RobinBoehm symetics

The year AngularJS was born

20096 Years Ago

@RobinBoehm symetics

The year AngularJS was born

@RobinBoehm symetics

The year AngularJS was born

@RobinBoehm symetics

The year AngularJS was born

@RobinBoehm symetics

The year AngularJS was born

@RobinBoehm symetics

The year AngularJS was born

@RobinBoehm symetics

@RobinBoehm symetics

@RobinBoehm symetics

The year Angular 2 is born

2015

@RobinBoehm symetics

M o b i l e F i r s t

@RobinBoehm symetics

Web Components

@RobinBoehm symetics

New Language

@RobinBoehm symetics

The Others???

@RobinBoehm symetics

Facebook, Microsoft, Ember Team

@RobinBoehm symetics

Migration

Migration?

@RobinBoehm symetics

Migration

@RobinBoehm symetics

Migration

1.5

1.6

2.0

@RobinBoehm symetics

Migration - Prepare your AJS 1 App

@RobinBoehm symetics

Migration - Prepare your AJS 1 App

@RobinBoehm symetics

Migration - Prepare your AJS 1 App

@RobinBoehm symetics

Migration - Prepare your AJS 1 App

@RobinBoehm symetics

Migration - Prepare your AJS 1 App

@RobinBoehm symetics

Migration

@RobinBoehm symetics

Migration!

@RobinBoehm symetics

Alpha2.0.0-alpha.37

@RobinBoehm symetics

@RobinBoehm symetics

@RobinBoehm symetics

New Website

@RobinBoehm symetics

Reduce

35 Directives in AngularJS

Now only 4 concepts

@RobinBoehm symetics

Events in Angular 2

<button class="changeButton" (click)="changeGreeting()">change greeting

</button>

@RobinBoehm symetics

Local Vars in Angular 2

DOMElement is available at the local scope

<input #inputField (keyup)></input>

{{inputField.value}}

@RobinBoehm symetics

Property-Binding in Angular 2

<input class="inputButton" [value]="ComponentVariable"/>

Property-Binding != Attribute Binding

@RobinBoehm symetics

Property-Binding in Angular 2

Generic Binding to the element

@RobinBoehm symetics

Property-Binding in Angular 2

Generic Binding to the element

Works with:- Custom Elements- Web Components- Polymer- ...

-

@RobinBoehm symetics

Expressions

<div class="greeting">{{greeting}}</div>

@RobinBoehm symetics

@Annotations

@RobinBoehm symetics

Annotations

@RobinBoehm symetics

Services & Dependency Injection

@RobinBoehm symetics

Services & Dependency Injection

@RobinBoehm symetics

Services & Dependency Injection

Services are just simple classes! Nothing to do more!

@RobinBoehm symetics

Release?

@RobinBoehm symetics

Conclusion

@RobinBoehm symetics

Thanks!

● Q/A

● Robin Böhm● robin.boehm@angularjs.de● @RobinBoehm

symetics

Recommended