W3docs

Angular - The Complete Guide

Master Angular (formerly "Angular 2") and build awesome, reactive web apps with the successor of Angular.js

Start course

This course starts from scratch, you neither need to know Angular 1 nor Angular 2!

Angular 9 simply is the latest version of Angular 2, you will learn this amazing framework from the ground up in this course!

Join the most comprehensive, popular and bestselling Angular course and benefit not just from a proven course concept but from a huge community as well!

From Setup to Deployment, this course covers it all! You'll learn all about Components, Directives,Services, Forms, Http Access, Authentication, Optimizing an Angular App with Modules and Offline Compilation and much more - and in the end: You'll learn how to deploy an application!

But that's not all! This course will also show you how to use the Angular CLI and feature a complete project, which allows you to practice the things learned throughout the course!

Angular is one of the pmost modern, performance-efficient and powerful frontend frameworks you can learn as of today. It allows you to build great web apps which offer awesome user experiences! Learn all the fundamentals you need to know to get started developing Angular applications right away.

This course uses TypeScript

TypeScript is the main language used by the official Angular team and the language you'll mostly see in Angular tutorials. It's a superset to JavaScript and makes writing Angular apps really easy. Using it ensures, that you will have the best possible preparation for creating Angular apps. Check out the free videos for more information.

TypeScript knowledge is, however, not required - basic JavaScript knowledge is enough.

Why Angular?

Angular is the next big deal. Being the successor of the overwhelmingly successful Angular.js framework it’s bound to shape the future of frontend development in a similar way. The powerful features and capabilities of Angular allow you to create complex, customizable, modern, responsive and user friendly web applications.

Angular 9 simply is the latest version of the Angular framework and simply an update to Angular 2.

Angular is faster than Angular 1 and offers a much more flexible and modular development approach. After taking this course you’ll be able to fully take advantage of all those features and start developing awesome applications immediately.

Due to the drastic differences between Angular 1 and Angular (=Angular 9) you don’t need to know anything about Angular.js to be able to benefit from this course and build your futures projects with Angular.

Get a very deep understanding of how to create Angular applications

This course will teach you all the fundamentals about modules, directives, components, databinding, routing, HTTP access and much more! We will take a lot of deep dives and each section is backed up with a real project. All examples showcase the features Angular offers and how to apply them correctly.

Specifically you will learn:

  • Which architecture Angular uses
  • How to use TypeScript to write Angular applications
  • All about directives and components, including the creation of custom directives/ components
  • How databinding works
  • All about routing and handling navigation
  • What Pipes are and how to use them
  • How to access the Web (e.g. RESTful servers)
  • What dependency injection is and how to use it
  • How to use Modules in Angular
  • How to optimize your (bigger) Angular Application
  • An introduction to NgRx and complex state management
  • We will build a major project in this course so that you can practice all concepts
  • and so much more!
  • Pay once, benefit a lifetime!

Don’t lose any time, gain an edge and start developing now!

Course content

Section 1Getting Started

  • Course Introduction
    0:57
  • What is Angular?
    1:59
  • Angular vs Angular 2 vs Latest Version
    3:49
  • Angular Setup & First App
    7:31
  • Join our Online Learning Community
    1:00
  • Editing the First App
    10:05
  • The Course Structure
    4:00
  • How to get the Most out of the Course
    2:25
  • What is TypeScript?
    2:09
  • A Basic Project Setup using Bootstrap for Styling
    4:27
  • Where to find the Course Source Code
    1:00

