CF

Angular Pro

16h 41m 46s
English
Paid

Unlock Angular's potential by exploring all its advanced features such as RxJS, Reactive Forms, Modular Architecture, TypeScript concepts, State Management, and Unit Testing. This course includes a final project to solidify your knowledge.

Course Overview

This course is designed to delve deeply into Angular's advanced capabilities, guiding you through complex concepts and practical applications. By the end, you'll have a comprehensive understanding and hands-on experience with everything Angular has to offer.

What You'll Learn

  • Mastery of Angular's advanced features
  • Integration and application of RxJS
  • Implementation of Reactive Forms
  • Design and use of a Modular Architecture
  • Advanced TypeScript concepts
  • Effective State Management techniques
  • Principles of Unit Testing in Angular
  • Completion of a final project to solidify learning

Course Requirements

Before embarking on this advanced journey, ensure you have the foundational knowledge required to maximize your learning experience.

  • Basic Angular knowledge
  • Understanding of component architecture
  • Proficiency in JavaScript

About the Author: Ultimate Courses (Todd Motto)

Ultimate Courses (Todd Motto) thumbnail

Ultimate Courses (ultimatecourses.com) is the online course platform of Todd Motto, a UK-based Google Developer Expert for Angular and one of the longer-running independent voices on the Angular and TypeScript stack. The platform also covers Vue, RxJS, and JavaScript fundamentals.

The course catalog covers Angular in depth (the framework from its early TypeScript-era through current versions), TypeScript (compiler internals and advanced type-system patterns), RxJS and reactive programming, Vue.js, JavaScript fundamentals, and the broader modern front-end ecosystem. Material is taught at the level of comprehensive reference work rather than introductory tutorial.

The CourseFlix listing under this source carries 9 Ultimate Courses titles spanning that range. Material is paid; Ultimate Courses runs on per-course or membership pricing on the original platform.

