CF

Complete Angular 2 JS

18h 50m 51s
English
Paid

Welcome to the most comprehensive Angular 2 course available online! This course is designed to give you a complete understanding of Angular 2, from installation to deployment of mini projects. If you're ready to dive into the world of Angular 2, this course is for you.

What You Will Learn

This course will cover a wide range of topics to equip you with all the necessary skills to excel in Angular 2 development:

  • Components: Learn how to build the building blocks of any Angular application.
  • Directives: Understand the powerful ways to manipulate the DOM.
  • Services: Master the art of writing reusable business logic.
  • Forms: Gain proficiency in creating and managing reactive forms.
  • Authentication: Implement secure authentication mechanisms in your applications.

Hands-on Experience

By the end of the course, you will know how to deploy a fully-functional Angular application. But that's not all! You'll also learn how to leverage the Angular 2 CLI in real-world projects, ensuring you can quickly apply the knowledge you've gained.

Why Learn Angular 2?

Angular 2 is nearing its release phase, providing an opportunity for you to stay ahead in the tech landscape. Don't miss out on exploring its benefits and becoming one of the pioneering developers to implement its features.

About the Author: Udemy

Udemy thumbnail

Udemy is the largest open marketplace for online courses on the internet. Founded in 2010 by Eren Bali, Oktay Caglar, and Gagan Biyani and headquartered in San Francisco, the company went public on the Nasdaq in 2021 under the ticker UDMY. The platform hosts well over two hundred thousand courses across software development, IT and cloud, data science, design, business, marketing, and creative skills, taught by tens of thousands of independent instructors. Roughly seventy million learners use it worldwide, and the corporate arm — Udemy Business — supplies a curated subset of that catalog to enterprise customers.

Because Udemy is a marketplace rather than a single editorial publisher, the catalog is uneven by design. The strongest material lives in the long-form, project-based courses authored by working engineers — full-stack JavaScript, React, Node.js, Python data science, AWS, Docker and Kubernetes, mobile development with Flutter and React Native, and cloud certification preparation. The CourseFlix listing under this source is the slice of that catalog that has been mirrored here for offline-friendly viewing, organized by topic and updated as new releases land. Pricing on Udemy itself swings dramatically with the site's near-permanent sales, which is why the platform is best treated as a deep reference catalog: pick instructors with strong reviews and a track record of updating their material rather than buying on the headline price alone.

Watch Online 213 lessons

This is a demo lesson (10:00 remaining)

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