Section 2The Basics

  • Module IntroductionPremium
    0:56
  • How an Angular App gets Loaded and Started
    7:11
  • Components are Important!
    3:08
  • Creating a New ComponentPremium
    6:51
  • Understanding the Role of AppModule and Component DeclarationPremium
    5:15
  • Using Custom ComponentsPremium
    1:12
  • Creating Components with the CLI & Nesting ComponentsPremium
    3:51
  • Working with Component TemplatesPremium
    3:08
  • Working with Component StylesPremium
    4:02
  • Fully Understanding the Component SelectorPremium
    3:50
  • Assignment: Component Basics (Problem)Premium
    1:33
  • Assignment: Component Basics (Solution)Premium
    6:42
  • What is Databinding?Premium
    2:49
  • String InterpolationPremium
    5:19
  • Property BindingPremium
    6:34
  • Property Binding vs String InterpolationPremium
    3:07
  • Event BindingPremium
    4:09
  • Passing and Using Data with Event BindingPremium
    4:37
  • Two-Way-DatabindingPremium
    2:47
  • Combining all Forms of DatabindingPremium
    1:46
  • Assignment: Data & Event Binding (Problem)Premium
    1:07
  • Assignment: Data & Event Binding (Solution)Premium
    5:12
  • Understanding DirectivesPremium
    2:17
  • Using ngIf to Output Data ConditionallyPremium
    3:52
  • Enhancing ngIf with an Else ConditionPremium
    2:46
  • Styling Elements Dynamically with ngStylePremium
    5:01
  • Applying CSS Classes Dynamically with ngClassPremium
    2:53
  • Outputting Lists with ngForPremium
    3:43
  • Assignment: Directives (Problem)Premium
    2:15
  • Assignment: Directives (Solution)Premium
    7:06
  • Getting the Index when using ngForPremium
    2:52

Section 3Course Project - The Basics

  • Project IntroductionPremium
    1:04
  • Planning the AppPremium
    5:33
  • Setting up the ApplicationPremium
    4:31
  • Creating the ComponentsPremium
    9:32
  • Using the ComponentsPremium
    3:15
  • Adding a Navigation BarPremium
    5:09
  • Creating a "Recipe" ModelPremium
    4:33
  • Adding Content to the Recipes ComponentsPremium
    7:41
  • Outputting a List of Recipes with ngForPremium
    4:37
  • Displaying Recipe DetailsPremium
    5:52
  • Working on the ShoppingListComponentPremium
    1:49
  • Creating an "Ingredient" ModelPremium
    2:35
  • Creating and Outputting the Shopping ListPremium
    2:27
  • Adding a Shopping List Edit SectionPremium
    3:28
  • Wrap Up & Next StepsPremium
    0:54

Section 4Debugging

  • Understanding Angular Error MessagesPremium
    4:36
  • Debugging Code in the Browser Using SourcemapsPremium
    5:32
  • Using Augury to Dive into Angular AppsPremium
    2:01

Section 5Components & Databinding Deep Dive

  • Module IntroductionPremium
    0:36
  • Splitting Apps into ComponentsPremium
    5:56
  • Property & Event Binding OverviewPremium
    1:44
  • Binding to Custom PropertiesPremium
    5:43
  • Assigning an Alias to Custom PropertiesPremium
    1:59
  • Binding to Custom EventsPremium
    9:05
  • Assigning an Alias to Custom EventsPremium
    0:57
  • Custom Property and Event Binding SummaryPremium
    2:02
  • Understanding View EncapsulationPremium
    4:59
  • More on View EncapsulationPremium
    2:43
  • Using Local References in TemplatesPremium
    4:36
  • Getting Access to the Template & DOM with @ViewChildPremium
    5:02
  • Projecting Content into Components with ng-contentPremium
    3:22
  • Understanding the Component LifecyclePremium
    4:54
  • Seeing Lifecycle Hooks in ActionPremium
    11:54
  • Lifecycle Hooks and Template AccessPremium
    2:33
  • Getting Access to ng-content with @ContentChildPremium
    3:00
  • Wrap UpPremium
    0:49
  • Assignment: Components & Databinding (Problem)Premium
    2:17
  • Assignment: Components & Databinding (Solution)Premium
    12:21

Section 6Course Project - Components & Databinding

  • IntroductionPremium
    0:50
  • Adding Navigation with Event Binding and ngIfPremium
    7:31
  • Passing Recipe Data with Property BindingPremium
    4:43
  • Passing Data with Event and Property Binding (Combined)Premium
    10:31
  • Allowing the User to Add Ingredients to the Shopping ListPremium
    7:22

Section 7Directives Deep Dive

  • Module IntroductionPremium
    1:23
  • ngFor and ngIf RecapPremium
    3:36
  • ngClass and ngStyle RecapPremium
    2:56
  • Creating a Basic Attribute DirectivePremium
    6:42
  • Using the Renderer to build a Better Attribute DirectivePremium
    7:04
  • Using HostListener to Listen to Host EventsPremium
    3:00
  • Using HostBinding to Bind to Host PropertiesPremium
    3:17
  • Binding to Directive PropertiesPremium
    6:43
  • What Happens behind the Scenes on Structural DirectivesPremium
    3:04
  • Building a Structural DirectivePremium
    6:13
  • Understanding ngSwitchPremium
    2:49

