Course Code: angularjsintro
Duration: 35 hours
Prerequisites:

Overview:

This Nobleprog training teaches Angular 9 and the way to create and test web applications with it. 
People attending this training had experimented with the ability to prepare the Angular 9 environment ready for a full-fledged application.
Using data bindings, directives, components, and pipes the delegates learned and used the building blocks of Angular 9. Together with the value of services and providers, they acquired the usage of dependency injection. They learned the Reactive Extensions to build loosely coupled components and the way to fill the model with real data through HTTP requests and based on user interaction to use the routing capabilities of Angular.

The trainer has several years of experience related to front-end applications, enterprise-level applications and UI components in several languages and web technologies. He daily uses cutting-edge libraries and frameworks through development, code review on Angular, React, Javascript ES6, Typescript, Redux, and other web technologies.

Course Outline:

JavaScript programming language

Duration: 1 day

Module 1. Introduction to JavaScript

  • What is JavaScript?
  • Supported data types
  • Control flow
  • Error handling

Module 2. Functions

  • Defining and calling functions
  • Function scope
  • Understanding closures
  • Function parameters
  • Declaring arrow functions
  • Using predefined functions

Module 3. Working with objects

  • Objects overview
  • Objects and properties
  • Properties enumeration
  • Creating object using initializer
  • Creating object using constructor function
  • Creating object using Object.create
  • Inheritance

Module 4. Destructuring for easier data access

  • Why Is Destructuring Useful?
  • Object destructuring
  • Array destructuring
  • Destructured Parameters

Module 5. Using Built-in objects

  • Some of the built-in objects in JavaScript
  • Array and ArrayBuffer objects
  • JavaScript typed arrays
  • JSON object
  • RegExp object
  • WeakMap/WeakSet/WeakRef objects

Module 6. Iterators and Generators

  • Using iterators
  • Implementing generator functions
  • The iterables
  • User-defined iterables
  • Built-in iterables

Module 7. Using Promises and Asynchronous programming

  • Promises versus callback
  • Understanding promise chaining
  • Error propagation
  • Managing the rejection events

Module 8. Working with classes

  • Constructors
  • Encapsulation using visibilities
  • Implementing inheritance
  • Static versus instance

Module 9. Memory Management

  • JavaScript memory life cycle
  • Release when the memory is not needed anymore
  • Garbage collection
  • Reference-counting garbage collection
  • Mark-and-sweep algorithm 

Angular development

Duration: 4 days

Module 1. Understanding Angular Projects and Tools

  • Creating a New Angular Project
  • Understanding the Project Structure
  • Using the Development Tools
  • Understanding How an Angular Application Works
  • Understanding the Production Build Process

Module 2. Using Data Bindings

  • Understanding One-Way Data Bindings
  • Understanding Property Bindings
  • Using the Standard Property and Attribute Bindings
  • Setting Classes and Styles
  • Updating the Data in the Application

Module 3. Using the Built-in Directives

  • Using the Built-in Directives
  • Using the ngIf Directive
  • Using the ngSwitch Directive
  • Using the ngFor Directive
  • Minimizing Element Operations
  • Understanding One-Way Data Binding Restrictions

Module 4. Using Events and Forms

  • Using the Event Binding
  • Using Event Data
  • Using Template Reference Variables
  • Using Two-Way Data Bindings
  • Using the ngModel Directive
  • Working with Forms
  • Adding Form Data Validation
  • Styling Elements Using Validation Classes
  • Displaying Field-Level Validation Messages
  • Using Model-Based Forms
  • Creating Custom Form Validators

Module 5. Creating Attribute Directives

  • Creating a Simple Attribute Directive
  • Applying a Custom Directive
  • Accessing Application Data in a Directive
  • Creating Data-Bound Input Properties
  • Creating Custom Events
  • Binding to a Custom Event
  • Exporting a Directive for Use in a Template Variable

Module 6. Creating Structural Directives

  • Creating a Simple Structural Directive
  • Implementing the Structural Directive Class
  • Using the Concise Structural Directive Syntax
  • Creating Iterating Structural Directives
  • Dealing with Property-Level Data Changes
  • Dealing with Collection-Level Data Changes

Module 7. Understanding Components

  • Structuring an Application with Components
  • Creating New Components
  • Defining Templates
  • Using Data Bindings in Component Templates
  • Using Input Properties to Coordinate Between Components
  • Using Output Properties to Coordinate Between Components
  • Using Component Styles
  • Defining External Component Styles

Module 8. Using and Creating Pipes

  • Understanding Pipes
  • Creating a Custom Pipe
  • Registering a Custom Pipe
  • Applying a Custom Pipe
  • Combining Pipes
  • Creating Impure Pipes
  • Using the Built-in Pipes

Module 9. Using Services

  • Understanding the Object Distribution Problem
  • Distributing Objects as Services Using Dependency Injection
  • Preparing the Service
  • Preparing the Dependent Components
  • Registering the Service
  • Reviewing the Dependency Injection Changes
  • Declaring a Dependency in a Pipe
  • Declaring Dependencies in Directives
  • Understanding the Test Isolation Problem

Module 10. Using Service Providers

  • Using Service Providers
  • Using the Class Provider
  • Understanding the Token
  • Using Opaque Tokens
  • Understanding the useClass Property
  • Using the Value Provider
  • Using the Factory Provider
  • Using the Existing Service Provider
  • Using Local Providers

Module 11. Using Reactive Extensions

  • Understanding the Problem
  • Understanding Observables
  • Understanding Observers
  • Understanding Subjects
  • Using the Async Pipe
  • Filtering Events
  • Transforming Events
  • Using Different Event Objects
  • Receiving Only Distinct Events
  • Taking and Skipping Events

Module 12. Making HTTP Requests

  • Understanding RESTful Web Services
  • Replacing the Static Data Source
  • Setting Up the HTTP Request
  • Processing the Response
  • Saving and Deleting Data
  • Consolidating HTTP Requests
  • Making Cross-Origin Requests
  • Handling Errors

Module 13. Routing and Navigation

  • Creating a Routing Configuration
  • Creating the Routing Component
  • Adding Navigation Links
  • Understanding the Effect of Routing
  • Handling Route Changes in Components
  • Using Route Parameters
  • Using Multiple Route Parameters
  • Navigating in Code
  • Receiving Navigation Events

Module 14. Angular Unit Testing

  • Running a Unit Test
  • Working with Jasmine
  • Testing an Angular Component
  • Working with the TestBed Class
  • Configuring the Test Bed for Dependencies
  • Testing Data Bindings
  • Testing a Component with an External Template
  • Testing Component Events
  • Testing Output Properties
  • Testing Input Properties
  • Testing with Asynchronous Operations
  • Testing an Angular Directive