Development
Web Development
AngularJS
Learn and Understand AngularJS
4.4 (18,603 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
83,282 students enrolled

Learn and Understand AngularJS

Master AngularJS and the Javascript concepts behind it, design custom directives, and build a single page application.
Bestseller
4.4 (18,603 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
83,282 students enrolled
Created by Anthony Alicea
Last updated 12/2015
English
English, French [Auto-generated], 7 more
  • Indonesian [Auto-generated]
  • Italian [Auto-generated]
  • Polish [Auto-generated]
  • Portuguese [Auto-generated]
  • Romanian [Auto-generated]
  • Spanish [Auto-generated]
  • Thai [Auto-generated]
Preview this course
Learn and Understand AngularJS
Current price: $121.99 Original price: $174.99 Discount: 30% off
5 hours left at this price!
Buy now
30-Day Money-Back Guarantee
This course includes
  • 7 hours on-demand video
  • 5 articles
  • 33 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Learn fundamental Javascript concepts that power AngularJS.
  • Write quicker, better AngularJS code by discovering how AngularJS itself is built.
  • Become fluent in AngularJS terminology, such as dependency injection, services, directives, transclusion, and more.
  • Realize the power of dependency injection, and how AngularJS accomplishes it.
  • Design custom directives and save time and energy with easily reusable components.
  • Understand what a Single Page Application (SPA) is, and how they work.
  • Build a Single Page Application (SPA) in AngularJS.
  • Be the coder that explains AngularJS to everyone else, because you understand it better than anyone else.
  • Get new free lectures during 2015, keep up with the development of AngularJS 2.0, and get a MASSIVE discount on a future AngularJS 2.0 course in 2016!
Course content
Expand all 55 lectures 06:54:45
+ – Getting Started
3 lectures 04:15

A brief overview of what you'll learn in this course.

Introduction
Preview 02:30

How we'll call out vocabulary you need to know during this course.

Big Words and AngularJS
01:20

The course is best experienced in High Definition. Here's how to make sure you're watching it that way.

Watching this Course in High Definition
00:25
+ – Model, View, Whatever...
6 lectures 29:19

When building large applications with tools like jQuery, what kind of problems does AngularJS aim to help solve?

The Problem(s) AngularJS is Trying to Solve
Preview 06:03

The fundamental structural concepts that AngularJS is built on: MVC, MVVM, MV*.

Model, View, Whatever…
Preview 02:48

HTML has attributes that the browser knows about, and knows what to do with. However we can take advantage of custom attributes, and store whatever information we desire in our HTML.

HTML Aside: Custom Attributes
Preview 05:23

What is 'polluting the global namespace', and why is it bad? How do we avoid it?

Javascript Aside: The Global Namespace
Preview 05:12

Most of the rest of the lectures in this course will come with source code. Here's how to grab it.

Downloading Source Code for This Course
Preview 00:33

AngularJS enables you to control the DOM via modules, apps, and controllers -- all without polluting the global namespace.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Modules, Apps, and Controllers
Preview 09:20
+ – Services and Dependency Injection
7 lectures 51:27

A coding concept that AngularJS relies on. What is dependency injection?

Javascript Aside: Dependency Injection
Preview 04:45

A look at our first AngularJS service. The incredibly important concept of scope.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

The Scope Service
Preview 04:56

In Javascript, just about everything is a function. But functions can be converted to strings.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Javascript Aside: Functions and Strings
Preview 04:01

How does AngularJS accomplish dependency injection? Understanding how will help you use it correctly.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

How Does Angular Do Dependency Injection?
Preview 03:03

There are lots of services built into AngularJS, but even more available outside it. How can you easily get and use other AngularJS services?

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Getting Other Services
Preview 20:27

Javascript arrays are loosely typed. They can contain just about anything. Even functions.

Javascript Aside: Arrays and Functions
Preview 03:05

AngularJS controllers need to survive minification. Here's how AngularJS accomplishes that.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Dependency Injection and Minification
Preview 11:10
+ – Data Binding and Directives
8 lectures 01:30:35

Our first visual AngularJS code. Now that we understand scope, let's use it to output content to a page.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Scope and Interpolation
09:58

One of the best parts of AngularJS is two way data-binding via directives. Here we'll give it a try.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Directives and Two Way Data Binding
13:13

AngularJS relies on the Javascript event loop. What does that mean?

Javascript Aside: The Event Loop
03:21

AngularJS extends the Javascript event loop, and adds watchers and something called the digest loop. Let's examine it.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Watchers and the Digest Loop
17:28

Let's discuss some directives you'll use all the time in your AngularJS apps.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Common Directives
19:51

Let's look at even more AngularJS directives.

Common Directives (Part 2)
04:13

Here we'll talk about a core concept vital to all modern web applications.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Javascript Aside: The XMLHTTPRequest Object
09:14

Here we'll talk about a sending and getting data to and from a server via the AngularJS http service.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

External Data and $http
13:17
+ – Single Page Applications
4 lectures 34:27

Up to now we've only seen one controller with one view. But AngularJS allows for more than that.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Angular Aside: Multiple Controllers, Multiple Views
04:37

What is the hash, and why is it so useful for single page applications?

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

HTML and Javascript Aside: Single Page Apps and the Hash
08:47

How AngularJS uses the hash to help us build single page applications. This is all about AngularJS routing.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Routing, Templates, and Controllers
14:37

Our breakdown of AngularJS routing and single page applications continues.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Routing Templates and Controller (Part 2)
06:26
+ – Custom Services
2 lectures 19:08

To understand AngularJS services, you have to understand the concept of singletons. What is a singleton anyway?

Javascript Aside: Singletons
06:09

We'll create our first AngularJS custom service, and use it in our single page application.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Creating a Service
12:59
+ – Custom Directives
11 lectures 01:31:04

HTML5 has introduced a concept that isn't fully flushed out, but important to understand: Web components.

HTML Aside: Reusable Components
02:24

AngularJS does some interesting things with attribute and variable names. Why, and what do you need to know?

Javascript and Angular Aside: Variable Names and Normalization
06:32
Angular and Normalized Attribute Names
1 question

We create our first custom directive in AngularJS, and understand the syntax behind it.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Creating a Directive
18:37

What if our directive template gets large? Here's what to do using the 'templateUrl' property of our custom directive.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Templates
03:12

We dive into isolated scope in AngularJS custom directives. We'll start with @ and one-way text bindings.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Scope (@, =, and other obtuse symbols)
13:29

More about isolated scope in AngularJS custom directives. We discuss = and two-way bindings.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Scope (@, =, and other obtuse symbols) (Part 2)
05:59

We finish up isolated scope in AngularJS custom directives, and talk about & and functions.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Scope (@, =, and other obtuse symbols) (Part 3)
10:27

Using a custom directive inside an ng-repeat.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Repeated Directives
03:30

What does 'compile' mean (and do) in an AngularJS custom directive? And what about pre-link and post-link?

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Understanding 'Compile'
18:06

What does the 'link' property mean in an AngularJS custom directive?

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Understanding 'Link'
03:04

We dig into the word 'transclusion', and understand what it means in AngularJS custom directives.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Understanding Transclusion
05:44
+ – Let's Build an App (in record time!)
7 lectures 58:45

It's time to start our first, full-featured AngularJS single page application. Let's build a weather forecast app!

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

A Weather Forecast SPA
12:48

We add a custom service to our weather forecast AngularJS single page application.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

A Custom Service
05:17
A Note Regarding API Usage
00:38

We add some data to our weather forecast AngularJS single page application, by retrieving it from an API!

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Binding Data (Part 1)
18:07

We continue adding data to our weather forecast AngularJS single page application.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

Binding Data (Part 2)
Preview 07:40

We convert some of our code into a custom directive, reusable inside our AngularJS single page application.

This lecture contains downloadable source code. Download the file below and unzip (or extract) it.

A Custom Directive
13:43

A quick personal side note, less than 60 seconds, on leaving a course review.

A Side Note
00:32
+ – BONUS Lectures
3 lectures 24:10

We'll help the UX of our SPA by coding the app to respond to the 'enter' key instead of just clicking a button. We'll do this with the help of ng-submit.

Improving our SPA's UX With ng-submit
06:05

We'll improve the architecture of our SPA by pulling the API call portion of the code into it's own custom service.

Designing Services in Large AngularJS Applications
07:16

The popular alternative to $scope, 'controller as', and when and why to use it.

Nested Controllers, Clean Code, and 'Controller as' (an alternative to $scope)
10:49
+ – Getting Ready for AngularJS 2.0 in 2016
2 lectures 08:33

The first update on how to be ready for AngularJS 2.0 in 2016 and beyond.

Update #1 - ES6, AtScript, and more
08:12
Update #1 - Links
00:21
Requirements
  • A browser and a text editor
  • Basic HTML and Javascript knowledge
Description

Includes information on the next version - AngularJS 2.0!

Knowing AngularJS can get you a job or improve the one you have. It's a skill that will put you more in demand in the modern web development industry, and make your web software life easier, that's why it's so popular and backed by Google.

This course will get you up and running quickly, and teach you the core knowledge you need to deeply understand and build AngularJS applications - and we'll build a single page application along the way.

We'll design custom services, build custom directives, understand two-way binding, design a weather forecast app as a single page application, and lots more. Both starter and finished source code is provided as we go.

Reviews

"Best course I have ever seen" "Best intro to AngularJS on Udemy" "A fresh way of teaching AngularJS" "One of the best courses on Udemy that i took if not the best" "Best teacher I have had on the internet by far" "I...have taken lots of angular courses and I think this is the best one so far" "The best teaching style I've seen so far"

If you are new to AngularJS, or if you've been working to learn it but sometimes feel like you still don't quite 'get it', this is the AngularJS course for you! To learn AngularJS you have to understand it.

I've built the course that I would have wanted to take when I was learning AngularJS. A course that explains the concepts and how they're implemented in the best order for you to learn and deeply understand them.

In this course you will:

  • Learn how AngularJS works, covering subjects like directives, dependency injection, two way data binding, the digest loop, watchers, and more.
  • Learn fundamental Javascript and HTML principles that are used by AngularJS, such as custom attributes, loosely typed arrays, the hash, and the event loop.
  • Code custom services.
  • Design custom directives, understanding concepts like compile, link, and scope.
  • Build a single page application using AngularJS.
  • Keep up with the latest on the next version of AngularJS 2.0!

AngularJS doesn't have to be hard to learn. The biggest mistake most coding tutorials make is expecting someone to learn simply by imitating others' code. Real world situations are never exactly like the tutorial.

I believe the best way to learn is to understand how a tool works and what it does for you, look at examples, and then try it yourself. That's how this course is built, with the goal to help you both learn and understand AngularJS.

Note: In this course you'll also get downloadable source code. You will often be provided with 'starter' code, giving you the base for you to start writing your code, and 'finished' code to compare your code to.

Who this course is for:
  • Web developers and designers looking to learn AngularJS
  • Those who have researched AngularJS but still find it hard to understand
  • Developers and designers who have used jQuery but are tired of doing everything manually
Featured review
Tim Newton
Tim Newton ( 52 courses, 28 reviews )
a year ago
I really appreciate that the author is giving us an understanding of the underlying functionality of AngularJS and what JavaScript/HTML components are utilized behind the scenes. This will help in future debugging.