Section 8Testing HTTP Request -> Response

  • Testing HTTP Request / Response IntroductionPremium
    0:54
  • Laravel Test SetupPremium
    5:11
  • Asserting Against Response ContentPremium
    6:38
  • Testing Authenticated EndpointsPremium
    5:25
  • Create a Post ModelPremium
    8:06
  • Full Request -> Response TestPremium
    6:12

Section 9Course Project - Directives

  • Building and Using a Dropdown DirectivePremium
    6:25

Section 10Using Services & Dependency Injection

  • Module IntroductionPremium
    1:39
  • Why would you Need Services?Premium
    2:04
  • Creating a Logging ServicePremium
    3:32
  • Injecting the Logging Service into ComponentsPremium
    6:21
  • Creating a Data ServicePremium
    6:41
  • Understanding the Hierarchical InjectorPremium
    2:40
  • How many Instances of Service Should It Be?Premium
    2:12
  • Injecting Services into ServicesPremium
    5:13
  • Using Services for Cross-Component CommunicationPremium
    4:06
  • Services in Angular 6+Premium
    1:00
  • Assignment: Services (Problem)Premium
    1:44
  • Assignment: Services (Solution)Premium
    9:37

Section 11Course Project - Services & Dependency Injection

  • IntroductionPremium
    1:23
  • Setting up the ServicesPremium
    1:15
  • Managing Recipes in a Recipe ServicePremium
    4:07
  • Using a Service for Cross-Component CommunicationPremium
    5:07
  • Adding the Shopping List ServicePremium
    5:04
  • Using Services for Pushing Data from A to BPremium
    3:08
  • Adding Ingredients to RecipesPremium
    3:41
  • Passing Ingredients from Recipes to the Shopping List (via a Service)Premium
    7:03

Section 12Changing Pages with Routing

  • Module IntroductionPremium
    1:26
  • Why do we need a Router?Premium
    1:15
  • Setting up and Loading RoutesPremium
    8:01
  • Navigating with Router LinksPremium
    5:18
  • Understanding Navigation PathsPremium
    4:54
  • Styling Active Router LinksPremium
    5:01
  • Navigating ProgrammaticallyPremium
    3:28
  • Using Relative Paths in Programmatic NavigationPremium
    5:09
  • Passing Parameters to RoutesPremium
    3:10
  • Fetching Route ParametersPremium
    4:01
  • Fetching Route Parameters ReactivelyPremium
    7:25
  • An Important Note about Route ObservablesPremium
    2:42
  • Passing Query Parameters and FragmentsPremium
    5:53
  • Retrieving Query Parameters and FragmentsPremium
    3:15
  • Practicing and some Common GotchasPremium
    6:07
  • Setting up Child (Nested) RoutesPremium
    4:28
  • Using Query Parameters - PracticePremium
    5:36
  • Configuring the Handling of Query ParametersPremium
    1:50
  • Redirecting and Wildcard RoutesPremium
    4:36
  • Redirection Path MatchingPremium
    1:00
  • Outsourcing the Route ConfigurationPremium
    4:40
  • An Introduction to GuardsPremium
    1:45
  • Protecting Routes with canActivatePremium
    8:55
  • Protecting Child (Nested) Routes with canActivateChildPremium
    2:51
  • Using a Fake Auth ServicePremium
    1:43
  • Controlling Navigation with canDeactivatePremium
    12:28
  • Passing Static Data to a RoutePremium
    5:56
  • Resolving Dynamic Data with the resolve GuardPremium
    9:53
  • Understanding Location StrategiesPremium
    4:43
  • Wrap UpPremium
    0:51

Section 13Course Project - Routing

  • Planning the General StructurePremium
    1:36
  • Setting Up RoutesPremium
    7:58
  • Adding Navigation to the AppPremium
    1:41
  • Marking Active RoutesPremium
    1:31
  • Fixing Page Reload IssuesPremium
    2:51
  • Child Routes: ChallengePremium
    1:54
  • Adding Child Routing TogetherPremium
    4:21
  • Configuring Route ParametersPremium
    6:22
  • Passing Dynamic Parameters to LinksPremium
    3:01
  • Styling Active Recipe ItemsPremium
    1:14
  • Adding Editing RoutesPremium
    3:44
  • Retrieving Route ParametersPremium
    3:19
  • Programmatic Navigation to the Edit PagePremium
    4:46
  • One Note about Route ObservablesPremium
    0:52
  • Project CleanupPremium
    1:00

