På denna kurs lär du dig att bygga responsiva och företagsanpassade applikationer som körs smidigt på både stationära som mobila enheter. Ramverket Angular 2 erbjuder ett robust system som underlättar utvecklingen av mycket interaktiva applikationer, som kan köras på flera plattformar. Samla på dig erfarenhet genom att bygga komponenter, skapa direktiv element, forma applikationer och bygga mallbaserade former.

Utbildningsmål

Efter genomgången kurs ska deltagarna kunna:

• Create device-independent Angular 2 applications
• Develop Components using TypeScript, Templates, and Decorators
• Consume REST services using Observables
• Modularise applications with the Component Router
• Capture and validate input with template-driven forms

Detaljerat kursinnehåll

Angular 2 Introduction

Architectural overview

• Simplifying development of complex modern applications
• The organisation of an Angular 2 app
• Supporting multiple client devices
• Configuring an Angular 2 development environment
• Bootstrapping your first Angular 2 application

Getting started with TypeScript

• Transpiling TypeScript to JavaScript
• Building an app with TypeScript

Constructing User Interface (UI) Components

Defining components

• Structure of a component
• Introducing the component hierarchy and meta data
• Controlling HTML5 generation with Templates
• Displaying repeating data with *ngFor
• Conditional generation of DOM content

Debugging techniques and strategies

• Interpreting framework error messages
• Exploring the component hierarchy with Augury

Reducing code complexity with Dependency Injection (DI)

• Principles of DI
• Creating loosely coupled applications
• Configuring providers and declaring Injectables
• Specifying dependencies with Provider metadata

Testing Angular 2 Components & Functionality

Structuring test strategies

• Unit testing vs. integration testing
• Working with mock Angular components
• Asynchronous testing with ES6 arrow functions

Leveraging 3rd party tools

• Defining tests with Jasmine and Jasmine Spy
• Automating tests with Angular CLI and Karma
• Building and running a Protractor test

Adding Interactivity to Your Applications

Coordinating Component interaction

• Passing data from parent to child with Input bindings
• Listening for property changes with ngOnChanges
• Binding a model to display with interpolation

Managing events

• Detecting and responding to user interaction
• Capturing browser events
• Emitting custom events to trigger behaviour

Navigation and Data Transformation

Creating modular applications

• Controlling application flow with the Component Router
• Dividing application functionality across multiple Component trees

Manipulating data with Pipes

• Formatting dates for display
• Internationalising your apps
• Filtering data with custom Pipes

Building Interactive Forms

Displaying and capturing data

• Developing forms with ngFormModel and FormBuilder
• Creating a form from a business object
• Two-way binding between input controls and data model

Validating form input

• Leveraging HTML5 and custom validation
• Providing user feedback from validators

Managing Asynchronous Behaviour

Keeping the App responsive

• Subscribing to Observables
• Optimising ngZone change detection with immutability and onPush

Interacting with a REST Web service

• Retrieving and sending data asynchronously
• Invoking different HTTP methods
• Working with the XHR object directly

Extending Angular 2 Capabilities

Migrating from AngularJS 1 to Angular 2

• Bridging between AngularJS 1 and Angular 2
• Transcluding Angular 2 components into an AngularJS 1 application

Augmenting Angular 2

• Adding functionality to the DOM
• Incorporating a file upload directive
• Performing animation
• Creating native mobile apps with NativeScript