View Pricing
0:00
/
#1: Introduction
All Course Lessons (213)
#Lesson TitleDurationAccess
1
Introduction Demo
01:13
2
What is in Angular2
01:56
3
Creating an Angular 2 Project
03:28
4
Editing our First App
07:38
5
Understanding the Project Structure
02:25
6
Why TypeScript? What is TypeScript?
06:41
7
Getting Started with Components
04:14
8
How an Angular 2 App gets started?
04:17
9
Understanding AppModules
00:51
10
Using Templates & Styles
03:32
11
First Summary
06:59
12
Creating a new Component
03:24
13
About Unique Selectors
06:44
14
Using multiple Components
11:23
15
MUST WATCH - How to proceed with this Course?
06:37
16
View Encapsulation and Styling
08:07
17
Inserting Content with ng-content
05:39
18
Databinding Overview
07:43
19
String Interpolation
12:33
20
Property Binding & Event Binding Overview
09:21
21
Property Binding
03:16
22
Binding to Custom Properties
05:10
23
Event Binding
06:51
24
Binding to Custom Events
05:20
25
More Information on Property & Event Binding
05:59
26
Two-Way Binding
13:31
27
The Component Lifecycle
11:21
28
Component Lifefcycle Usage Examples
07:14
29
Template Access with Local References, ViewChild and ContentChild
01:48
30
Project Setup
15:02
31
IMPORTANT - Required Changes
13:36
32
Creating the Header Component
04:50
33
Creating the Recipes Component
02:21
34
Creating Recipe Model & List Component
14:00
35
Recipe Detail & Databinding
10:15
36
Shopping List Component
02:59
37
What are Directives?
04:21
38
Attribute Directives
03:19
39
Building a Custom Attribute Directive
06:30
40
Element Interaction with HostListener & HostBinding
10:26
41
Directive Property Binding
01:44
42
ngIf
13:51
43
ngFor
12:48
44
ngSwitch
02:21
45
Angular 2's De-Sugaring Mechanism
08:21
46
Building a Custom Structural Directive
08:01
47
Using NgModules
06:46
48
Ingredients List with ngFor
09:33
49
Custom Dropdown Directive
12:46
50
Introduction
06:03
51
Chrome Debugger & Sourcemaps
10:38
52
Augury
02:52
53
What are Services?
04:09
54
Example - Logging Service
14:12
55
What is Dependency Injection?
11:31
56
Example - Injecting the Logging Service
10:28
57
Multiple Instances vs One Instance
03:08
58
Services & AppModules
05:00
59
Using NgModules
07:00
60
Injecting Services into Services
00:56
61
Using Services for Cross-Component Interaction
04:32
62
Course Project - Creating the Recipe Service
10:09
63
Course Project - Creating the Shopping List Service
02:14
64
Course Project - Cross-Service Communication
06:06
65
Course Project - Cleanup
05:59
66
Introduction to the Angular 2 Router
07:59
67
Introduction to the Angular 2 Router
09:11
68
Loading Routes
03:10
69
Navigation with Links
07:12
70
Understanding Navigation Paths
06:51
71
Imperative Routing (Triggered in Code)
04:27
72
Route Parameters
03:25
73
Extracting Route Parameters
08:50
74
Query Parameters
05:51
75
Extracting Query Parameters
01:02
76
Query Parameters and the routerLink Directive
01:43
77
Child Routes
07:13
78
Child Routes
06:09
79
Required Adjustments in this Module
06:55
80
Setting up Project Routes
05:49
81
Adding Navigation
05:25
82
Child Routes
11:53
83
Adding Child Route Navigation
01:45
84
Passing the Recipe ID (Route Parameters)
06:41
85
Updating the Recipe Service
08:11
86
Making it all Work
10:25
87
Styling Active Links
08:03
88
Cleanup
16:55
89
Introduction to Forms in Angular 2
08:46
90
Template-Driven Approach Basics
07:20
91
Registering Controls (Template-Driven)
07:02
92
Finishing Touches
07:37
93
Submitting a Form and Using the Output (Template-Driven)
02:19
94
Form Properties
01:56
95
Input Validation (Template-Driven)
04:56
96
Form State & CSS Classes (Template-Driven)
01:54
97
Default Values with ngModel (Template-Driven)
02:58
98
Two-Way Binding with ngModel (Template-Driven)
02:33
99
Form Groups (Template-Driven)
04:43
100
Radio Button Controls (Template-Driven)
01:59
101
Using the Form State, Providing a better UX (Template-Driven)
02:06
102
The Data-Driven Approach (Intro)
04:20
103
Creating a Form (Data-Driven)
03:23
104
Important Changes with AppModules
01:51
105
Synchronizing HTML and the Angular 2 Form (Data-Driven)
03:38
106
Submitting a Form and Using the Output (Data-Driven)
02:00
107
Input Validation (Data-Driven)
03:12
108
Using the Form State, Providing a better UX (Data-Driven)
01:47
109
Form Groups (Data-Driven)
05:28
110
Radio Buttons (Data-Driven)
02:14
111
Form Arrays, Arrays of Control (Data-Driven)
04:09
112
Creating a Form with the FormBuilder (Data-Driven)
02:28
113
Creating Custom Validators (Data-Driven)
09:50
114
Custom Asynchronous Validators (Data-Driven)
03:14
115
Custom Asynchronous Validators (Data-Driven)
04:52
116
Shopping List Form HTML Setup (Template-Driven)
07:02
117
Adding & Editing Mode
03:08
118
Submitting the Shopping List Form
02:24
119
Selecting Items & Property Binding
01:41
120
Displaying Data with ngModel
04:51
121
Editing Items
06:27
122
Deleting Items & Clearing the Form
03:22
123
Editing & Adding Recipes (Intro)
02:57
124
Recipe Form - Preparation - Fetching the Active Recipe
04:52
125
Creating the Recipe Form with the Data-Driven Approach
02:10
126
Synchronizing the HTML Code with the Form
06:47
127
Submitting the Form and Editing Recipes
10:51
128
Managing Recipe Ingredients
06:44
129
What are Pipes?
06:19
130
Using Pipes
05:44
131
Parametrizing Pipes
01:44
132
Pipe Documentation
02:13
133
Chaining Pipes
03:30
134
Custom Pipes
01:17
135
Example - Creating a Filter Pipe
01:20
136
Using NgModules
05:21
137
'Pure' Pipe Limitations
06:27
138
'Impure' Pipes
00:38
139
The Async Pipe
01:47
140
Required Adjustments in this Module
03:46
141
Http & Observables
03:04
142
Demo Data Source - Firebase Setup
03:01
143
Sending a GET Request
03:28
144
Using NgModules
07:34
145
The Power of Observables Operators - Map (ping Data)
00:54
146
The Power of Observables Operators - Map (ping Data)
04:21
147
Retrieving and Transforming Data with Observables
06:55
148
Using the Async Pipe
06:18
149
Error Handling with Observables
03:29
150
Wrap Up
04:54
151
Http Intro & setup
00:36
152
Storing Recipes on the Server (POST)
01:59
153
Fetching Recipes (GET) and Changing the Storage Method (PUT)
08:39
154
Finishing Touches & Bugfixes
04:10
155
Differences between Course Videos and Angular
05:42
156
NgModule Overview
05:32
157
Required Adjustments in this Module
05:56
158
Introduction
00:52
159
Project Setup
00:58
160
Setting up Routes
03:35
161
Backend (Firebase) Setup
05:02
162
User Signup
04:43
163
User Signin & Managing the User State
05:32
164
User Logout
05:40
165
Protecting a Route from Unauthorized Access
02:47
166
Finishing Touches
04:52
167
Introduction
02:17
168
Using Feature Modules
01:06
169
Creating a Feature Module
03:50
170
Creating a Feature Module for Child Routes
09:08
171
Lazy Loading of Routes
03:50
172
Implementing Lazy Loading
02:26
173
Using Shared Modules
09:39
174
Using a Core Module
05:56
175
Understanding Module Encapsulation
03:11
176
When to use which Module?
04:30
177
Performance and File Size Improvements with Offline (Ahead-of-time) Compilation
02:32
178
VIEW FIRST - About this Section
03:47
179
About the New Project Structure (same Video as in Custom Project Module)
01:35
180
Intro & What to Deploy
01:06
181
Setting up an App for Deployment
03:57
182
Deploying to Github Pages with the Angular 2 CLI
02:04
183
Deploying to Github Pages Manually
02:42
184
Deploying to AWS S3
05:04
185
Intro
09:04
186
Installation
01:20
187
New Project - ng new and ng init
04:08
188
Building your Project - ng build & ng serve
02:35
189
Understanding the Project Structure
06:12
190
Linting your Code - ng lint
01:04
191
Unit Tests - ng test
02:02
192
Managing Project Content - ng generate & ng destroy
06:54
193
Putting it into Production - ng build and ng github-pages
04:02
194
Learning More - ng --help and Wrap Up
01:55
195
Intro
02:28
196
Dependencies & Typings
08:52
197
App Setup & Tsconfig
03:57
198
Gulp
12:07
199
Basic App Code
04:02
200
Typings & External Files
03:25
201
Setting up index.html
03:02
202
Configuring SystemJS
06:52
203
Development Workflow
05:31
204
Linting with the official Styleguide
02:28
205
Production Workflow (Bundling, Minification)
10:25
206
Adding Third Party Packages
12:39
207
Course Roundup
01:02
208
Introduction
02:09
209
Using Types
06:27
210
Classes
04:47
211
Interfaces
05:44
212
Generics
02:44
213
Wrap up & Modules
02:37
Unlock unlimited learning

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