Section 14Understanding Observables

  • Module IntroductionPremium
    4:25
  • Analyzing Angular ObservablesPremium
    2:15
  • Getting Closer to the Core of ObservablesPremium
    6:50
  • Building a Custom ObservablePremium
    4:46
  • Errors & CompletionPremium
    6:39
  • Observables & You!Premium
    1:55
  • Understanding OperatorsPremium
    8:39
  • SubjectsPremium
    8:17
  • Wrap UpPremium
    1:15
  • Useful Resources & LinksPremium
    1:00

Section 15Course Project - Observables

  • Improving the Reactive Service with Observables (Subjects)Premium
    6:04

Section 16Handling Forms in Angular Apps

  • Module IntroductionPremium
    1:19
  • Why do we Need Angular's Help?Premium
    2:21
  • Template-Driven (TD) vs Reactive ApproachPremium
    1:16
  • An Example FormPremium
    1:32
  • TD: Creating the Form and Registering the ControlsPremium
    5:42
  • TD: Submitting and Using the FormPremium
    6:15
  • TD: Understanding Form StatePremium
    2:29
  • TD: Accessing the Form with @ViewChildPremium
    3:03
  • TD: Adding Validation to check User InputPremium
    4:14
  • Built-in Validators & Using HTML5 ValidationPremium
    1:00
  • TD: Using the Form StatePremium
    4:27
  • TD: Outputting Validation Error MessagesPremium
    2:23
  • TD: Set Default Values with ngModel Property BindingPremium
    2:15
  • TD: Using ngModel with Two-Way-BindingPremium
    2:48
  • TD: Grouping Form ControlsPremium
    3:30
  • TD: Handling Radio ButtonsPremium
    3:27
  • TD: Setting and Patching Form ValuesPremium
    4:42
  • TD: Using Form DataPremium
    4:44
  • TD: Resetting FormsPremium
    1:47
  • Assignment: Template-driven Forms (Problem)Premium
    1:15
  • Assignment: Template-driven Forms (Solution)Premium
    12:17
  • Introduction to the Reactive ApproachPremium
    0:40
  • Reactive: SetupPremium
    2:26
  • Reactive: Creating a Form in CodePremium
    4:07
  • Reactive: Syncing HTML and FormPremium
    3:58
  • Reactive: Submitting the FormPremium
    2:15
  • Reactive: Adding ValidationPremium
    2:50
  • Reactive: Getting Access to ControlsPremium
    3:47
  • Reactive: Grouping ControlsPremium
    3:46
  • Reactive: Arrays of Form Controls (FormArray)Premium
    7:31
  • Reactive: Creating Custom ValidatorsPremium
    6:11
  • Reactive: Using Error CodesPremium
    3:20
  • Reactive: Creating a Custom Async ValidatorPremium
    4:38
  • Reactive: Reacting to Status or Value ChangesPremium
    2:11
  • Reactive: Setting and Patching ValuesPremium
    2:09
  • Assignment: Reactive Forms (Problem)Premium
    1:04
  • Assignment: Reactive Forms (Solution)Premium
    13:48

Section 17Course Project - Forms

  • IntroductionPremium
    0:59
  • TD: Adding the Shopping List FormPremium
    3:42
  • Adding Validation to the FormPremium
    2:21
  • Allowing the Selection of Items in the ListPremium
    4:24
  • Loading the Shopping List Items into the FormPremium
    3:02
  • Updating existing ItemsPremium
    3:15
  • Resetting the FormPremium
    2:34
  • Allowing the the User to Clear (Cancel) the FormPremium
    1:16
  • Allowing the Deletion of Shopping List ItemsPremium
    2:52
  • Creating the Template for the (Reactive) Recipe Edit FormPremium
    4:59
  • Creating the Form For Editing RecipesPremium
    5:06
  • Syncing HTML with the FormPremium
    3:52
  • Adding Ingredient Controls to a Form ArrayPremium
    5:39
  • Adding new Ingredient ControlsPremium
    3:38
  • Validating User InputPremium
    5:10
  • Submitting the Recipe Edit FormPremium
    7:30
  • Adding a Delete and Clear (Cancel) FunctionalityPremium
    4:47
  • Redirecting the User (after Deleting a Recipe)Premium
    1:47
  • Adding an Image PreviewPremium
    1:48
  • Providing the Recipe Service CorrectlyPremium
    1:58
  • Deleting Ingredients and Some Finishing TouchesPremium
    3:34
  • Deleting All Items In A FormArrayPremium
    1:00

