Angular - The Complete Guide (2024 Edition)
- Descrição
- Currículo
- FAQ
- Revisões
June 17th 2024: Big update released!
The entire course was re-recorded from scratch and was therefore completely updated! It’s now 100% up-to-date with the latest version of Angular again, covering crucial modern features like signals, standalone components etc.
Many new deep-dive sections on these core topics were added, hence ensuring that you learn ALL about modern Angular in-depth. In addition, the course also still covers older Angular versions & syntax, so that you get the most out of this course, no matter with which Angular version you’re working.
May 23rd 2024: New “Essentials” Sections!
Brand-new “Essentials” sections were added, covering modern Angular (incl. standalone components, signals, new control flow & more) from the ground up.
This course therefore once again teaches modern Angular, whilst also teaching “older” Angular features since many projects are still stuck on old Angular versions. With this course, you’ll be ready to work with Angular, no matter which version you might be using in your next project!
—
Join the most comprehensive and bestselling Angular course on Udemy and learn all about this amazing framework from the ground up, in great depth!
This course starts from scratch, you neither need to know Angular 1 nor Angular 2 or any other Angular version!
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 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 2+) 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 send HTTP requests (e.g. to REST APIs)
-
What dependency injection is and how to use it
-
How to use modules in Angular
-
How to optimize your (bigger) Angular applications
-
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!
-
1Welcome To The Course!
Let me introduce you to this course and give a rough outline over what you're going to learn!
-
2What Exactly Is Angular?
So many Angular versions! What's up with them and which version does this course cover?
-
3Why Would You Use Angular?
Enough of the talking, let's create our first Angular project and view our first app in the browser.
-
4Angular's Evolution & Stability
-
5Creating A New Angular Project
-
6Setting Up An Angular Development Environment
Let's edit our first app!
-
7About This Course
Enough of the talking, let's create our first Angular project and view our first app in the browser.
-
8Course Setup & Resources
-
9Module Introduction
-
10A New Starting Project & Analyzing The Project Structure
-
11Understanding Components & How Content Ends Up On The Screen
-
12Creating a First Custom Component
-
13[Optional] JavaScript Refresher: Classes, Properties & More
-
14Configuring the Custom Component
-
15Using the Custom Component
-
16Styling the Header Component & Adding An Image
-
17Managing & Creating Components with the Angular CLI
-
18Styling & Using Our Next Custom Component
-
19Preparing User Data (To Output Dynamic Content)
-
20Storing Data in a Component Class
-
21Outputting Dynamic Content with String Interpolation
-
22Property Binding & Outputting Computed Values
-
23Attribute Binding
-
24Using Getters For Computed Values
-
25Listening to Events with Event Binding
-
26Managing State & Changing Data
-
27A Look Behind The Scenes Of Angular's Change Detection Mechanism
-
28Introducing Signals
-
29We Need More Flexible Components!
-
30Defining Component Inputs
-
31Required & Optional Inputs
-
32Using Signal Inputs
-
33We Need Custom Events!
-
34Working with Outputs & Emitting Data
-
35Using the output() Function
-
36Adding Extra Type Information To EventEmitter
-
37Exercise: Create a Configurable Component
-
38TypeScript: Working With Potentially Undefined Values & Union Types
-
39Accepting Objects As Inputs & Adding Appropriate Typings
-
40TypeScript: Type Aliases & Interfaces
-
41Outputting List Content
-
42Outputting Conditional Content
-
43Legacy Angular: Using ngFor & ngIf
-
44Adding More Components to the Demo App
-
45Outputting User-specific Tasks
-
46Outputting Task Data in the Task Component
-
47Storing Data Models in Separate Files
-
48Dynamic CSS Styling with Class Bindings
-
49More Component Communication: Deleting Tasks
-
50Creating & Conditionally Rendering Another Component
-
51Managing The "New Task" Dialog
-
52Using Directives & Two-Way-Binding
-
53Signals & Two-Way-Binding
-
54Handling Form Submission
-
55Using the Submitted Data
-
56Content Projection with ng-content
-
57Transforming Template Data with Pipes
-
58Getting Started with Services
-
59Getting Started with Dependency Injection
-
60More Service Usage & Alternative Dependency Injection Mechanism
-
61Time to Practice: Services
-
62Using localStorage for Data Storage
-
63Module Summary
-
64Module Introduction
-
65A First Introduction To Angular Modules (NgModule)
-
66Creating a First Empty Module
-
67Bootstrapping Apps with Angular Modules
-
68Declaring & Using Components
-
69A First Summary
-
70Migrating All Components To Use Modules
-
71Creating & Using Shared Modules
-
72Creating More Complex Module-based App Structures
-
73Module Introduction & Starting Project
-
74Exercise Hints
-
75Adding a Header Component With An Image
-
76Adding a User Input Component
-
77Handling Form Submission
-
78Extracting Values with Two-Way-Binding
-
79Calculating the Annual Investment Data
-
80Cross-Component Communication with Outputs
-
81Creating & Using a Data Model
-
82Passing Data from Parent to Child with Inputs
-
83Outputting Data in a Table
-
84Formatting Output with a Pipe
-
85Using Signals & Resetting The Form After Submission
-
86Using a Service for Cross-Component Communication
-
87Using Signals in Services
-
88Migrating to Angular Modules
-
89Module Summary