Scribd
Upload
135 views4 pages

Angular 4 Intoduction

The Angular 4 training objectives are: to understand how Angular differs from traditional frameworks; code using ES6 and TypeScript; develop an application from scratch in Angular 4; and learn best practices for coding, architecture, forms, observables, dependency injection, routing, testing, and more. Prerequisites include substantial JavaScript experience. The training will cover all aspects of Angular 4 development over multiple days, including components, templates, modules, services, routing, testing, and deployment.

Uploaded by

VillageSchool Foundation
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
135 views4 pages

Angular 4 Intoduction

The Angular 4 training objectives are: to understand how Angular differs from traditional frameworks; code using ES6 and TypeScript; develop an application from scratch in Angular 4; and learn best practices for coding, architecture, forms, observables, dependency injection, routing, testing, and more. Prerequisites include substantial JavaScript experience. The training will cover all aspects of Angular 4 development over multiple days, including components, templates, modules, services, routing, testing, and deployment.

Uploaded by

VillageSchool Foundation
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

Angular 4 Training

ANGULAR 4 TRAINING OBJECTIVES

All students will learn to:

 Understand how Angular is different than traditional web development


frameworks
 Code using new ES6 and TypeScript language features
 Develop an application from scratch using Angular 4
 Explore Angular coding and architecture best practices
 Understand and use Angular Forms, Observables, Dependency Injection,
and Routing
 Retrieve, update, and delete data using Angular’s Http service
 Unit test all the parts of an Angular application including Modules,
Components, Services, and Pipes
 Upgrade an existing application from AngularJS to Angular 4 over time by
running both frameworks in the same project
 Create, build, and deploy an Angular (Angular 4) application using the
Angular CLI
 Develop dynamic Model-driven forms that are easier to unit test

ANGULAR 4 TRAINING PREREQUISITES

All attendees must have substantial prior experience developing with JavaScript. If
attendees will not have prior JavaScript experience, we would be delighted to
precede this class with a one- or two-day intensive JavaScript

SOFTWARE NEEDED FOR EACH PC:

 Google Chrome
 Other modern browsers as desired
 VS Code editor

ANGULAR 4 TRAINING OUTLINE

 Introduction
 Why Angular 4?
o User Experience similar to a Desktop Application
o Productivity and Tooling
o Performance
o Community
o Full-featured Framework
o Platform for Targeting Native Mobile not just Web Browsers
 Understanding Angular Versions
o AngularJS (Angular 1.x)
o Angular
 Angular 2
 Angular 4
 Understanding Angular 4
o Drop-in replacement for Angular 2
 Angular 4 Features
o View Engine generates smaller code
o Enhanced *ngIf syntax
o Animation code now in own packages
o TypeScript 2.1
o Improved compiler speed
o Angular Universal
 TypeScript and ECMAScript 6 (ES6) Fundamentals
o Classes
o ES Modules
o Arrow Functions
o Template Literals
o Scoping using Let and Const Keywords
o Spread Syntax and Rest Parameters
o Destructuring
o Decorators (JavaScript Aspect-Oriented Programming)
 Angular 4 Basics
o Components
o Templates
 Inline Templates
 Multi-line Templates using ES6 Template Literals
 External with Component-relative Paths
o Modules
o Models
 Template Syntax
o HTML in templates
o Interpolation
o Binding syntax
o Property binding
o Event binding
o Two-way data binding
o Attribute, class, and style bindings
o Built-in Directives
 Built-in attribute directives: NgClass, NgStyle, NgModel
 Built-in structural directives: NgIf (includes enhanced *ngIf
syntax in Angular 4), NgFor
o Template Input Variables
o The NgSwitch Directives
o Template Reference Variables
o Input and output properties
o Template Expression Operators
o Pipe ( | )
 Components
o Implementing the Component Lifecycle Hook OnInit
o Component Communication
 Input properties
 Output properties: Custom Events using EventEmitters
 Services and Dependency Injection
o Angular’s Dependency Injection System
o Registering
o Injecting
o Using a services to access data
o Using a service to encapsulate business logic
o Using a service to configure your application
o Using a service for logging
 Template-driven Forms
o NgSubmit Directive
o FormsModule
o NgForm, NgModel
 Validation
o Displaying validation messages
o Styling validation messages
 Communicating with the Server using the Http Service
o Deciding between Promises or Observables (RxJS)
o Making Http GET Requests
o Making Http POST and PUT Requests
o Issuing a Http DELETE Request
 Router
o Importing the RouterModule and Routes
o Configuring Routes
o Displaying Components using a RouterOutlet
o Navigating with RouterLink
o Accessing parameters
o Organizing your code into Modules
 Testing
o Tools: Jasmine, Karma
o Jasmine Syntax: describe, it, beforeEach, afterEach, matchers
o Setup and your First Test
 Model-driven Forms (Reactive Forms)
o ReactiveFormsModule
o AbstractControl, FormControl, FormGroup, and FormArray
o FormBuilder
o Validators
 Displaying Validation Messages
 Styling Validation Messages
 Attribute Directives
o Creating a custom Attribute Directive using ElementRef, Render
 Pipes
o Built-in Pipes: Using, Passing Parameters, Chaining
o Creating a custom Pipe using PipeTransform
o Understanding Pure and Impure Pipes
 Creating, Building, and Deploying an Angular Application
o Manually
o Using the Angular CLI with Ahead-Of-Time (AOT) Compilation and
Tree-Shaking (removing unused library code)
 Redux
o Redux Basics
o Debugging and Time Traveling with Redux DevTools

You might also like