Section 18Using Pipes to Transform Output

  • Introduction & Why Pipes are UsefulPremium
    2:01
  • Using PipesPremium
    3:28
  • Parametrizing PipesPremium
    2:10
  • Where to learn more about PipesPremium
    1:56
  • Chaining Multiple PipesPremium
    2:20
  • Creating a Custom PipePremium
    6:42
  • Parametrizing a Custom PipePremium
    2:36
  • Example: Creating a Filter PipePremium
    7:01
  • Pure and Impure Pipes (or: How to "fix" the Filter Pipe)Premium
    4:46
  • Understanding the "async" PipePremium
    4:03
  • Assignment: Pipes (Problem)Premium
    1:13
  • Assignment: Pipes (Solution)Premium
    5:10

Section 19Making Http Requests

  • A New IDEPremium
    0:43
  • Module IntroductionPremium
    1:06
  • How Does Angular Interact With Backends?Premium
    3:09
  • The Anatomy of a Http RequestPremium
    2:27
  • Backend (Firebase) SetupPremium
    2:35
  • Sending a POST RequestPremium
    10:11
  • GETting DataPremium
    2:56
  • Using RxJS Operators to Transform Response DataPremium
    3:59
  • Using Types with the HttpClientPremium
    5:07
  • Outputting PostsPremium
    2:15
  • Showing a Loading IndicatorPremium
    2:03
  • Using a Service for Http RequestsPremium
    6:37
  • Services & Components Working TogetherPremium
    3:28
  • Sending a DELETE RequestPremium
    3:27
  • Handling ErrorsPremium
    6:38
  • Using Subjects for Error HandlingPremium
    2:39
  • Using the catchError OperatorPremium
    2:13
  • Error Handling & UXPremium
    2:07
  • Setting HeadersPremium
    3:18
  • Adding Query ParamsPremium
    4:01
  • Observing Different Types of ResponsesPremium
    7:32
  • Changing the Response Body TypePremium
    3:16
  • Introducing InterceptorsPremium
    7:24
  • Manipulating Request ObjectsPremium
    2:32
  • Response InterceptorsPremium
    2:46
  • Multiple InterceptorsPremium
    4:52
  • Wrap UpPremium
    1:57
  • Useful Resources & LinksPremium
    1:00

Section 20Course Project - Http

  • Module IntroductionPremium
    0:55
  • Backend (Firebase) SetupPremium
    2:03
  • Setting Up the DataStorage ServicePremium
    5:32
  • Storing RecipesPremium
    6:39
  • Fetching RecipesPremium
    5:38
  • Transforming Response DataPremium
    4:17
  • Resolving Data Before LoadingPremium
    7:31
  • Fixing a Bug with the ResolverPremium
    1:43

Section 21Authentication & Route Protection in Angular

  • Module IntroductionPremium
    0:52
  • How Authentication WorksPremium
    5:01
  • Adding the Auth PagePremium
    6:44
  • Switching Between Auth ModesPremium
    4:02
  • Handling Form InputPremium
    3:44
  • Preparing the BackendPremium
    3:15
  • Preparing the Signup RequestPremium
    8:24
  • Sending the Signup RequestPremium
    4:36
  • Adding a Loading Spinner & Error Handling LogicPremium
    6:34
  • Improving Error HandlingPremium
    5:39
  • Sending Login RequestsPremium
    6:00
  • Login Error HandlingPremium
    4:28
  • Creating & Storing the User DataPremium
    10:16
  • Reflecting the Auth State in the UIPremium
    9:41
  • Adding the Token to Outgoing RequestsPremium
    10:15
  • Attaching the Token with an InterceptorPremium
    8:48
  • Adding LogoutPremium
    3:18
  • Adding Auto-LoginPremium
    9:55
  • Adding Auto-LogoutPremium
    7:39
  • Adding an Auth GuardPremium
    10:56
  • Wrap UpPremium
    1:55
  • Useful Resources & LinksPremium
    1:00

