Scaling applications using AngularJS and TypeScript - Simona Cotin - Codemotion Milan 2016

Angular 2

@SIMONA_COTIN

Components - base

Components - Input/Output properties

Components - providers

Components - template

Components - lifecycle

Components - self describing

A COMPONENT HAS WELL DEFINED API FOR INPUT AND OUTPUT PROPERTIES


A COMPONENT CONFIGURES DEPENDENCY INJECTION


A COMPONENT KNOWS HOW TO RENDER ITSELF


A COMPONENT KNOWS HOW TO LISTEN TO ITS HOST ELEMENT

Change detection

“An Angular 2 application is a reactive system, with change detection being the core of it.”

Change detection

Change detectionAn angular app is a

component tree

Each component has its own change detector

Data flows from top to bottom

Ahead-of-time compilation

FASTER INITIAL RENDER

TYPE CHECKING IN TEMPLATES

EFFECTIVE TREE SHAKING

TOOLS & HELPERS - ANGULAR MATERIAL

TOOLS & HELPERS - I18N

TOOLS & HELPERS - ROUTER

TOOLS & HELPERS - ANIMATIONS

TOOLS & HELPERS - ANGULAR CLI

TOOLS & HELPERS - PROTRACTOR

TOOLS & HELPERS - ANGULAR AUGURY

TOOLS & HELPERS - LANGUAGE SERVICES

THANK YOU

Technology