Angular 2

Víťa Plšek@VitaPlsek

Java / Javascriptwww.angular.cz

vlastní kompozice knihoven framework

Kudy do světa frontendu ?

?

Stack Overflow - Developer Survey 2016MOST POPULAR TECHNOLOGIES

Angular přerostl své odvětví

Angular 1.x

● od roku 2009● naučil lidi psát SPA● velká komunita● oblíbený v enterprise

Source: State of Octoverse 2016

⚠ dirty checking⚠ lazy loading⚠ renderování na serveru

Angular 2 - nový začátek

● 22. září 2014 - první zmínka● 30. dubna 2015 - preview● 15. prosince 2015 - beta ● 4. května 2016 - rc● 14. září 2016 - finální

Angular 2 chce být komplexní platformou

Lepší podpora IDE

class HeroDetailComponent implements OnInit { hero: Hero; onUpdate = new EventEmitter<Hero>();

constructor(private heroService: HeroService) {}

update(): void { this.heroService.saveHero(this.hero) .then(hero => this.onUpdate.emit(hero)); }); }

...}

@Component({ selector: 'hero-detail', templateUrl: './hero-detail.component.html', styleUrls: ['./hero-detail.component.css'], providers: [HeroService]})class HeroDetailComponent implements OnInit { hero: Hero; onUpdate = new EventEmitter<Hero>();

constructor(private heroService: HeroService) {}

update(): void { this.heroService.saveHero(this.hero) .then(hero => this.onUpdate.emit(hero)); }); }

...}

@Component({ selector: 'hero-detail', templateUrl: './hero-detail.component.html', styleUrls: ['./hero-detail.component.css'], providers: [HeroService]})class HeroDetailComponent implements OnInit { @Input() hero: Hero; @Output() onUpdate = new EventEmitter<Hero>();

constructor(private heroService: HeroService) {}

update(): void { this.heroService.saveHero(this.hero) .then(hero => this.onUpdate.emit(hero)); }); }

...}

ElementElement

RouterComponent

NgModule

Lazy LoadingNgModule

ElementElement

Component

Platform

Angular Universal

Angular CLI (Command Line Interface)

Komplexnívývojový devstack

** Použitím technologie v ranné fázi akceptujete, že knihovny, nástroje a doporučené postupy nemusí být ve stavu, který očekáváte.

Psát dnes nové aplikace v Angular 2 ?

Co se stávajícími systémy ?

Vyzkoušejte tutorialTour of Heroes na angular.io

Jak začít ?

… díky za pozornost

angular.cz/jopenspace-2016