Section 22Dynamic Components

  • Module IntroductionPremium
    1:09
  • Adding an Alert Modal ComponentPremium
    7:33
  • Understanding the Different ApproachesPremium
    2:28
  • Using ngIfPremium
    3:05
  • Preparing Programmatic CreationPremium
    8:27
  • Creating a Component ProgrammaticallyPremium
    4:46
  • Understanding entryComponentsPremium
    5:06
  • Data Binding & Event BindingPremium
    5:05
  • Wrap UpPremium
    1:25
  • Useful Resources & LinksPremium
    1:00

Section 23Angular Modules & Optimizing Angular Apps

  • Module IntroductionPremium
    0:41
  • What are Modules?Premium
    2:26
  • Analyzing the AppModulePremium
    6:24
  • Getting Started with Feature ModulesPremium
    8:59
  • Splitting Modules CorrectlyPremium
    4:09
  • Adding Routes to Feature ModulesPremium
    4:35
  • Component DeclarationsPremium
    1:58
  • The ShoppingList Feature ModulePremium
    4:27
  • Understanding Shared ModulesPremium
    8:10
  • Understanding the Core ModulePremium
    5:48
  • Adding an Auth Feature ModulePremium
    4:22
  • Understanding Lazy LoadingPremium
    2:52
  • Implementing Lazy LoadingPremium
    12:20
  • More Lazy LoadingPremium
    3:02
  • Preloading Lazy-Loaded CodePremium
    3:39
  • Modules & ServicesPremium
    5:46
  • Loading Services DifferentlyPremium
    8:24
  • Ahead-of-Time CompilationPremium
    9:50
  • Wrap UpPremium
    0:49
  • Useful Resources & LinksPremium
    1:00

Section 24Deploying an Angular App

  • Module IntroductionPremium
    0:52
  • Deployment Preparation & StepsPremium
    3:18
  • Using Environment VariablesPremium
    4:44
  • Example: Deploying to Firebase HostingPremium
    9:01
  • Server-side Routing vs Client-side RoutingPremium
    1:00

Section 25Bonus: Working with NgRx in our Project

  • Module IntroductionPremium
    0:46
  • What is Application State?Premium
    9:07
  • What is NgRx?Premium
    6:55
  • Getting Started with ReducersPremium
    6:44
  • Adding Logic to the ReducerPremium
    5:47
  • Understanding & Adding ActionsPremium
    6:16
  • Setting Up the NgRx StorePremium
    4:48
  • Selecting StatePremium
    8:51
  • Dispatching ActionsPremium
    7:09
  • Multiple ActionsPremium
    9:37
  • Preparing Update & Delete ActionsPremium
    3:08
  • Updating & Deleting IngredientsPremium
    10:59
  • Expanding the StatePremium
    9:17
  • Managing More State via NgRxPremium
    9:52
  • Removing Redundant Component State ManagementPremium
    3:32
  • First Summary & Clean UpPremium
    5:25
  • One Root StatePremium
    11:39
  • Setting Up Auth Reducer & ActionsPremium
    8:25
  • Dispatching Auth ActionsPremium
    5:53
  • Auth Finished (For Now...)Premium
    6:43
  • An Important Note on ActionsPremium
    6:24
  • Exploring NgRx EffectsPremium
    3:38
  • Defining the First EffectPremium
    5:19
  • Effects & Error HandlingPremium
    8:57
  • Login via NgRx EffectsPremium
    9:08
  • Managing UI State in NgRxPremium
    7:30
  • Finishing the Login EffectPremium
    7:11
  • Preparing Other Auth ActionsPremium
    4:09
  • Adding SignupPremium
    6:17
  • Further Auth EffectsPremium
    6:13
  • Adding Auto-Login with NgRxPremium
    8:16
  • Adding Auto-LogoutPremium
    6:31
  • Finishing the Auth EffectsPremium
    2:29
  • Using the Store DevtoolsPremium
    6:20
  • The Router StorePremium
    2:11
  • Getting Started with NgRx for RecipesPremium
    11:03
  • Fetching Recipe Detail DataPremium
    9:14
  • Fetching Recipes & Using the ResolverPremium
    12:00
  • Fixing the Auth RedirectPremium
    2:10
  • Update, Delete and Add RecipesPremium
    15:11
  • Storing Recipes via EffectsPremium
    5:52
  • Cleanup WorkPremium
    1:58
  • Wrap UpPremium
    2:12
  • Alternative NgRx SyntaxPremium
    1:00
  • Useful Resources & LinksPremium
    1:00