Watch Online 116 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 116 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Course introduction
All Course Lessons (116)
#Lesson TitleDurationAccess
1
Course introduction Demo
00:24
2
Content projection with ng-content
02:55
3
Using ng-content with projection slots
03:11
4
Projecting and binding to components
04:36
5
@ContentChild and ngAfterContentInit
07:33
6
@ContentChildren and QueryLists
03:45
7
@ViewChild and ngAfterViewInit
06:10
8
@ViewChildren and QueryLists
05:13
9
@ViewChild and template #refs
01:50
10
Using ElementRef and nativeElement
03:59
11
Using the platform agnostic Renderer
04:08
12
Dynamic components with ComponentFactoryResolver
07:13
13
Dynamic component @Input data
02:52
14
Dynamic component @Output subscriptions
02:05
15
Destroying dynamic components
02:52
16
Dynamic components reordering
03:27
17
Dynamic template rendering with ViewContainerRef
02:51
18
Passing context to a dynamic template
03:48
19
Dynamic template rendering with ngTemplateOutlet
01:40
20
Using ngTemplateOutlet with context
02:24
21
ViewEncapsulation and Shadow DOM
05:44
22
OnPush Change Detection and Immutability
06:23
23
Creating a custom attribute Directive
05:21
24
@HostListener and host Object
05:35
25
Understanding @HostBinding
03:34
26
Using the exportAs property with template refs
05:21
27
Creating a custom structural Directive
12:11
28
Creating a custom pipe
05:27
29
Pipes as providers
04:01
30
Reactive Forms setup
06:00
31
FormControls and FormGroups
08:18
32
Componentizing FormGroups
13:14
33
Binding FormControls to select
08:46
34
FormGroup collections with FormArray
12:18
35
Adding items to the FormArray
06:39
36
Removing items from the FormArray
07:09
37
FormBuilder API
04:12
38
Http service and joining Observables
23:22
39
Subscribing to the valueChanges Observable
07:30
40
Updating and resetting FormGroups and FormControls
05:08
41
Custom form control base
08:37
42
Implementing a ControlValueAccessor
14:02
43
Adding keyboard events to our control
08:18
44
Validators object for FormControls
06:45
45
FormControl (custom) validators
09:41
46
FormGroup (custom) validators
09:50
47
Async (custom) validators
12:07
48
Enabling route tracing
01:31
49
Subscribing to router events
06:10
50
Router outlet events
03:09
51
Dynamic route resolves with snapshots
19:54
52
Auxiliary named router outlets
05:13
53
Navigating to auxiliary named outlets
04:31
54
Auxiliary Navigation API
04:08
55
Destroying auxiliary outlets
04:14
56
Resolving data for auxiliary outlets
10:59
57
Lazy-loading modules
10:00
58
Preloading lazy-loaded modules
03:02
59
Custom preloading strategies
07:16
60
Protecting lazy-loaded modules with canLoad
09:26
61
Guards with canActivate
05:24
62
Guards with canActivateChild
03:04
63
Guards with canDeactivate
10:26
64
Karma setup and walkthrough
02:59
65
Testing isolate Pipes
05:44
66
Shallow testing Pipes
14:32
67
Testing Services with dependencies
12:25
68
Testing Component methods
05:55
69
Testing @Input and @Output bindings
04:48
70
Testing Component templates
10:10
71
Testing container Components with async providers
13:49
72
Using NO_ERRORS_SCHEMA
02:10
73
Testing an Attribute Directive
06:36
74
Providers and useValue
06:13
75
Using InjectionToken
04:02
76
Providers and useClass
02:49
77
Providers and useFactory
05:42
78
Providers and useExisting
04:12
79
Configurable NgModules
06:28
80
Zones and NgZone
06:27
81
State Management architecture overview
07:02
82
Creating an Observable Store with Rx
16:45
83
Container components setup
06:17
84
Populating the Store and component subscription
13:40
85
Composing new Observable streams from our Store
04:25
86
Integrating a stateless component
08:47
87
Component outputs back to Service
07:27
88
Updating our Store in a Service
07:01
89
Project setup, walkthrough, install
13:50
90
Firebase CLI and initial AoT deploy
11:11
91
AuthModule and child module setup
10:01
92
Login/Register reactive form components
21:24
93
AuthService and AngularFire integration
22:00
94
Reactive Store and AngularFire Observables
13:13
95
Stateless components and logout functionality
16:25
96
HealthModule setup and lazy loading
13:59
97
Implementing AuthGuards for lazy routes
08:07
98
Data layer, initiate Observable streams
20:14
99
Async Pipe "as" syntax and routing
09:37
100
Component architecture and Reactive Forms
25:38
101
Rendering streams into Stateless components
10:05
102
Stateless components and removing items
11:17
103
Route Params and Observable switchMaps
11:06
104
Reactive Form outputs and async / await
21:38
105
Workout module transition
19:44
106
Custom FormControl with ControlValueAccessor
13:21
107
Reactive Form conditionals
09:43
108
Custom Workout / Meal Pipes
10:48
109
Schedule Calendar, Observables, BehaviorSubject
16:36
110
Schedule controls and Date logic
12:52
111
Calendar date toggling
09:19
112
Rendering schedule sections from Observables
28:56
113
Emitting from Stateless components
07:54
114
Schedule assignment and Store
22:41
115
Hooking schedules into Firebase
10:49
116
Project review and deployment
05:57
Unlock unlimited learning

Get instant access to all 115 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Related courses

Frequently asked questions

What prerequisites are needed before enrolling in this course?
Prospective students should have basic Angular knowledge, an understanding of component architecture, and proficiency in JavaScript. These foundational skills are essential for grasping the advanced concepts covered, such as RxJS integration, Reactive Forms, and State Management.
What kind of projects will I build during the course?
The course culminates in a final project designed to solidify your understanding of Angular's advanced features. Throughout the course, you'll engage with dynamic components, Reactive Forms, and modular architectures, applying these skills in practical, real-world scenarios.
Who is the target audience for this course?
This course is aimed at developers who already have a foundation in Angular and want to deepen their understanding of its advanced features. It is particularly suitable for those looking to master RxJS, State Management, and Unit Testing within the Angular framework.
How does this course compare to other Angular courses?
This course focuses on advanced Angular features, offering a deep dive into complex topics such as Reactive Forms, Modular Architecture, and advanced TypeScript concepts. It differentiates itself by providing comprehensive coverage of State Management and Unit Testing, areas not always extensively covered in other courses.
What specific tools or platforms will I learn to use?
The course includes lessons on various Angular tools and concepts such as ComponentFactoryResolver for dynamic components, FormBuilder API for Reactive Forms, and advanced TypeScript features. It also covers RxJS integration and principles of Unit Testing within the Angular ecosystem.
What topics are not covered in this course?
While the course extensively covers advanced Angular features, it does not cover Angular's basic concepts or introductory JavaScript. Students are expected to have this foundational knowledge before beginning the course, as the content builds on these basics.
How much time should I expect to commit to this course?
The course consists of 116 lessons with a total runtime of approximately 16 hours and 42 minutes. Students should plan to spend additional time on the final project and practical exercises, which are crucial for applying and reinforcing the concepts learned.