0% completed

All LessonsFree Lessons (12)

Getting Started

Who Should Take This Course and Why?

Introduction to Angular

What Is Angular?Examples of Projects Built with Angular Angular's History Why Use Angular?Course Project: The Client Contacts Manager Application Summary: Introduction to Angular Quiz: Introduction to Angular

Angular Architecture

Overview of Angular

The Folder Structure of an Angular App

The Architecture of an Angular App

Why Use TypeScript?

The Architecture of Our Client Contacts Manager Application

Summary: Angular Architecture

Quiz: Angular Architecture

Getting Started with the Angular CLI

How a CLI Helps Angular Developers?Creating and Running the Client Contacts Manager Application Commands of the Angular CLI Add Angular Material to Angular Project Run Unit Tests Using Angular CLI Using the CLI to Package an Application for Production Schematics and CLI Builders CLI Prompts Angular Elements Summary: Getting Started with the Angular CLI Quiz: Getting Started with the Angular CLI

Components, Templates, and Forms

Components, Templates, and Forms in Angular History of Components Why Do We Have Components Now?The Structure of a Component The Component Life Cycle Hooks Interpolation and One-way Data Binding Passing Data Between Parent/Child Components Passing Data Between Unrelated Components Component Templates and Styling Components Which Template Approach Is the Best?Categories of Components Create Component and Update Routing of Application Create Template-driven Search Form for Application Create Reactive Add Client Form for Application When to Use Reactive and Template Forms Summary: Components, Templates, and Forms Quiz: Components, Templates, and Forms

NgModules

What are Modules in Angular?

Categories of Metadata Used by @NgModule Decorator

The Sections of the NgModule File

How to Create Modules Using the CLI

Creating Modules for Our Client Contact Manager Application

Adding Our Client Components to the ClientModule

Create CustomMaterialModule for Application

Adding Angular Material Modules to Application

Summary: NgModules

Quiz: NgModules

Course Assessment

Angular Assessment 1

Routing and Navigation

Routing and Navigation What Are Routes?The Routes Array The Router Outlet Component Wildcard Routes The redirectTo Route Creating Our Navigation Component Adding Navigation Menu in Toolbar of Application Create About Section of Application Route Parameters Route Guards Implementing a Route Guard Summary: Routing and Navigation Quiz: Routing and Navigation

Dependency Injection, Services, and HttpClient

Dependency Injection, Services, and HttpClient What Is Dependency Injection?How Does Angular Handle Dependency Injection?The Hierarchy of Injectors Benefits of Three Levels of Injectors Providers in Angular Services in Angular A Look at the Services Angular Provides The HttpClient Service Features of the HttpClient API Advanced Features of HttpClient Service Creating Services for Client Contacts Manager Application Summary: Dependency Injection, Services, and HttpClient Quiz: Dependency Injection, Services, and HttpClient

Project

Build a Card Memory Game in Angular

Observables and RxJS

Observables and RxJS Terminologies Related to RxJS The Observable Object Subscribing and Unsubscribing from Observables Error Handling in Observables Hot and Cold Observables What Is RxJS?Observer Design Pattern RxJS Operators Creational Operators Conditional Operators Combination Operators Error Handling Operators Transformation Operators RxJS Subjects How Angular Uses RxJS What is AsyncPipe?Creating Reactive Forms for Client Contacts Manager Application Summary: Observables and RxJS Quiz: Observables and RxJS

Course Assessment

Angular Assessment 2

Project

Build a Weather App Using Angular and RxJS

State Management and NgRx

State Management and NgRx Defining State Management Methods for Implementing State Management The Redux Library Exploring NgRx Example of an Action Example of a Reducer Example of the Store Registering the State Example of Selectors Effects Summary: State Management and NgRx Quiz: State Management and NgRx

Testing Angular Applications

Testing Angular Applications Testing and Test Driven Development Jasmine in Action Setup and Teardown of Tests The Karma Test Runner Taking a Test Driven Development Approach Karma Settings in Angular Running Tests Using the Angular CLI Writing Tests in Angular The TestBed Class Examples of Tests Summary: Testing Quiz: Testing

Packaging Our Application

Ready for Production Building a Release Version with the CLI The Environment Files The angular.json File Ahead-of-time Compilation Other Various Production Optimisations Making Use of Lazy Loading Application Size Budget Measuring Performance Summary: Packaging Our Application Quiz: Packaging Our Application

Course Assessment

Angular Assessment 3

Conclusion

Appendix

Installing the Angular CLI Create Your First Angular App Installing Visual Studio Code Installing NgRx

The Angular Masterclass/

...

/

NgModules

NgModules

Let's learn about Ng modules in this chapter.

We'll cover the following...

- Chapter learning outcomes
- Client contacts manager application

Chapter learning outcomes

So far, we’ve discussed the architecture of an Angular project. We’ve created the basic version of our demo application, the Client Contacts Manager, and added some components to this application. Everything we’ve done so far has all been developed within the single module that Angular generates for us.

In this chapter, we will start looking further into modules in ...