Section 26Bonus: Angular Universal

  • Module IntroductionPremium
    3:04
  • Adding Angular UniversalPremium
    10:01
  • Adding Angular Universal with NestJSPremium
    6:18
  • Deploying Angular Universal AppsPremium
    1:00
  • The Remaining Lectures In This ModulePremium
    1:00
  • [OPTIONAL] Module IntroductionPremium
    1:40
  • [OPTIONAL] Getting Started with Angular UniversalPremium
    1:31
  • [OPTIONAL] Working on the App ModulePremium
    4:02
  • [OPTIONAL] Adding a Server-Side Build WorkflowPremium
    4:55
  • [OPTIONAL] Adding a NodeJS ServerPremium
    8:26
  • [OPTIONAL] Pre-Rendering the App on the ServerPremium
    4:11
  • [OPTIONAL] Next StepsPremium
    1:38
  • Angular Universal GotchasPremium
    1:00

Section 27Angular Animations

  • Module IntroductionPremium
    1:03
  • Setting Up A Starting ProjectPremium
    0:52
  • Animations Triggers and StatePremium
    7:11
  • Switching between StatesPremium
    2:04
  • TransitionsPremium
    1:54
  • Advanced TransitionsPremium
    5:21
  • Transition PhasesPremium
    3:57
  • The "void" StatePremium
    6:11
  • Using Keyframes for AnimationsPremium
    5:32
  • Grouping TransitionsPremium
    2:11
  • Using Animation CallbacksPremium
    2:38

Section 28Adding Offline Capabilities with Service Workers

  • Module IntroductionPremium
    2:09
  • Adding Service WorkersPremium
    12:41
  • Caching Assets for Offline UsePremium
    5:28
  • Caching Dynamic Assets & URLsPremium
    7:02
  • Useful Resources & LinksPremium
    1:00

Section 29A Basic Introduction to Unit Testing in Angular Apps

  • IntroductionPremium
    1:18
  • Why Unit Tests?Premium
    2:12
  • Analyzing the Testing Setup (as created by the CLI)Premium
    8:01
  • Running Tests (with the CLI)Premium
    1:59
  • Adding a Component and some fitting TestsPremium
    6:14
  • Testing Dependencies: Components and ServicesPremium
    6:55
  • Simulating Async TasksPremium
    9:41
  • Using "fakeAsync" and "tick"Premium
    2:14
  • Isolated vs Non-Isolated TestsPremium
    6:10
  • Useful Resources & LinksPremium
    1:00

Section 30Angular as a Platform & Closer Look at the CLI

  • Module IntroductionPremium
    1:44
  • A Closer Look at "ng new"Premium
    5:18
  • IDE & Project SetupPremium
    2:31
  • Understanding the Config FilesPremium
    9:01
  • Important CLI CommandsPremium
    5:25
  • The "angular.json" File - A Closer LookPremium
    11:18
  • Angular Schematics - An IntroductionPremium
    1:41
  • The "ng add" CommandPremium
    4:31
  • Using Custom "ng generate" SchematicsPremium
    3:05
  • Smooth Updating of Projects with "ng update"Premium
    2:14
  • Simplified Deployment with "ng deploy"Premium
    5:46
  • Understanding "Differential Loading"Premium
    5:10
  • Managing Multiple Projects in One FolderPremium
    4:35
  • Angular Libraries - An IntroductionPremium
    2:51
  • Wrap UpPremium
    1:27

Section 31Course Roundup

  • RoundupPremium
    1:33

Course instructor

Photo of Maximilian Schwarzmüller

Maximilian Schwarzmüller

As a self-taught professional I really know the hard parts and the difficult topics when learning new or improving on already-known languages. This background and experience enable me to focus on the most relevant key concepts and topics. My track record of many 5-star rated courses, more than 1,000,000 students worldwide as well as a successful YouTube channel is the best proof for that.

The most rewarding experience for me is to see how people find new, better jobs, build awesome web applications, work on amazing projects or simply enjoy their hobby with the help of my content. That's why, together with Manuel Lorenz, I founded Academind to offer the best possible learning experience and to share the pleasure of learning with our students.