Angular 8 - The Complete Guide (2020 Edition)

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

All Levels 4.5(105,232 Ratings) 338,153 Students enrolled
Created by Maximilian Schwarzmüller Last updated 01/2020 English English
What will i learn?
  • Develop modern, complex, responsive and scalable web applications with Angular 8
  • Fully understand the architecture behind an Angular 8 application and how to use it
  • Use the gained, deep understanding of the Angular 8 fundamentals to quickly establish yourself as a frontend developer
  • Create single-page applications with one of the most modern JavaScript frameworks out there

Curriculum for this course
512 Lectures 35:24:16
Getting Started
9 Lectures 00:36:14
  • Course Introduction 00:00:57
  • What is Angular? 00:01:59
  • Angular vs Angular 2 vs Angular 8 00:02:57
  • Project Setup and First App 00:07:31
  • Editing the First App 00:10:05
  • The Course Structure 00:04:00
  • How to get the Most out of the Course 00:02:25
  • What is TypeScript? 00:02:09
  • A Basic Project Setup using Bootstrap for Styling 00:04:11
  • Join our Online Learning Community 00:00:22 CLI Deep Dive & Troubleshooting 00:01:11 Where to find the Course Source Code 00:00:32
  • Module Introduction 00:00:56
  • How an Angular App gets Loaded and Started 00:07:11
  • Components are Important! 00:03:08
  • Creating a New Component 00:06:51
  • Understanding the Role of AppModule and Component Declaration 00:05:15
  • Using Custom Components 00:01:12
  • Creating Components with the CLI & Nesting Components 00:03:51
  • Working with Component Templates 00:03:08
  • Working with Component Styles 00:04:02
  • Fully Understanding the Component Selector 00:03:50
  • [OPTIONAL] Assignment Solution 00:06:42
  • What is Databinding? 00:02:49
  • String Interpolation 00:05:19
  • Property Binding 00:06:34
  • Property Binding vs String Interpolation 00:03:07
  • Event Binding 00:04:09
  • Passing and Using Data with Event Binding 00:04:37
  • Two-Way-Databinding 00:02:47
  • Combining all Forms of Databinding 00:01:46
  • [OPTIONAL] Assignment Solution 00:05:12
  • Understanding Directives 00:02:17
  • Using ngIf to Output Data Conditionally 00:03:53
  • Enhancing ngIf with an Else Condition 00:02:46
  • Styling Elements Dynamically with ngStyle 00:05:01
  • Applying CSS Classes Dynamically with ngClass 00:02:53
  • Outputting Lists with ngFor 00:03:43
  • [OPTIONAL] Assignment Solution 00:07:06
  • Getting the Index when using ngFor 00:02:52
  • Practicing Components 1 question
  • Practicing Databinding 1 question
  • Practicing Directives 1 question
  • Bindable Properties and Events 00:00:22 Important: FormsModule is Required for Two-Way-Binding! 00:00:13
  • Project Introduction 00:01:04
  • Planning the App 00:05:33
  • Setting up the Application 00:04:31
  • Creating the Components 00:09:33
  • Using the Components 00:03:15
  • Adding a Navigation Bar 00:05:09
  • Creating a "Recipe" Model 00:04:33
  • Adding Content to the Recipes Components 00:07:41
  • Outputting a List of Recipes with ngFor 00:04:37
  • Displaying Recipe Details 00:05:52
  • Working on the ShoppingListComponent 00:01:49
  • Creating an "Ingredient" Model 00:02:35
  • Creating and Outputting the Shopping List 00:02:27
  • Adding a Shopping List Edit Section 00:03:28
  • Wrap Up & Next Steps 00:00:54
  • Installing Bootstrap Correctly 00:00:29 Alternative Non-Collapsable Navigation Bar 00:00:30
  • Understanding Angular Error Messages 00:04:36
  • Debugging Code in the Browser Using Sourcemaps 00:05:32
  • Using Augury to Dive into Angular Apps 00:02:01
  • Module Introduction 00:00:36
  • Splitting Apps into Components 00:05:56
  • Property & Event Binding Overview 00:01:44
  • Binding to Custom Properties 00:05:43
  • Assigning an Alias to Custom Properties 00:01:59
  • Binding to Custom Events 00:09:05
  • Assigning an Alias to Custom Events 00:00:57
  • Custom Property and Event Binding Summary 00:02:02
  • Understanding View Encapsulation 00:04:59
  • More on View Encapsulation 00:02:43
  • Using Local References in Templates 00:04:36
  • Getting Access to the Template & DOM with @ViewChild 00:05:02
  • Projecting Content into Components with ng-content 00:03:22
  • Understanding the Component Lifecycle 00:04:54
  • Seeing Lifecycle Hooks in Action 00:11:55
  • Lifecycle Hooks and Template Access 00:02:33
  • Getting Access to ng-content with @ContentChild 00:03:00
  • Wrap Up 00:00:49
  • [OPTIONAL] Assignment Solution 00:12:21
  • Practicing Property & Event Binding and View Encapsulation 1 question
  • @ViewChild() in Angular 8 00:00:25 @ContentChild() in Angular 8 00:00:19
  • Introduction 00:00:50
  • Adding Navigation with Event Binding and ngIf 00:07:31
  • Passing Recipe Data with Property Binding 00:04:43
  • Passing Data with Event and Property Binding (Combined) 00:10:31
  • Allowing the User to Add Ingredients to the Shopping List 00:07:22
  • Make sure you have FormsModule added! 00:00:10
  • Module Introduction 00:01:23
  • ngFor and ngIf Recap 00:03:36
  • ngClass and ngStyle Recap 00:02:57
  • Creating a Basic Attribute Directive 00:06:42
  • Using the Renderer to build a Better Attribute Directive 00:07:04
  • Using HostListener to Listen to Host Events 00:03:00
  • Using HostBinding to Bind to Host Properties 00:03:17
  • Binding to Directive Properties 00:06:43
  • What Happens behind the Scenes on Structural Directives 00:03:04
  • Building a Structural Directive 00:06:13
  • Understanding ngSwitch 00:02:49
  • More about the Renderer 00:00:14
  • Building and Using a Dropdown Directive 00:06:25
  • Closing the Dropdown From Anywhere 00:00:21
  • Module Introduction 00:01:39
  • Why would you Need Services? 00:02:04
  • Creating a Logging Service 00:03:32
  • Injecting the Logging Service into Components 00:06:21
  • Creating a Data Service 00:06:41
  • Understanding the Hierarchical Injector 00:02:40
  • How many Instances of Service Should It Be? 00:02:12
  • Injecting Services into Services 00:04:23
  • Using Services for Cross-Component Communication 00:04:06
  • [OPTIONAL] Assignment Solution 00:09:37
  • Practicing Services 1 question
  • Services in Angular 6+ 00:00:36
  • Introduction 00:01:23
  • Setting up the Services 00:01:15
  • Managing Recipes in a Recipe Service 00:04:07
  • Using a Service for Cross-Component Communication 00:05:07
  • Adding the Shopping List Service 00:05:04
  • Using Services for Pushing Data from A to B 00:03:08
  • Adding Ingredients to Recipes 00:03:41
  • Passing Ingredients from Recipes to the Shopping List (via a Service) 00:07:03
  • Module Introduction 00:01:26
  • Why do we need a Router? 00:01:16
  • Setting up and Loading Routes 00:08:01
  • Navigating with Router Links 00:05:18
  • Understanding Navigation Paths 00:04:54
  • Styling Active Router Links 00:05:01
  • Navigating Programmatically 00:03:28
  • Using Relative Paths in Programmatic Navigation 00:05:09
  • Passing Parameters to Routes 00:03:10
  • Fetching Route Parameters 00:04:01
  • Fetching Route Parameters Reactively 00:07:25
  • An Important Note about Route Observables 00:02:42
  • Passing Query Parameters and Fragments 00:05:53
  • Retrieving Query Parameters and Fragments 00:03:15
  • Practicing and some Common Gotchas 00:06:07
  • Setting up Child (Nested) Routes 00:04:28
  • Using Query Parameters - Practice 00:05:36
  • Configuring the Handling of Query Parameters 00:01:50
  • Redirecting and Wildcard Routes 00:04:36
  • Outsourcing the Route Configuration 00:04:40
  • An Introduction to Guards 00:01:45
  • Protecting Routes with canActivate 00:08:55
  • Protecting Child (Nested) Routes with canActivateChild 00:02:51
  • Using a Fake Auth Service 00:01:43
  • Controlling Navigation with canDeactivate 00:12:28
  • Passing Static Data to a Route 00:05:56
  • Resolving Dynamic Data with the resolve Guard 00:09:53
  • Understanding Location Strategies 00:04:43
  • Wrap Up 00:00:51
  • Understanding the Example Project 00:00:10 Important: Redirection Path Matching 00:00:40
  • Planning the General Structure 00:01:36
  • Setting Up Routes 00:07:58
  • Adding Navigation to the App 00:01:41
  • Marking Active Routes 00:01:31
  • Fixing Page Reload Issues 00:02:51
  • Child Routes: Challenge 00:01:54
  • Adding Child Routing Together 00:04:21
  • Configuring Route Parameters 00:06:22
  • Passing Dynamic Parameters to Links 00:03:01
  • Styling Active Recipe Items 00:01:14
  • Adding Editing Routes 00:03:44
  • Retrieving Route Parameters 00:03:19
  • Programmatic Navigation to the Edit Page 00:04:46
  • One Note about Route Observables 00:00:52
  • Project Cleanup 00:00:22
  • Module Introduction 00:04:25
  • Analyzing Angular Observables 00:02:15
  • Getting Closer to the Core of Observables 00:06:50
  • Building a Custom Observable 00:04:46
  • Errors & Completion 00:06:39
  • Observables & You! 00:01:55
  • Understanding Operators 00:08:39
  • Subjects 00:08:17
  • Wrap Up 00:01:15
  • Useful Resources & Links 00:00:05
  • Improving the Reactive Service with Observables (Subjects) 00:06:04
  • Changed the Subscription Name 00:00:07
  • Module Introduction 00:01:19
  • Why do we Need Angular's Help? 00:02:21
  • Template-Driven (TD) vs Reactive Approach 00:01:16
  • An Example Form 00:01:32
  • TD: Creating the Form and Registering the Controls 00:05:42
  • TD: Submitting and Using the Form 00:06:15
  • TD: Understanding Form State 00:02:29
  • TD: Accessing the Form with @ViewChild 00:03:03
  • TD: Adding Validation to check User Input 00:04:14
  • TD: Using the Form State 00:04:27
  • TD: Outputting Validation Error Messages 00:02:23
  • TD: Set Default Values with ngModel Property Binding 00:02:15
  • TD: Using ngModel with Two-Way-Binding 00:02:48
  • TD: Grouping Form Controls 00:03:30
  • TD: Handling Radio Buttons 00:03:27
  • TD: Setting and Patching Form Values 00:04:42
  • TD: Using Form Data 00:04:44
  • TD: Resetting Forms 00:01:48
  • Introduction to the Reactive Approach 00:00:40
  • Reactive: Setup 00:02:26
  • Reactive: Creating a Form in Code 00:04:07
  • Reactive: Syncing HTML and Form 00:03:58
  • Reactive: Submitting the Form 00:02:15
  • Reactive: Adding Validation 00:02:50
  • Reactive: Getting Access to Controls 00:03:47
  • Reactive: Grouping Controls 00:03:46
  • Reactive: Arrays of Form Controls (FormArray) 00:07:31
  • Reactive: Creating Custom Validators 00:06:11
  • Reactive: Using Error Codes 00:03:20
  • Reactive: Creating a Custom Async Validator 00:04:38
  • Reactive: Reacting to Status or Value Changes 00:02:11
  • Reactive: Setting and Patching Values 00:02:09
  • [OPTIONAL] Assignment Solution 00:13:48
  • Practicing Template-Driven Forms 1 question
  • Practicing Reactive Forms 1 question
  • Built-in Validators & Using HTML5 Validation 00:00:27 Fixing a Bug 00:00:29
  • Introduction 00:00:59
  • TD: Adding the Shopping List Form 00:03:42
  • Adding Validation to the Form 00:02:21
  • Allowing the Selection of Items in the List 00:04:24
  • Loading the Shopping List Items into the Form 00:03:02
  • Updating existing Items 00:03:15
  • Resetting the Form 00:02:34
  • Allowing the the User to Clear (Cancel) the Form 00:01:16
  • Allowing the Deletion of Shopping List Items 00:02:52
  • Creating the Template for the (Reactive) Recipe Edit Form 00:04:59
  • Creating the Form For Editing Recipes 00:05:06
  • Syncing HTML with the Form 00:03:52
  • Adding Ingredient Controls to a Form Array 00:05:39
  • Adding new Ingredient Controls 00:03:38
  • Validating User Input 00:05:10
  • Submitting the Recipe Edit Form 00:07:30
  • Adding a Delete and Clear (Cancel) Functionality 00:04:47
  • Redirecting the User (after Deleting a Recipe) 00:01:47
  • Adding an Image Preview 00:01:48
  • Providing the Recipe Service Correctly 00:01:58
  • Deleting Ingredients and Some Finishing Touches 00:03:34
  • Fixing a Bug 00:00:22 Deleting all Items in a FormArray 00:00:10
  • Introduction & Why Pipes are Useful 00:02:01
  • Using Pipes 00:03:28
  • Parametrizing Pipes 00:02:10
  • Where to learn more about Pipes 00:01:56
  • Chaining Multiple Pipes 00:02:20
  • Creating a Custom Pipe 00:06:42
  • Parametrizing a Custom Pipe 00:02:36
  • Example: Creating a Filter Pipe 00:07:01
  • Pure and Impure Pipes (or: How to "fix" the Filter Pipe) 00:04:46
  • Understanding the "async" Pipe 00:04:03
  • Practicing Pipes 1 question
  • A New IDE 00:00:43
  • Module Introduction 00:01:06
  • How Does Angular Interact With Backends? 00:03:09
  • The Anatomy of a Http Request 00:02:27
  • Backend (Firebase) Setup 00:02:35
  • Sending a POST Request 00:10:11
  • GETting Data 00:02:56
  • Using RxJS Operators to Transform Response Data 00:03:59
  • Using Types with the HttpClient 00:05:07
  • Outputting Posts 00:02:15
  • Showing a Loading Indicator 00:02:03
  • Using a Service for Http Requests 00:06:37
  • Services & Components Working Together 00:03:28
  • Sending a DELETE Request 00:03:27
  • Handling Errors 00:06:38
  • Using Subjects for Error Handling 00:02:39
  • Using the catchError Operator 00:02:13
  • Error Handling & UX 00:02:07
  • Setting Headers 00:03:18
  • Adding Query Params 00:04:01
  • Observing Different Types of Responses 00:07:32
  • Changing the Response Body Type 00:03:16
  • Introducing Interceptors 00:07:24
  • Manipulating Request Objects 00:02:32
  • Response Interceptors 00:02:46
  • Multiple Interceptors 00:04:52
  • Wrap Up 00:01:57
  • Useful Resources & Links 00:00:02
  • Module Introduction 00:00:55
  • Backend (Firebase) Setup 00:02:03
  • Setting Up the DataStorage Service 00:05:32
  • Storing Recipes 00:06:39
  • Fetching Recipes 00:05:38
  • Transforming Response Data 00:04:17
  • Resolving Data Before Loading 00:07:31
  • Fixing a Bug with the Resolver 00:01:43
  • Module Introduction 00:00:52
  • How Authentication Works 00:05:01
  • Adding the Auth Page 00:06:44
  • Switching Between Auth Modes 00:04:02
  • Handling Form Input 00:03:44
  • Preparing the Backend 00:03:15
  • Preparing the Signup Request 00:08:24
  • Sending the Signup Request 00:04:36
  • Adding a Loading Spinner & Error Handling Logic 00:06:34
  • Improving Error Handling 00:05:39
  • Sending Login Requests 00:06:00
  • Login Error Handling 00:04:28
  • Creating & Storing the User Data 00:10:17
  • Reflecting the Auth State in the UI 00:09:41
  • Adding the Token to Outgoing Requests 00:10:15
  • Attaching the Token with an Interceptor 00:08:48
  • Adding Logout 00:03:18
  • Adding Auto-Login 00:09:55
  • Adding Auto-Logout 00:07:39
  • Adding an Auth Guard 00:10:56
  • Wrap Up 00:01:55
  • Make sure you got Recipes in your backend! 00:00:13 Useful Resources & Links 00:00:04
  • Module Introduction 00:01:09
  • Adding an Alert Modal Component 00:07:33
  • Understanding the Different Approaches 00:02:28
  • Using ngIf 00:03:05
  • Preparing Programmatic Creation 00:08:27
  • Creating a Component Programmatically 00:04:46
  • Understanding entryComponents 00:03:46
  • Data Binding & Event Binding 00:05:05
  • Wrap Up 00:01:25
  • Useful Resources & Links 00:00:02
  • Module Introduction 00:00:41
  • What are Modules? 00:02:26
  • Analyzing the AppModule 00:06:24
  • Getting Started with Feature Modules 00:08:59
  • Splitting Modules Correctly 00:04:09
  • Adding Routes to Feature Modules 00:04:35
  • Component Declarations 00:01:58
  • The ShoppingList Feature Module 00:04:27
  • Understanding Shared Modules 00:08:10
  • Understanding the Core Module 00:05:48
  • Adding an Auth Feature Module 00:04:22
  • Understanding Lazy Loading 00:02:52
  • Implementing Lazy Loading 00:10:30
  • More Lazy Loading 00:03:02
  • Preloading Lazy-Loaded Code 00:03:39
  • Modules & Services 00:05:46
  • Loading Services Differently 00:08:24
  • Ahead-of-Time Compilation 00:09:50
  • Wrap Up 00:00:49
  • Alternative Lazy Loading Syntax 00:00:22 Useful Resources & Links 00:00:03
  • Module Introduction 00:00:52
  • Deployment Preparation & Steps 00:03:18
  • Using Environment Variables 00:04:44
  • Deployment Example: Firebase Hosting 00:09:01
  • Server Routing vs Browser Routing 00:00:07
  • Module Introduction 00:00:46
  • What is Application State? 00:09:07
  • What is NgRx? 00:06:55
  • Getting Started with Reducers 00:06:44
  • Adding Logic to the Reducer 00:05:47
  • Understanding & Adding Actions 00:06:16
  • Setting Up the NgRx Store 00:04:48
  • Selecting State 00:08:51
  • Dispatching Actions 00:07:09
  • Multiple Actions 00:09:37
  • Preparing Update & Delete Actions 00:03:08
  • Updating & Deleting Ingredients 00:10:59
  • Expanding the State 00:09:17
  • Managing More State via NgRx 00:09:52
  • Removing Redundant Component State Management 00:03:32
  • First Summary & Clean Up 00:05:25
  • One Root State 00:11:39
  • Setting Up Auth Reducer & Actions 00:08:25
  • Dispatching Auth Actions 00:05:53
  • Auth Finished (For Now...) 00:06:43
  • And Important Note on Actions 00:06:24
  • Exploring NgRx Effects 00:03:38
  • Defining the First Effect 00:05:19
  • Effects & Error Handling 00:08:57
  • Login via NgRx Effects 00:09:08
  • Managing UI State in NgRx 00:07:30
  • Finishing the Login Effect 00:07:11
  • Preparing Other Auth Actions 00:04:09
  • Adding Signup 00:06:17
  • Further Auth Effects 00:06:13
  • Adding Auto-Login with NgRx 00:08:16
  • Adding Auto-Logout 00:06:31
  • Finishing the Auth Effects 00:02:29
  • Using the Store Devtools 00:06:20
  • The Router Store 00:02:11
  • Getting Started with NgRx for Recipes 00:11:03
  • Fetching Recipe Detail Data 00:09:14
  • Fetching Recipes & Using the Resolver 00:12:00
  • Fixing the Auth Redirect 00:02:10
  • Update, Delete and Add Recipes 00:15:11
  • Storing Recipes via Effects 00:05:52
  • Cleanup Work 00:01:58
  • Wrap Up 00:02:12
  • [LEGACY] Module Introduction 00:02:06
  • [LEGACY] State Challenges 00:08:28
  • [LEGACY] Getting Started with Reducers 00:08:27
  • [LEGACY] Adding Actions 00:03:56
  • [LEGACY] Finishing the First Reducer 00:03:11
  • [LEGACY] Registering the Application Store 00:01:55
  • [LEGACY] Selecting Data from State 00:04:17
  • [LEGACY] Dispatch Actions 00:05:23
  • [LEGACY] More Actions and Adding Ingredients 00:07:53
  • [LEGACY] Dispatching Update and Deleting Shopping List Actions 00:06:54
  • [LEGACY] Expanding App State 00:05:01
  • [LEGACY] Editing the Shopping-List via NgRx 00:07:20
  • [LEGACY] Managing all Relevant State 00:03:56
  • [LEGACY] Authentication and Side Effects - Introduction 00:02:51
  • [LEGACY] Setting up the Auth Store Files 00:06:05
  • [LEGACY] The Reducer 00:03:50
  • [LEGACY] Adding Reducer Logic & Actions 00:02:35
  • [LEGACY] Adjusting the App Module Setup 00:02:53
  • [LEGACY] Using Authentication 00:05:17
  • [LEGACY] Dispatch Actions 00:04:22
  • [LEGACY] Getting State Access in Http Interceptor 00:06:25
  • [LEGACY] Handling the Auth Token 00:01:57
  • [LEGACY] Only React to Actions Once via take(1) 00:02:47
  • [LEGACY] A Closer Look at Effects 00:03:20
  • [LEGACY] Auth Effects and Actions 00:03:03
  • [LEGACY] Effects - How they Work 00:04:59
  • [LEGACY] Adding Auth Signup 00:10:00
  • [LEGACY] Adding Auth Signin 00:04:46
  • [LEGACY] Navigation as a Side Effect 00:01:22
  • [LEGACY] Handling Logout via NgRx 00:02:13
  • [LEGACY] Additional Fixes 00:01:20
  • [LEGACY] Redirecting Upon Logout 00:02:03
  • [LEGACY] What's Next? 00:03:10
  • [LEGACY] The Router Store Package 00:01:46
  • [LEGACY] Store Devtools 00:05:54
  • [LEGACY] Lazy Load and Dynamic Injection 00:07:54
  • [LEGACY] Adding Recipe Actions 00:04:22
  • [LEGACY] Adding Recipe Reducers 00:05:38
  • [LEGACY] Dispatching and Selecting State 00:04:45
  • [LEGACY] Viewing and Deleting Recipes via NgRx 00:07:38
  • [LEGACY] Editing and Updating Recipes via NgRx 00:05:44
  • [LEGACY] Recipes Side Effects - Fetching from Server 00:09:49
  • [LEGACY] Recipes Side Effects - Storing Recipes on Server 00:04:59
  • [LEGACY] Cleaning Up 00:03:12
  • [LEGACY] Updating to RxJS 6+ 00:12:42
  • [LEGACY] Wrap Up 00:01:07
  • Alternative NgRx Syntax 00:00:42 Useful Resources & Links 00:00:02 MUST READ: The [LEGACY] Lectures 00:00:26 [LEGACY] Important: Angular 6, RxJS 6 and this section! 00:01:00 [LEGACY] Using NgRx Effects with NgRx >= 7 00:00:29 [LEGACY] Useful Resources & Links 00:00:03
  • Module Introduction 00:03:04
  • Adding Angular Universal 00:10:01
  • Adding Angular Universal with NestJS 00:06:18
  • Module Introduction 00:01:40
  • Getting Started with Angular Universal 00:01:31
  • Working on the App Module 00:04:02
  • Adding a Server-Side Build Workflow 00:04:55
  • Adding a NodeJS Server 00:08:26
  • Pre-Rendering the App on the Server 00:04:11
  • Next Steps 00:01:38
  • Deploying Universal Apps 00:00:29 Important: Remaining Lectures 00:00:18 Angular Universal Gotchas 00:00:29
  • Introduction 00:01:03
  • Setting up the Starting Project 00:00:52
  • Animations Triggers and State 00:07:11
  • Switching between States 00:02:04
  • Transitions 00:01:54
  • Advanced Transitions 00:05:22
  • Transition Phases 00:03:57
  • The "void" State 00:06:11
  • Using Keyframes for Animations 00:05:32
  • Grouping Transitions 00:02:11
  • Using Animation Callbacks 00:02:38
  • Making Animations Work with Angular 4+ 00:00:27
  • Module Introduction 00:02:09
  • Adding Service Workers 00:12:41
  • Caching Assets for Offline Use 00:05:28
  • Caching Dynamic Assets & URLs 00:07:02
  • Further Links & Resources 00:00:03
  • Introduction 00:01:18
  • Why Unit Tests? 00:02:12
  • Analyzing the Testing Setup (as created by the CLI) 00:08:01
  • Running Tests (with the CLI) 00:01:59
  • Adding a Component and some fitting Tests 00:06:14
  • Testing Dependencies: Components and Services 00:06:55
  • Simulating Async Tasks 00:09:41
  • Using "fakeAsync" and "tick" 00:02:14
  • Isolated vs Non-Isolated Tests 00:06:10
  • About this Section 00:00:11 Further Resources & Where to Go Next 00:00:21
  • What's New with Angular 8? 00:11:51
  • A First Look At Angular Elements 00:15:34
  • What's New & How to Update 00:00:48
  • Course Roundup 00:01:33
  • Bonus: More Content! 00:00:26
  • Introduction 00:00:44
  • Initializing the Project 00:00:48
  • Setting up the Basic Project Files 00:03:16
  • Installing the Core Dependencies 00:02:15
  • Filling the Project Files with Some Life 00:09:35
  • index.html & Polyfills 00:02:05
  • Installing Development Dependencies 00:01:45
  • Setting up a Development Workflow 00:11:12
  • Finishing & Using the Development Workflow 00:01:30
  • Setting up a Production Workflow 00:09:48
  • Adding Types & Fixing Bugs 00:03:47
  • Finishing Touches 00:02:56
  • Updating to Angular 6 + Webpack 4 00:01:21
  • Introduction 00:02:09
  • Using Types 00:06:27
  • Classes 00:04:47
  • Interfaces 00:05:44
  • Generics 00:02:44
  • Wrap up & Modules 00:02:37
  • Deep dive into TypeScript 00:01:27
