![Find a Seminar on TrainingAndSeminars.com](/images/training__seminars-17.gif)
Developing Web Applications Using Angular Hands-On Technology Transfer
Delivery Method
![Seminar](/images/dm_seminar.gif) Seminar
Target Audience Beginner to Intermediate Angular programmers
Summary This hands on programming course provides a thorough introduction to the Angular JavaScript Framework including coverage of versions 2 through 5
Description/Agenda Students Will Learn
- Using TypeScript and ECMAScript 6 to create components
- Using directives and components to define UI elements, routes
and screens
- Working effectively with component lifecycle events
- Injecting dependencies to lessen coupling and increase
testability
- Unit testing Angular applications with Karma and Jasmine
- Using property binding to link DOM elements with model data
- Building Single Page Applications using Angular
- Integrating forms with Angular
- Organizing code using modules
- Communicating with RESTful Web services
Course Description
This course introduces Angular versions 2 through 5. Students
interested in Angular 1.x should take the Developing Web
Applications Using AngularJS course instead.
This hands on programming course provides a thorough introduction
to the Angular JavaScript Framework including coverage of versions
2 through 5. Attendees will learn the fundamental skills necessary
to build Web Applications using Angular and the MVVM
(Model-View-ViewModel) design pattern. Topics include using
TypeScript and ECMAScript 6 to create components, using directives
and components to define UI elements, routes and screens, applying
dependency injection, designing views/templates, routing, data
binding and pipes, applying directives, as well as form
integration and validation. Students will also use the Angular
services to communicate with RESTful web services and provide CRUD
database operations.
Comprehensive hands on exercises are integrated throughout to
reinforce learning and develop real competency.
Course Prerequisites
Knowledge of HTML, CSS and JavaScript equivalent to attending
the Website Development with HTML5, CSS and
Bootstrap and JavaScript Programming courses.
Knowledge of jQuery is helpful, but not required.
Course Overview
Overview of Angular and the MVVM Design Pattern
- Features and Benefits of Angular
- Angular Architecture
- MVVM Design Pattern Overview
- Downloading Angular
- Referencing Angular Using a CDN
- Choosing an IDE
- Creating a Simple Application with Angular
|
Working with TypeScript
- TypeScript vs ECMAScript 6
- TypeScript Basics
- Types
- Working with Built-In Types
- Custom Types
- Utilities
- Using Fat Arrow Syntax
- Template Strings
- Setting Up and Using Node.js
- Transpiling TypeScript into JavaScript
- TypeScript Compiler Configuration
- TypeScript Declaration Files
- Installing Typings Files
|
Angular Modules
- Using Modules to Create an Application
- Default Modules
- Exporting Classes, Functions and Values
- Limiting Scope
- Grouping Modules
- Specifying Module Dependencies
- Organizing Code Files
- Module Testing
- Best Practices
|
Angular Components
- Component LifeCycle
- Component Templates to Define Views
- Using Decorators to Define MetaData
- Component Styles
- Encapsulation
- ShadowDOM Style Encapsulation
- View Style Encapsulation
- No Encapsulation
- ElementRef and Popups
- ExportAs
- Lifecycle Hooks
- OnInit, OnDestroy, OnChanges, DoCheck
- AfterContentInit, AfterViewInit
- AfterContentChecked, AfterViewChecked
- Change Detection
- Basic Data Binding
- One-Way Binding
- Two-Way Binding
- Directives
|
Using Built-In Directives and Filters
- Overview of Angular Built-In Directives
- NgIf, NgFor, NgClass, NgStyle, NgSwitch,
etc.
- Building Custom Directives
- Overview of Angular Built-In Filters
- Currency, Date, Json, LimitTo, Number,
etc.
- Building Custom Filters
|
Working with Pipes
- Built-In Pipes
- Custom Pipes
- Adding and Using Parameters
- Using a Pipe in a Component
- Data Pipes
|
Defining and Consuming Services
- Dependency Injection
- Registering Providers with the Injector
- Creating a Service
- Consuming a Service
- Mocking a Service
- Working with Async Services and Promises
|
The Angular Animation System
- The Web Animations API
- States and Transitions
- Entering and Leaving
- Animating Properties
- KeyFrames
- Parallel Animation Groups
|
The HTTP Library
- Callbacks, Promises and Observables
- Importing the HTTP Module
- Creating Requests
- Processing Responses
- Web API
- Interacting with a RESTFul Service
- POST Requests
- DELETE Requests
- PUT Requests
- HEAD Requests
|
Angular Routing and Navigation
- Overview of Routing
- Client-Side vs Server-Side Routing
- Working with the Component Router
- Adding Router Imports
- Performing Router Configuration
- Using Router State
- Redirects
- Location Strategies
- Routing Parameters
- Router Lifecycle Events
- Nesting Routes
|
Data Binding and Programming Models
- Interpolation
- One-Way (Unidirectional) Binding
- Two-Way Binding
- Event Binding
- Observables vs. Promises
- Working with Observables
- Dealing with Out of Order Responses
- Altering Observables with Reactive Extensions (Rx)
- Reactive Programming Model
- Organizing Code Using Domain Models
|
Building and Deploying Applications
- Developing a Deployment Strategy
- Picking a Package Manager
- Using a Module Loader
- Angular CLI
- Using Gulp for More Complex Builds
- Managing Dependencies
- Using Sourcemaps
- Including Static Libraries and Files
- Transpiling
- Linting
- Handling Static Files
- Dealing with Internationalization Issues
|
Bootstrapping
- Using Modules to Create an Application
- Bootstrapping and Application with Dependencies
- Exporting Classes, Functions and Values
- Best Practices
|
Forms
- Template Driven Forms
- Input and Output Properies
- Property and Event Binding
- Interpolation
- Form Components
- Using Control and ControlGroup
- Using the FormBuilder Factory
- Form State
- Form Validation
- NgModel and NgForm Directives
- Model Driven Forms
- FormGroup and FormControl Classes
|
Creating Single Page Applications (SPAs)
- SPA Characteristics and Advantages
- SPA Potential Drawbacks
- Structuring Templates in an SPA
- Security Challenges and Approaches for Angular SPAs
- When Not to Use SPA Architecture
|
Unit Testing and TDD with Angular
- TDD vs End-to-End Testing
- Jasmine Testing Framework
- Running Tests in Karma
- Using the Angular Unit Test Framework
- Fulfilling Dependencies
- Mocking Out Data
- Creating"
|
|
Frequently Asked
Questions
Payment Options
Bill Me/Invoice
Credit Card
Register
Online
Fax Form
Availability
Seats currently available. Book now before the class is full.
Other Information
Seminar |
|