AngularJS Authentication: Secure Your App with Auth0
4.4 (1,175 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
24,500 students enrolled
Wishlisted Wishlist

Please confirm that you want to add AngularJS Authentication: Secure Your App with Auth0 to your Wishlist.

Add to Wishlist

AngularJS Authentication: Secure Your App with Auth0

Learn how to add JSON Web Token authentication to your AngularJS app
4.4 (1,175 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
24,500 students enrolled
Created by Ryan Chenkie
Last updated 4/2016
Price: Free
  • 1 hour on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Secure AngularJS applications with JSON Web Tokens
  • Set up JWT middleware on a NodeJS (Express) app
  • Make authenticated HTTP requests from an AngularJS
  • Create a user profile area with their avatar
  • Redirect to a login route when the user becomes unauthenticated
  • Apply multi-factor authentication to add additional security
  • Login with social providers like Google and Twitter
View Curriculum
  • Basic HTML, CSS, and JavaScript
  • Basic AngularJS
  • General knowledge of single page applications

Authentication for traditional web applications is fairly straight-forward: we send our credentials to the server, a session is created, and a cookie is returned to be saved in the browser. This method works well for round-trip applications, but it isn't a good way to do authentication in modern single page apps, like those built with AngularJS.

In this course we are going to learn about the challenges associated with traditional authentication and how to use what is arguably the best alternative: the JSON Web Token.

Using that knowledge, we'll implement authentication in an AngularJS app that makes calls to an Express API. We'll cover how to address all the challenges associated with keeping a single page application in check when it comes to stateless authentication. This can be a tricky matter since the front end and backend apps are effectively separated, but we'll find out how to leverage our user's JWT to address the challenges.

We'll use Auth0 as an identity and authentication server so that we don't have to roll our own.

Who is the target audience?
  • AngularJS beginners to experts
  • NodeJS beginners
  • Web developers of all levels
Students Who Viewed This Course Also Viewed
Curriculum For This Course
13 Lectures
2 Lectures 01:39

Thanks for taking the course! I'm Ryan, and I want to teach you how to secure your AngularJS application with JSON Web Tokens.

Hey there!

Let's take a look at the application we'll build and where you can get the source code.

Final Project Walkthrough and Course Files
Web Application Authentication Background
3 Lectures 13:11

Traditional session-based authentication for web applications has worked well up until now, but there are limitations to this approach when building single page applications. Let's look at how traditional authentication works and the associated problems.

Traditional Authentication

Adding authentication to AngularJS apps can be tricky. Let's look at what the challenges are and how we can solve them.

The Tricky Parts of AngularJS Authentication

JSON Web Token (JWT) is an open standard for transmitting claims securely. This means it can be used as an authentication mechanism, and it turns out that it's the perfect way to authenticate an AngularJS app.

JSON Web Tokens
Setting Up the App
2 Lectures 22:53

To add authentication to our AngularJS app we need to be able to issue JSON Web Tokens. We could write the code to do this ourselves, but Auth0 does it for us for free. Let's register and configure our account.

Signing Up for Auth0

We need an AngularJS application to add authentication to. Let's set up a simple app that will have a home and profile route.

Setting Up the AngularJS App
Setting Up Authentication in AngularJS
3 Lectures 23:26

We need some methods for allowing users to log in and log out. Let's create those methods and use them to call Auth0's Lock widget so that we can retrieve a JWT for the user.

Login and Logout

Since the AngularJS app is stateless with respect to the backend, whenever we refresh the page, the user's authentication status will be lost. Let's set up some logic to fix this.

Preserving Authentication on the Front End

What happens if the user sends a request with an invalid JWT that gets rejected by the server? Ideally we should redirect them to the spot they login from automatically. Let's set up some logic to handle that.

Redirecting on Invalid Requests
Additional Features
3 Lectures 07:22

Many people prefer to authenticate into an application using a social identity provider. Let's see how we can easily set up Twitter as a social provider.

Enabling Social Login

Multi-factor authentication can strengthen our application's security in a big way. Let's see how we can apply it to our authentication flow.

Enabling Multi-Factor Authentication

Thanks for taking the course!

Wrapping Up
About the Instructor
Ryan Chenkie
4.4 Average rating
2,338 Reviews
32,300 Students
3 Courses
Full-Stack Developer

Ryan is a full-stack JavaScript developer and works mostly with Angular and Node. He's a Google Developer Expert, Product Owner at Auth0, and also runs, a screencast site offering end-to-end Angular and JavaScript training.

When he's not coding, Ryan is hanging out with his wife, playing guitar, or nerding out about outer space.