Requirements
  • NO Angular 1 or Angular 2 knowledge is required!
  • Basic HTML and CSS knowledge helps, but isn't a must-have
  • Prior TypeScript knowledge also helps but isn't necessary to benefit from this course
  • Basic JavaScript knowledge is required
+ View more
Description

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

Angular 8 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 on Udemy 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!

And if you do get stuck, you benefit from an extremely fast and friendly support - both via direct messaging or discussion. You have my word! ;-)

Angular is one of the most 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.

Hear what my students have to say

Absolutely fantastic tutorial series. I cannot thank you enough. The quality is first class and your presentational skills are second to none. Keep up this excellent work. You really rock! - Paul Whitehouse

The instructor, Max, is very enthusiastic and engaging. He does a great job of explaining what he's doing and why rather than having students just mimic his coding. Max was also very responsive to questions. I would recommend this course and any others that he offers. Thanks, Max!

As a person new to both JavaScript and Angular 2 I found this course extremely helpful because Max does a great job of explaining all the important concepts behind the code. Max has a great teaching ability to focus on what his audience needs to understand.

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 8 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 8) 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!

+ View more
Other related courses
02:38:43
3.8 63 $149.99 Free
08:53:47
3.8 50 Free
01:31:27
Updated Wed, 20-Nov-2019
4.1 38 $149.99 Free
01:45:50
4.1 24 $94.99 Free
04:45:08
4.1 23 Free
01:04:45
4.1 16 Free
03:48:48
4.4 12 $19.99 Free
05:25:07
4.4 22 Free
01:10:37
4.1 10 Free
03:52:13
Updated Mon, 02-Sep-2019
4.1 19 $99.99 Free
04:28:09
4.3 16 $19.99 Free
06:19:49
4.4 13 Free
01:52:35
4 21 $74.99 Free
01:39:41
3.7 14 $79.99 Free
02:09:40
4.2 15 Free
01:01:33
4.2 12 $199.99 Free
51:12:35
4.2 16 $199.99 Free
02:23:35
Updated Tue, 09-Jul-2019
3.7 11 $99.99 Free
01:13:12
4.3 19 $139.99 Free
01:31:26
4.3 18 $139.99 Free
00:58:35
4.1 13 $94.99 Free
12:15:26
4.6 15 $99.99 Free
03:15:34
4.2 15 $199.99 Free
01:15:31
4.2 5 Free
00:44:15
4.5 6 $199.99 Free
03:36:22
4.7 1 Free
16:47:11
3.6 13 Free
03:09:33
Updated Sun, 03-Sep-2017
3.8 16 Free
02:07:36
3.9 1 Free
04:37:27
3.8 2 Free
02:14:18
Updated Fri, 23-Mar-2018
3.7 8 Free
02:23:03
4.3 4 Free
06:22:46
Updated Wed, 23-Mar-2016
4.1 1 Free
04:17:53
4.4 13 Free
00:57:12
3.4 11 Free
02:13:31
4.1 6 Free
12:52:08
3.5 6 Free
01:00:01
Updated Sat, 21-Dec-2019
2.3 4 Free
04:32:16
3.7 2 Free
03:41:40
4.3 3 Free
04:23:54
3.8 1 Free
02:12:25
4.3 0 Free
01:03:10
Updated Fri, 06-Dec-2019
3.9 2 Free
03:33:25
4.1 9 Free
02:43:49
4.4 0 Free
02:00:25
4.5 0 Free
01:10:58
3.8 8 Free
02:55:06
4.2 4 Free
00:36:19
Updated Tue, 28-Mar-2017
3.5 1 Free
02:18:52
4.1 13 Free
00:31:06
Updated Mon, 13-Nov-2017
3.6 6 Free
00:50:23
4 2 Free
02:27:52
Updated Wed, 07-Aug-2019
4.2 6 Free
00:50:19
3.7 4 $129.99 Free
01:49:58
3.9 8 $139.99 Free
01:17:39
Updated Thu, 26-Dec-2019
0 3 Free
03:42:56
4 12 $199.99 Free
02:01:15
Updated Mon, 23-Dec-2019
3.9 2 $199.99 Free
01:40:29
Updated Mon, 23-Dec-2019
3.7 5 $199.99 Free
02:15:39
Updated Mon, 23-Dec-2019
3.1 8 $19.99 Free
02:18:14
4.2 5 $129.99 Free
01:31:32
Updated Mon, 23-Dec-2019
3.8 2 $19.99 Free
01:24:32
Updated Mon, 23-Dec-2019
3.8 2 $19.99 Free
01:30:20
Updated Mon, 23-Dec-2019
3.5 4 $19.99 Free
01:19:56
Updated Mon, 23-Dec-2019
3.5 5 $19.99 Free
00:59:13
Updated Mon, 23-Dec-2019
3.2 4 $19.99 Free
01:01:52
Updated Mon, 23-Dec-2019
3.4 5 $19.99 Free
01:53:25
Updated Mon, 23-Dec-2019
3.4 7 $19.99 Free
02:17:41
Updated Mon, 23-Dec-2019
3.5 7 $19.99 Free
00:47:39
Updated Mon, 23-Dec-2019
3.7 5 $19.99 Free
00:41:25
Updated Mon, 23-Dec-2019
3.5 4 $19.99 Free
01:00:48
Updated Mon, 23-Dec-2019
3.4 6 $19.99 Free
00:33:47
Updated Mon, 23-Dec-2019
3.6 3 $19.99 Free
01:09:52
Updated Mon, 23-Dec-2019
3.4 7 $199.99 Free
00:40:16
Updated Mon, 23-Dec-2019
3.2 7 $199.99 Free
00:49:55
Updated Mon, 23-Dec-2019
3.6 3 $199.99 Free
02:34:03
4 5 Free
24:16:36
4.2 36 $199.99 Free
00:37:00
3.6 2 $99.99 Free
07:52:29
0 14 $114.99 Free
05:38:23
Updated Sat, 17-Aug-2019
4.3 3 $34.99 Free
01:20:14
Updated Tue, 14-May-2013
4 0 Free
05:57:07
3.7 10 $159.99 Free
05:26:39
0 16 $39.99 Free
00:37:17
3.9 5 $99.99 Free
06:23:22
2.5 16 Free
08:33:58
3.9 12 $19.99 Free
27:55:46
4.5 7 $199.99 Free
47:29:47
Updated Tue, 31-Dec-2019
4.6 90 $179.99 Free
03:32:49
Updated Sat, 28-Sep-2019
4.6 18 $49.99 Free
14:59:04
4.7 8 $199.99 Free
13:30:15
Updated Thu, 26-Dec-2019
4.5 23 $149.99 Free
28:04:40
4.7 44 $199.99 Free
10:22:00
4.6 14 $119.99 Free
14:51:23
4.2 78 $194.99 Free
46:24:20
Updated Thu, 12-Dec-2019
4.6 150 $199.99 Free
05:30:27
4 15 $159.99 Free
04:17:37
4 2 Free
03:59:09
4.7 3 Free
03:41:47
3 11 Free
04:00:56
4.1 2 $149.99 Free
03:35:47
4.2 8 $199.99 Free
22:12:56
4 9 $199.99 Free
08:03:16
4.3 10 Free
10:51:38
3.3 3 $199.99 Free
14:41:03
4.2 9 Free
04:35:13
3.8 3 Free
39:30:00
4 14 Free
04:32:42
3.8 12 Free
05:32:51
4.4 1 Free
06:43:19
Updated Sun, 04-Aug-2019
4.1 2 Free
03:20:40
4.2 6 Free
05:51:57
Updated Sat, 16-Nov-2019
4.1 13 Free
18:45:45
Updated Tue, 24-Sep-2019
4.6 3 Free
04:47:30
4.1 12 Free
02:39:55
3.7 13 Free
13:17:19
3.8 14 $124.99 Free
01:18:41
Updated Mon, 23-Dec-2019
0 8 $19.99 Free
14:40:08
4.1 11 Free
01:18:30
Updated Sun, 12-Jan-2020
0 4 Free
03:09:37
3.9 11 Free
08:12:53
4.7 6 $39.99 Free
21:42:23
Updated Sun, 08-Dec-2019
4.6 13 $174.99 Free
02:18:00
4.3 6 $129.99 Free
14:34:08
4.6 14 $149.99 Free
17:04:39
Updated Thu, 26-Dec-2019
4.5 13 $109.99 Free
23:53:13
4.5 7 $94.99 Free
11:00:44
4.5 8 $149.99 Free
12:36:12
4.6 19 $149.99 Free
05:49:54
Updated Sun, 03-Nov-2019
4.6 11 $109.99 Free
10:11:39
4 9 $49.99 Free
02:52:39
Updated Fri, 10-Jan-2020
3 5 Free
01:06:37
Updated Sun, 19-Jan-2020
4.1 6 $19.99 Free
00:55:55
4.9 3 Free
01:57:08
4.3 7 $199.99 Free
05:05:38
Updated Sun, 10-Aug-2014
4 1 Free
00:58:40
Updated Wed, 20-Nov-2019
4.2 6 Free
06:20:09
4.2 5 Free
29:24:58
4.1 11 Free
01:19:25
3.2 5 Free
00:45:46
Updated Wed, 06-Nov-2019
2 2 $19.99 Free
09:10:22
4.4 11 Free
01:20:24
4 4 Free
03:51:23
3.8 2 Free
00:40:21
Updated Thu, 22-Aug-2019
3.2 3 Free
02:07:04
Updated Tue, 14-Aug-2018
0 5 Free
02:19:58
Updated Sun, 02-Jun-2019
3.2 3 Free
01:51:26
Updated Mon, 13-Jan-2020
0 9 $99.99 Free
03:04:46
Updated Wed, 22-Jan-2020
4.3 6 Free
01:57:15
Updated Fri, 29-Sep-2017
4.3 3 Free
08:16:39
4.3 10 $174.99 Free
06:41:57
4.1 8 $174.99 Free
07:58:41
4.4 3 $194.99 Free
01:08:54
4 2 Free
01:25:26
4 3 Free
00:31:50
Updated Tue, 07-Jan-2020
3.8 1 Free
02:21:42
0 2 $179.99 Free
02:51:06
3.5 2 Free
02:26:30
Updated Sat, 25-Jan-2020
3.6 2 $99.99 Free
00:36:04
3.4 1 Free
03:10:29
4 7 Free
42:10:51
4.7 18 $199.99 Free
01:55:44
4.3 7 $99.99 Free
01:15:58
3.3 11 $199.99 Free
05:50:21
4.4 78 Free
11:51:39
4.5 74 $199.99 Free
04:00:57
3.9 5 $199.99 Free
27:49:26
4.5 128 $199.99 Free
07:33:47
4.1 5 $19.99 Free
06:20:15
Updated Thu, 04-Oct-2018
3.8 5 $99.99 Free
02:21:45
4.2 4 $199.99 Free
14:28:07
3.9 5 $199.99 Free
02:41:06
4.2 4 $104.99 Free
02:05:43
Updated Sun, 29-Oct-2017
3.7 5 Free
02:34:40
Updated Tue, 05-Dec-2017
4 4 Free
About the instructor
  • 129 Students
  • 5 Courses
+ View more
Professional Web Developer and Instructor
Student feedback
4.5
Average rating
  • 0%
  • 1%
  • 12%
  • 61%
  • 124%
Comments
Free $189.99
Includes:
  • 35:24:16 On demand videos
  • 512 Lessons
  • Full lifetime access
  • Access on mobile and tv