Angular – The Complete Guide (2023 Edition) is one of the most comprehensive and best-selling Angular courses on Udemy. It is a beginner-friendly course that teaches about Angular. Angular is a platform and framework that is used to build single-page applications using TypeScript and HTML. Currently, Udemy is offering the course for up to 87% off i.e. INR 455 (INR 3,499).
The course focuses on teaching students how to create Angular applications. This course is apt for beginners as well as students who have prior knowledge of JavaScript and are willing to deeply learn Angular.
Learning Outcomes
- Build applications using Angular 13
- The architecture and usage of an Angular application
- Learn the necessary skills required to be a front-end developer
Course Highlights
| Key Highlights | Details |
|---|---|
| Course Name | Angular – The Complete Guide (2023 Edition) |
| Duration | 34.5 hours |
| Rating | 4.6/5 |
| Student Enrollment | 6.53 lakhs |
| Instructor | Maximilian Schwarzmüller |
| Course Level (Resources Required) | Apt for Beginner and Intermediate Level Students |
| Coding Exercises | Yes |
| Projects | Yes |
| Total Student Reviews | 1.78 lakhs |
| Merits |
|
| Shortcomings |
|
Course Content
| S.No | Module (Duration) | Topics |
|---|---|---|
| 1. | Introduction (41 Minutes) | What is Angular |
| Angular vs Angular 2 vs All the Latest Angular Versions | ||
| CLI Deep Drive and Troubleshooting | ||
| Editing the first app | ||
| What is TypeScript | ||
| A basic project setup using Bootstrap for Styling | ||
| 2. | The Basics (1 Hour 54 Minutes) | How an Angular App gets Loaded and Started |
| Creating a New Component | ||
| Understanding the Role of AppModule and Component Declaration | ||
| Using Custom Components | ||
| Creating Components with the CLI & Nesting Components | ||
| What is Data Binding | ||
| String Interpolation | ||
| Property Binding | ||
| Combining all Forms of Databinding | ||
| Outputting Lists with ngFor | ||
| 3. | Debugging (10 Minutes) | Understanding Angular Error Messages |
| Debugging Code in the Browser Using Sourcemaps | ||
| 4. | Components and Databinding Deep Drive (1 Hour 25 Minutes) | Splitting Apps into Components |
| Property and Event Binding | ||
| Binding to Custom Properties | ||
| Getting Access to ng-content with @ContentChild | ||
| Lifecycle Hooks and Template Access | ||
| Projecting Content into Components with ng-content | ||
| Using Local References in Templates | ||
| More on View Encapsulation | ||
| 5. | Directives Deep Dive (47 minutes) | Creating a Basic Attribute Directive |
| Using the Renderer to build a Better Attribute Directive | ||
| Using HostListener to Listen to Host Events | ||
| Using HostBinding to Bind to Host Properties | ||
| Binding to Directive Properties | ||
| Building a Structural Directive | ||
| Understanding ngSwitch | ||
| 6. | Using Services and Dependency Injections (45 Minutes) | Why would you Need Services |
| Creating a Logging Services | ||
| Injecting the Logging Service into Components | ||
| Creating a Data Service | ||
| Understanding the Hierarchical Injector | ||
| How many Instances of Service Should It Be | ||
| Using Services for Cross-Component Communication | ||
| Injecting Services into Services | ||
| 7. | Changing Pages with Routing (2 Hour 18 Minutes) | Why do we need a Router |
| Setting up and Loading Routes | ||
| Navigating with Router Links | ||
| Understanding Navigation Paths | ||
| Styling Active Router Links | ||
| Navigating Programmatically | ||
| Using Relative Paths in Programmatic Navigation | ||
| Passing Parameters to Routes | ||
| Fetching Route Parameters | ||
| Passing and Retrieving Query Parameters and Fragments | ||
| Setting up Child (Nested) Routes | ||
| Redirecting and Wildcard Routes | ||
| An Introduction to Guards | ||
| Protecting Routes and Child (Nested) Routes with canActivate | ||
| Using a Fake Auth Service | ||
| Controlling Navigation with canDeactivate | ||
| Resolving Dynamic Data with the resolve Guard | ||
| Understanding Location Strategies | ||
| 8. | Understanding Observables (45 Minutes) | Introduction to Observables and Installing RxJS |
| Analyzing Angular Observables | ||
| Getting Closer to the Core of Observables | ||
| Building a Custom Observable | ||
| Errors & Completion | ||
| Understanding Operators | ||
| 9. | Handling Forms in Angular Apps (2 Hour 03 Minutes) | Why do we Need Angular’s Help |
| Template-Driven (TD) vs Reactive Approach | ||
| TD: Creating the Form and Registering the Controls | ||
| TD: Submitting, Using, and Understanding the Form | ||
| TD: Accessing the Form with @ViewChild | ||
| TD: Adding Validation to check User Input | ||
| Built-in Validators & Using HTML5 Validation | ||
| TD: Using the Form State | ||
| TD: Using Form Data | ||
| Introduction to the Reactive Approach | ||
| Reactive: Setup and Creating a Form in Code | ||
| Reactive: Syncing HTML and Form and Submitting the Form | ||
| Reactive: Adding Validation and Getting Access to Controls | ||
| Fixing a Bug | ||
| Reactive: Arrays of Form Controls (FormArray) | ||
| Reactive: Creating Custom Validators | ||
| Reactive: Using Error Codes | ||
| Reactive: Creating a Custom Async Validator | ||
| Reactive: Reacting to Status or Value Changes | ||
| Reactive: Setting and Patching Values | ||
| 10. | Using Pipes to Transform Output (37 Minutes) | Introduction & Why Pipes are Useful |
| Using Pipes | ||
| Parametrizing Pipes | ||
| Where to learn more about Pipes | ||
| Chaining Multiple Pipes | ||
| Creating a Custom Pipe | ||
| Parametrizing a Custom Pipe | ||
| Pure and Impure Pipes (or: How to “fix” the Filter Pipe) | ||
| Understanding the “async” Pipe | ||
| 11. | Making HTTP Requests (1 Hour 41 Minutes) | A New IDE and Module Introduction |
| How does an Angular Interact With Backends | ||
| The Anatomy of an HTTP Request | ||
| Backend (Firebase) Setup | ||
| Sending a POST Request | ||
| Using RxJS Operators to Transform Response Data | ||
| Services & Components Working Together | ||
| Sending a DELETE Request | ||
| Error Handling | ||
| Using the catchError Operator | ||
| All About Interceptors | ||
| 12. | Authentication and Route Protection in Angular (2 Hours 12 Minutes) | Introduction and Working of Angular |
| Adding the Auth Page | ||
| Switching between Auth Modes | ||
| Handling Form Input | ||
| Preparing the Backend | ||
| Preparing and Sending the SignUp Request | ||
| Adding a Loading Spinner & Error Handling Logic | ||
| Sending Login Requests | ||
| Reflecting the Auth State in the UI | ||
| Adding Logout | ||
| 13. | Dynamic Components (39 Minutes) | Module Introduction |
| Adding an Alert Modal Component | ||
| Understanding the Different Approaches | ||
| Using ngIf | ||
| Preparing Programmatic Creation | ||
| Creating a Component Programmatically | ||
| Understanding entryComponents | ||
| Data Binding & Event Binding | ||
| 14. | Angular Modules and Optimizing Angular Apps (1 Hour 39 Minutes) | What are Modules |
| Analyzing the AppModule | ||
| Getting Started with Feature Modules | ||
| Splitting Modules Correctly | ||
| Adding Routes to Feature Modules | ||
| Component Declarations | ||
| Understanding Shared and Core Modules | ||
| Adding an Auth Feature Module | ||
| Understanding Lazy Loading | ||
| Loading Services Differently | ||
| 15. | Deploying an Angular App (18 Minutes) | Module Introduction |
| Deployment Preparation & Steps | ||
| Using Environment Variables | ||
| Deployment Example: Firebase Hosting | ||
| Server Routing vs Browser Routing | ||
| 16. | Angular Animations (39 Minutes) | Making Animations Work with Angular 4+ |
| Setting up the Starting Project | ||
| Animations Triggers and State | ||
| Switching between States | ||
| Transitions | ||
| Advanced Transitions | ||
| Transition Phases | ||
| The “void” State | ||
| Using Keyframes for Animations | ||
| Grouping Transitions | ||
| Using Animation Callbacks | ||
| 17. | Adding Offline capabilities with Service Workers (27 Minutes) | Module Introduction |
| Adding Service Workers | ||
| Caching Assets for Offline Use | ||
| Caching Dynamic Assets & URLs | ||
| 18. | A Basic Introduction to Unit Testing in Angular Apps (45 Minutes) | Why Unit Tests |
| Analyzing the Testing Setup (as created by the CLI) | ||
| Running Tests (with the CLI) | ||
| Adding a Component and some fitting Tests | ||
| Testing Dependencies: Components and Services | ||
| Simulating Async Tasks | ||
| Using “fakeAsync” and “tick” | ||
| Isolated vs Non-Isolated Tests | ||
| 19. | Angular as a Platform and Closer Look at CLI (1 Hour 07 Minutes) | A Closer Look at “ng new” |
| IDE & Project Setup | ||
| Understanding the Config Files | ||
| Important CLI Commands | ||
| The “angular.json” File – A Closer Look | ||
| Introduction to Angular Semantics | ||
| The “ng add” Command | ||
| Using Custom “ng generate” Schematics | ||
| Smooth Updating of Projects with “ng update” | ||
| Simplified Deployment with “ng deploy” | ||
| Understanding “Differential Loading” | ||
| Managing Multiple Projects in One Folder | ||
| An Introduction to Angular Libraries | ||
| 20. | Angular Changes and New Features (16 Minutes) | A First Look At Angular Elements |
| 21. | Bonus Lectures | — |
| 22. | Projects | — |
Resources Required
- NO Angular 1 or Angular 2+ knowledge is required!
- Basic HTML and CSS knowledge are not compulsory but will help
- Prior TypeScript knowledge are not mandatory but helpful
- Basic JavaScript knowledge is required
Comparison Table
| Parameters | Angular – The Complete Guide (2023 Edition) | The Complete Node.js Developer Course (3rd Edition) | Angular & NodeJS – The MEAN Stack Guide [2023 Edition] |
|---|---|---|---|
| Offers | INR 455 ( | INR 455 ( | INR 455 ( |
| Duration | 34 Hours | 35 Hours | 12.5 Hours |
| Rating | 4.6/5 | 4.6/5 | 4.6/5 |
| Student Enrollments | 5.78 lakhs | 2.71 lakhs | 1.10 lakhs |
| Instructors | Maximilian Schwarzmüller | Andrew Mead, Rob Percival | Maximilian Schwarzmüller |
| Level | Intermediate (Prior JavaScript Knowledge is required) | Beginner | Intermediate (Prior Angular Knowledge is required) |
| Topics Covered | Angular, JavaScript, TypeScript, HTML | Node JS, Express, MongoDB, Jest | Connect an Angular Frontend to a NodeJS & Express & MongoDB Backend |
| Coding Exercises | Yes | No | No |
| Projects | Yes | No | Yes |
| Register Here | Apply Now! | Apply Now! | Apply Now! |
| Compare Similar Courses | 2023 Complete Python Bootcamp From Zero To Hero In Python | The Complete JavaScript Course 2023 from Zero to Expert | Learn Ethical Hacking From Scratch |
| Mastering Data Structures & Algorithms using C and C++ | Build Responsive Real-World Websites with HTML and CSS | The Ultimate MySQL Bootcamp: Go from SQL Beginner to Expert |
Student Reviews
Check out the student reviews for the Angular – The Complete Guide course.
- Neeraj (5.0/5): “I am working as a System Engineer full time. This course really helped me to switch my profile to Angular developer. This is recommended to all those who want to move from beginner to advanced. Assignments are really helpful to grasp concepts. Initial module concepts are used in later sections to help to revise previous concepts. Thus, saving time from revision. Waiting for another course to start backend with the latest technology… Thanks, Max.”
- Andrei M. (5.0/5): “Very good course! I will recommend this course to everyone who wanna learn Angular from zero. On the bonus Universal part, I was a bit confused because is a bit updated, but is a bonus lecture! Also, all main projects and lectures are UPDATED, from here all five stars as well! Thank you for a GREAT EXPERIENCE!”
- Sayyidath Ayishath Jafnath T. (5.0/5): “The best course I have ever done…I will recommend this course to everyone who is interested in angular…Worth studying…Now…by completing the course I’m very confident in angular…Thanks for the instructor…”
- Giuseppe B (5.0/5): “Even if in the beginning, you are struggling, don’t give up! The course is really FULL of information and I needed to watch it more than once. After I finished the course, I was unsure of what I actually have learned. BUT… I tried to create my own project and I had to rewatch again and again the single parts of this well-structured course, and I found them more and more useful. Definitely, I understood that it is really well explained respecting what you can find on the web. Therefore, my advice is to watch all of it on your own time. Then, plan your own project and try to apply the parts of this course you have learned.”
- Phillipe C. (5.0/5): “Awesome. Every module starts from a topic that everyone can understand easily, even me who is come from non-computer science background.”
- Cristian A (4.5/5): “A well-structured course with each concept explained in great detail by an engaging instructor and assignments to properly grasp said concepts.”
- Josh M. (4.0/5): “I wanted to wait until I completed the course to leave a review and now here I am. Overall, I think this course is very well put together and leaves no stone unturned in learning Angular. The instructor, Max, is very knowledgeable and enthusiastic when it comes to Angular. I think this course can be separated into some pros and cons. PROS: The basics of Angular are introduced in a meaningful way and there are accompanying assignments to solidify the learning of the material. The course modules are generally quite compact. This allows for the segmenting of learning and being able to learn new concepts in small, digestible sections. Max is very knowledgeable when it comes to Angular which is greatly beneficial for this course. Concepts are further solidified through the course project, a recipe book/shopping list project, and this project is added to throughout the course with new things that are learned. CONS: It seems like the last 10(ish) sections are very rushed and the course goes from being more informational with explanations to just a code along with a tutorial. This is not all that bad, however, sometimes within these sections, Max goes very fast and it is hard to follow without pausing multiple times to get up to speed. It leads to a lot of things being implemented without fully understanding what is going on. Due to this, I think it is necessary to, at the end of the course, go back and read your code line by line to really grasp what it is that is going on. While the concepts that are explained are explained well, for the most part, I think it is necessary to look for external sources (YouTube, Angular docs, etc.) for additional information/explanations. This is not necessarily a con, however, with this course being titled “The Complete Guide” I expected some of the explanations to be a lot easier to understand. There are basically no assignments after section 17. I think that the assignments earlier in the course were what challenged me to stay fully engaged and implement my own solutions. After section 17, the course slowly shifts (as stated above) into a code along with a tutorial that focuses on the course project. While Max challenges you to complete certain tasks during this portion on your own, it becomes increasingly more difficult because the bulk of these sections is just copying what he codes and so there is not a strong solidification of what is going on. There should definitely be an assignment (or even 2) in each section. I can’t say this for every lecture, but for some of the ones I saw, the Q&A section usually already had someone that had asked about an error that I would get. The part that was slightly annoying was that a lot of the time, the response would be a copy/paste response that said “Compare your code to Max’s and find where it differs” without many indications of a possible place to start debugging the code on your own. That is what really gave me the “code along with tutorial” vibe. Regardless of this course’s cons, it is well worth the money if you are an Angular beginner and want to get up to speed on the framework. Although the course states it has 34 hours of content, I easily spent over 60 hours taking it all in, which makes it well worth it to me. I think people purchasing this course should use it as a resource for learning and finding other resources to fully understand Angular. I do not think you will leave this course an Angular master (which should not be expected) but you will leave it with WAY more knowledge of the framework and the ability to start creating your own Angular projects.”
- Chaitanya (4.0/5): “well some concepts bit confusing should watch 2 times to understand, a bit faster but fine”
- Veloxnet Multimédia Kft. H. (3.5/5): “I really enjoyed the first part of the course, I think I understood everything there. But then when we dived deep into async programming (map, tap, observables…etc.) sometimes I felt really lost. I think the explanations could be better there. Yes, that’s what I missed sometimes during this course: better and cleaner explanations! You can usually find these better explanations, but unfortunately, those are usually in the comment section, not in the lectures. I also want to thank you for answering all my questions throughout the course. Thank you very much, Jost! Probably I will have to go through this course a second time as well/repeat the lectures, to understand things better.”
- Mark G. (3.0/5): “Max doesn’t update his courses often enough. Poor support in Q&A for the most part. The lame excuse of they can’t debug a user’s code is used to sometimes not even make an effort to help students out with simple issues that other students are encountering. The standard line of “compare your code to Max’s” doesn’t count for simple issues that many other students are encountering. These simple issues could oftentimes be eliminated if Max would just update his courses more often. Update your course, Max!!!!”
Similar Udemy Courses
Angular – The Complete Guide (2023 Edition): FAQs
Ques. What is the fee for the course?
Ans. The course is originally priced at INR 3,499 but is currently available for INR 455.
Ques. What will I learn in the course?
Ans. You will learn front-end web development, JavaScript, creating apps using Angular, and more.
Ques. What is the duration of the course?
Ans. The duration of the course is 34 hours.
Ques. Is there a certification from Udemy?
Ans. Yes, you will get a certificate of completion from Udemy.
Ques. What is the rating?
Ans. It is rated 4.6 out of 5.
Ques. Do I have lifetime access to this course?
Ans. Yes, you can access this course for a lifetime on mobile or TV.
Ques. Can I access the course on mobile devices, laptops, and TV?
Ans. Yes, you can access the course on mobile devices, laptops, and TV.
Leave feedback about this