Course #:WA3009 Introduction to Angular 10 Programming Training Download Sample Labs 10/25/2021 - 10/27/2021 USD$1,995.00 Instructor Led Virtual 12/06/2021 - 12/08/2021 USD$1,995.00 Instructor Led Virtual 01/24/2022 - 01/26/2022 USD$1,995.00 Instructor Led Virtual Courseware: Available for sale The Introduction to Angular 10 Programming Training course offered by Web Age Solutions covers all the essential topics and is designed to get students up and running with Angular 10 development in the shortest amount of time. Developers and Application Designers as well as those who are tasked with supporting Angular 10 applications will gain valuable knowledge required for success in their job roles while taking this course. Angular 10 is a JavaScript framework that supports the development of single-page applications that run in browsers and can also be used to develop responsive web sites and hybrid mobile applications. The Angular 10 Training course includes labs for each major topic that allow you to get hands-on experience programming and troubleshooting Angular 10 code. Objectives Develop single page Angular applications using Typescript Set up a complete Angular development environment Create Components Component Templates Inter Component Communication Template Driven Forms Reactive Forms Services and Dependency Injection HTTP Client Pipes and Data Formatting Introduction to Single Page Applications The Angular Component Router Prerequisites Web development experience using HTML, CSS and JavaScript is required to get the most out of this Angular 10 course. Knowledge of the browser DOM is also useful. Prior Angular experience, with AngularJS or the current version of Angular, is not required. We offer a 1-2 day subset of our Introduction to JavaScript course to meet this pre-requisite if needed. Please ask your salesperson for details. Duration 3 Days Outline of Introduction to Angular 10 Programming Training Chapter 1. Introducing Angular What is Angular? Central Features of the Angular Framework Appropriate Use Cases Building Blocks of an Angular Application Basic Architecture of an Angular Application Installing and Using Angular Anatomy of an Angular Application Running the Application Building and Deploying the Application Summary Chapter 2. Introduction to TypeScript Programming Languages for Use with Angular TypeScript Syntax Programming Editors The Type System – Defining Variables The Type System – Defining Arrays Type in Functions Type Inference Defining Classes Class Methods Class Constructors Class Constructors – Alternate Form Interfaces Working with ES6 Modules Visibility Control var vs let Arrow Functions Arrow Function Compact Syntax Arrow Function and Caller Context Template Strings Generics in Class Generics in Function Generics - Restricting Types TypeScript Transpilation Summary Chapter 3. Components What is a Component? An Example Component Creating a Component Using Angular CLI The Component Class The @Component Decorator Registering a Component to Its Module Component Template Example: HelloComponent Template Example: The HelloComponent Class Using a Component Run the Application Component Hierarchy The Application Root Component The Bootstrap File Component Lifecycle Hooks Example Lifecycle Hooks CSS Styles Summary Chapter 4. Component Templates Templates Template Location The Mustache {{ }} Syntax Setting DOM Element Properties Setting Element Body Text Event Binding Expression Event Handler Prevent Default Handling Attribute Directives Apply Styles by Changing CSS Classes Example: ngClass Applying Styles Directly Structural Directives Conditionally Execute Template Example: ngIf Looping Using ngFor ngFor Local Variables Manipulating the Collection Example - Deleting an Item Item Tracking with ngFor Swapping Elements with ngSwitch Grouping Elements Template Reference Variable Summary Chapter 5. Inter Component Communication Communication Basics The Data Flow Architecture Preparing the Child to Receive Data Send Data from Parent More About Setting Properties Firing Event from a Component @Output() Example - Child Component @Output() Example - Parent Component Full Two Way Binding Setting up Two Way Data Binding in Parent Summary Chapter 6. Template Driven Forms Template Driven Forms Importing Forms Module Basic Approach Setting Up a Form Getting User Input Omitting ngForm Attribute Initialize the Form Two Way Data Binding Form Validation Angular Validators Displaying Validation State Using Classes Additional Input Types Checkboxes Select (Drop Down) Fields Rendering Options for Select (Drop Down) Date fields Radio Buttons Summary Chapter 7. Reactive Forms Reactive Forms Overview The Building Blocks Import ReactiveFormsModule Construct a Form Design the Template Getting Input Values Initializing the Input Fields Setting Form Values Subscribing to Input Changes Validation Built-In Validators Showing Validation Error Custom Validator Using a Custom Validator Supplying Configuration to Custom Validator Sub FormGroups - Component Class Sub FormGroups - HTML Template Why Use Sub FormGroups Summary Chapter 8. Services and Dependency Injection What is a Service? Creating a Basic Service The Service Class What is Dependency Injection? Injecting a Service Instance Injectors Injector Hierarchy The Root Injector Registering a Service with a Component's Injector Where to Register a Service? Dependency Injection in Other Artifacts Providing an Alternate Implementation Dependency Injection and @Host Dependency Injection and @Optional Summary Chapter 9. HTTP Client The Angular HTTP Client Using The HTTP Client - Overview Importing HttpClientModule Service Using HttpClient Making a GET Request What does an Observable Object do? Using the Service in a Component The PeopleService Client Component Error Handling Customizing the Error Object Making a POST Request Making a PUT Request Making a DELETE Request Summary Chapter 10. Pipes and Data Formatting What are Pipes? Built-In Pipes Using Pipes in HTML Template Chaining Pipes Internationalized Pipes (i18n) Loading Locale Data The date Pipe The number Pipe Currency Pipe Create a Custom Pipe Custom Pipe Example Using Custom Pipes Using a Pipe with ngFor A Filter Pipe Pipe Category: Pure and Impure Pure Pipe Example Impure Pipe Example Summary Chapter 11. Introduction to Single Page Applications What is a Single Page Application (SPA) Traditional Web Application SPA Workflow Single Page Application Advantages HTML5 History API SPA Challenges Implementing SPA's Using Angular Summary Chapter 12. The Angular Component Router The Component Router View Navigation The Angular Router API Creating a Router Enabled Application Hosting the Routed Components Navigation Using Links and Buttons Programmatic Navigation Passing Route Parameters Navigating with Route Parameters Obtaining the Route Parameter Values Retrieving the Route Parameter Synchronously Retrieving a Route Parameter Asynchronously Query Parameters Supplying Query Parameters Retrieving Query Parameters Asynchronously Problems with Manual URL entry and Bookmarking Summary Lab Exercises Lab 1. Introduction to AngularLab 2. Introduction to TypeScriptLab 3. Introduction to ComponentsLab 4. Component TemplateLab 5. Create a Photo Gallery ComponentLab 6. Template Driven FormLab 7. Create an Edit FormLab 8. Reactive FormLab 9. Develop a ServiceLab 10. Develop an HTTP ClientLab 11. Use PipesLab 12. Basic Single Page Application Using RouterLab 13. Build a Single Page Application (SPA) We regularly offer classes in these and other cities. Atlanta, Austin, Baltimore, Calgary, Chicago, Cleveland, Dallas, Denver, Detroit, Houston, Jacksonville, Miami, Montreal, New York City, Orlando, Ottawa, Philadelphia, Phoenix, Pittsburgh, Seattle, Toronto, Vancouver, Washington DC. View Course Outline Share This Request On-Site or Customized Course Info Lab Setup Guide REGISTER FOR A COURSEWARE SAMPLE x Sent First Name Last Name Email Request On-Site or Customized Course Info x Sent First Name Last Name Phone Number Company Name Email Question
Course #:WA3009 Introduction to Angular 10 Programming Training Download Sample Labs 10/25/2021 - 10/27/2021 USD$1,995.00 Instructor Led Virtual 12/06/2021 - 12/08/2021 USD$1,995.00 Instructor Led Virtual 01/24/2022 - 01/26/2022 USD$1,995.00 Instructor Led Virtual Courseware: Available for sale The Introduction to Angular 10 Programming Training course offered by Web Age Solutions covers all the essential topics and is designed to get students up and running with Angular 10 development in the shortest amount of time. Developers and Application Designers as well as those who are tasked with supporting Angular 10 applications will gain valuable knowledge required for success in their job roles while taking this course. Angular 10 is a JavaScript framework that supports the development of single-page applications that run in browsers and can also be used to develop responsive web sites and hybrid mobile applications. The Angular 10 Training course includes labs for each major topic that allow you to get hands-on experience programming and troubleshooting Angular 10 code. Objectives Develop single page Angular applications using Typescript Set up a complete Angular development environment Create Components Component Templates Inter Component Communication Template Driven Forms Reactive Forms Services and Dependency Injection HTTP Client Pipes and Data Formatting Introduction to Single Page Applications The Angular Component Router Prerequisites Web development experience using HTML, CSS and JavaScript is required to get the most out of this Angular 10 course. Knowledge of the browser DOM is also useful. Prior Angular experience, with AngularJS or the current version of Angular, is not required. We offer a 1-2 day subset of our Introduction to JavaScript course to meet this pre-requisite if needed. Please ask your salesperson for details. Duration 3 Days Outline of Introduction to Angular 10 Programming Training Chapter 1. Introducing Angular What is Angular? Central Features of the Angular Framework Appropriate Use Cases Building Blocks of an Angular Application Basic Architecture of an Angular Application Installing and Using Angular Anatomy of an Angular Application Running the Application Building and Deploying the Application Summary Chapter 2. Introduction to TypeScript Programming Languages for Use with Angular TypeScript Syntax Programming Editors The Type System – Defining Variables The Type System – Defining Arrays Type in Functions Type Inference Defining Classes Class Methods Class Constructors Class Constructors – Alternate Form Interfaces Working with ES6 Modules Visibility Control var vs let Arrow Functions Arrow Function Compact Syntax Arrow Function and Caller Context Template Strings Generics in Class Generics in Function Generics - Restricting Types TypeScript Transpilation Summary Chapter 3. Components What is a Component? An Example Component Creating a Component Using Angular CLI The Component Class The @Component Decorator Registering a Component to Its Module Component Template Example: HelloComponent Template Example: The HelloComponent Class Using a Component Run the Application Component Hierarchy The Application Root Component The Bootstrap File Component Lifecycle Hooks Example Lifecycle Hooks CSS Styles Summary Chapter 4. Component Templates Templates Template Location The Mustache {{ }} Syntax Setting DOM Element Properties Setting Element Body Text Event Binding Expression Event Handler Prevent Default Handling Attribute Directives Apply Styles by Changing CSS Classes Example: ngClass Applying Styles Directly Structural Directives Conditionally Execute Template Example: ngIf Looping Using ngFor ngFor Local Variables Manipulating the Collection Example - Deleting an Item Item Tracking with ngFor Swapping Elements with ngSwitch Grouping Elements Template Reference Variable Summary Chapter 5. Inter Component Communication Communication Basics The Data Flow Architecture Preparing the Child to Receive Data Send Data from Parent More About Setting Properties Firing Event from a Component @Output() Example - Child Component @Output() Example - Parent Component Full Two Way Binding Setting up Two Way Data Binding in Parent Summary Chapter 6. Template Driven Forms Template Driven Forms Importing Forms Module Basic Approach Setting Up a Form Getting User Input Omitting ngForm Attribute Initialize the Form Two Way Data Binding Form Validation Angular Validators Displaying Validation State Using Classes Additional Input Types Checkboxes Select (Drop Down) Fields Rendering Options for Select (Drop Down) Date fields Radio Buttons Summary Chapter 7. Reactive Forms Reactive Forms Overview The Building Blocks Import ReactiveFormsModule Construct a Form Design the Template Getting Input Values Initializing the Input Fields Setting Form Values Subscribing to Input Changes Validation Built-In Validators Showing Validation Error Custom Validator Using a Custom Validator Supplying Configuration to Custom Validator Sub FormGroups - Component Class Sub FormGroups - HTML Template Why Use Sub FormGroups Summary Chapter 8. Services and Dependency Injection What is a Service? Creating a Basic Service The Service Class What is Dependency Injection? Injecting a Service Instance Injectors Injector Hierarchy The Root Injector Registering a Service with a Component's Injector Where to Register a Service? Dependency Injection in Other Artifacts Providing an Alternate Implementation Dependency Injection and @Host Dependency Injection and @Optional Summary Chapter 9. HTTP Client The Angular HTTP Client Using The HTTP Client - Overview Importing HttpClientModule Service Using HttpClient Making a GET Request What does an Observable Object do? Using the Service in a Component The PeopleService Client Component Error Handling Customizing the Error Object Making a POST Request Making a PUT Request Making a DELETE Request Summary Chapter 10. Pipes and Data Formatting What are Pipes? Built-In Pipes Using Pipes in HTML Template Chaining Pipes Internationalized Pipes (i18n) Loading Locale Data The date Pipe The number Pipe Currency Pipe Create a Custom Pipe Custom Pipe Example Using Custom Pipes Using a Pipe with ngFor A Filter Pipe Pipe Category: Pure and Impure Pure Pipe Example Impure Pipe Example Summary Chapter 11. Introduction to Single Page Applications What is a Single Page Application (SPA) Traditional Web Application SPA Workflow Single Page Application Advantages HTML5 History API SPA Challenges Implementing SPA's Using Angular Summary Chapter 12. The Angular Component Router The Component Router View Navigation The Angular Router API Creating a Router Enabled Application Hosting the Routed Components Navigation Using Links and Buttons Programmatic Navigation Passing Route Parameters Navigating with Route Parameters Obtaining the Route Parameter Values Retrieving the Route Parameter Synchronously Retrieving a Route Parameter Asynchronously Query Parameters Supplying Query Parameters Retrieving Query Parameters Asynchronously Problems with Manual URL entry and Bookmarking Summary Lab Exercises Lab 1. Introduction to AngularLab 2. Introduction to TypeScriptLab 3. Introduction to ComponentsLab 4. Component TemplateLab 5. Create a Photo Gallery ComponentLab 6. Template Driven FormLab 7. Create an Edit FormLab 8. Reactive FormLab 9. Develop a ServiceLab 10. Develop an HTTP ClientLab 11. Use PipesLab 12. Basic Single Page Application Using RouterLab 13. Build a Single Page Application (SPA) We regularly offer classes in these and other cities. Atlanta, Austin, Baltimore, Calgary, Chicago, Cleveland, Dallas, Denver, Detroit, Houston, Jacksonville, Miami, Montreal, New York City, Orlando, Ottawa, Philadelphia, Phoenix, Pittsburgh, Seattle, Toronto, Vancouver, Washington DC. View Course Outline Share This Request On-Site or Customized Course Info Lab Setup Guide REGISTER FOR A COURSEWARE SAMPLE x Sent First Name Last Name Email Request On-Site or Customized Course Info x Sent First Name Last Name Phone Number Company Name Email Question
