Banner rating d5dfd02e10e7bea369b370d45102dadcf6d70e41b6bfce1ee178127969f7852a
Dynamics Edge
4.67 out of 50 stars, based on 80 reviews*

Save money and get your team trained. With a group of 5 or more people, you have special options. Click the button below to request a special quote for your team now!

Request Group Quote

Register

Price: $2500   Duration: 3 days
- EST

Course 70012

Price: $2500, Length: 3 days

70012 Angular Advanced Course

To customize this class, call 800-453-5961 or click here to contact us

Note: For additional questions and clarification, you may reach Bill Ramirez at bill@dynamicsedge.com or on his following contact details: Office- (510) 804-3600 & Cell- (415) 200-6969

COURSE OVERVIEW:

During these 3 days, all lab exercises are designed to make attendees build an entire web application step by step so that they can practice and understand how these Angular concepts come into play in an actual real-life project.

 PREREQUISITES:

  • Full understanding and practical use of Angular.

AGENDA TOPICS:

Angular Essentials

  • Semantic versioning and release schedule
  • Angular CLI
  • Environments config
  • CLI: ng update, ng add and schematics

LAB: Set-up

Modules and build process

  • Modules and ngModule
  • Module architecture: Feature modules
  • Module architecture: Shared module
  • Angular builds: AOT vs JIT - What to use for production
  • Build modes and environments

LAB: Angular Builds

  • Introduction to Webpack
  • Should we use Webpack directly for custom builds?

Components

  • Template and expressions
  • Passing data to a component with @Input()
  • Practicing with Angular CLI

LAB: Creating components

  • Component architecture best practices
  • Advanced component features

Directives

  • Different kinds of directives
  • How to create a custom directive?
  • Data bindings in directives

LAB: Custom directive

Pipes

  • Pure and Impure pipes
  • How to create our own pipes?

LAB: Custom Pipe

Services and dependency injection

  • Purpose of services
  • Dependency injection in Angular
  • Injector Tree
  • Decorators for dependency injection: @Optional(), @Host(), @Self()
  • How to create a service?

LAB: Service creation

HTTP client and asynchronous patterns with RxJs

  • How to use the HTTP client?
  • What is a promise?
  • Introduction to RxJS
  • What is an observable?

LAB: Observables and Promises

  • Writing our own Observable or Promise
  • RxJs operators
  • Examples of RxJs operators: max, merge, filter

LAB: Using the HTTP client

  • Async pipe

LAB: Using the async pipe

  • Http Interceptor
  • Websockets in Angular

Component communication and lifecycle

  • How do components share data?
  • Strategies for component communication
  • @ViewChild() decorator

LAB: Component communication

LAB: Using @Output()

  • Introduction to the component lifecycle
  • Lifecycle hooks
  • Change detection strategies for performance optimization

End-to-end Testing of Angular Applications

  • How to test Angular applications?
  • End to end tests with Protractor
  • End to end tests with Cypress

LAB: Writing end-to-end tests

  • Mocking and stubbing with Cypress and Data Mocks

Security in Angular

  • How to prevent Cross-site Scripting attacks (XSS)
  • Best practices and things to avoid
  • Trusting values with the DOMSanitizer
  • Prevent HTTP attacks
  • Security audits of Angular applications

State management and Redux

  • What is state management?
  • Redux: Core concepts and principles
  • Redux Store
  • NgRx: Redux for Angular
  • NgRx: Reducer, Store, Actions and Effects

LAB: Using NgRx store and actions

Advanced exercises on RxJs and component architecture

  • How to think in terms of reactive programming
  • Examples of several combinations of RxJs operators

Resources and best practices

  • How to include external libraries
  • How to use angular.io (cheatsheet, etc.)
  • Style guide and best practices
  • Official Angular blog

We look forward to your great success!!!

*NOTE: if an average rating and rating count are shown on this page, they are based on all reviews associated with Dynamics Edge that are shown on the review page, and are not restricted to reviews only for the particular course offered on this page.


7001270012 Angular Advanced Course