Learn more about subscription

Related courses

Frequently asked questions

What are the prerequisites for enrolling in this Angular 2 course?
Before enrolling in this Angular 2 course, it is recommended that you have a basic understanding of JavaScript, HTML, and CSS. Familiarity with TypeScript is beneficial, as the course covers why TypeScript is used and what it is. A grasp of modern web development concepts will help in comprehending the material more effectively.
What projects will I work on during the course?
Throughout the course, you will work on deploying a fully-functional Angular application. The lessons guide you through creating components, directives, services, and forms, culminating in a mini project that integrates these elements. The course also emphasizes using the Angular 2 CLI to streamline development processes in real-world scenarios.
Who is the target audience for this Angular 2 course?
This course is ideal for web developers who want to expand their skill set with Angular 2, especially those interested in mastering the framework's architecture and building dynamic web applications. It suits both beginners in Angular and those who have experience in earlier versions of Angular seeking to update their skills.
How does the depth of this course compare to other Angular courses?
With 213 lessons, this course offers extensive coverage of Angular 2, from basic concepts to advanced topics such as authentication and custom directives. It provides a thorough understanding of Angular 2's architecture, deployment, and application development, making it more comprehensive than many other introductory courses.
Does the course cover deployment to specific platforms?
The course does not focus on deployment to specific platforms in detail. Instead, it provides a general understanding of deploying fully-functional Angular applications, equipping you with the skills to adapt to various environments and deployment targets.
How much time should I expect to commit to completing this course?
The course comprises 213 lessons, and while the exact runtime isn't specified, prospective students should be prepared to invest significant time to fully engage with the material, complete exercises, and apply concepts in practical projects. A dedicated approach will ensure a thorough comprehension of Angular 2.
Will the skills learned in this course be applicable to other frameworks or technologies?
Yes, the skills learned in this course, such as mastery of components, directives, and services, are transferable to other JavaScript frameworks and modern web development technologies. Understanding Angular 2's architecture and development strategies will provide a strong foundation for learning subsequent versions of Angular and other frameworks.