Creating Apps With AngularJS, Node, and Token Authentication

Register in Front End Views
Hi my name is Alexander Zanfir and in this module we'll start rolling out the Register view inside Angular. We'll begin by setting up the development environment with Angular. Next, we'll learn how to use Yeoman, which auto-generates a lot of the boilerplate code for us. Afterwards, we'll start using UI-Router instead of ngRoute to start working with states instead of your typical routes. And we'll finish off the module by creating our Register view where users can create new accounts.

Register Front End Controllers and Services
Hi my name is Alexander Zanfir. In our last module, we looked at the view, and in this module we'll look at the controller behind the view and some services that the controller will use. We'll start by getting some password verification going with a custom directive. Then we'll make use of that directive inside our register controller. And once our form is valid, we'll make an HTTP post called _____ to send our form data. We will also create our own alert system to notify us of success or failures from our register attempts, but we will continue to use this alert system throughout our entire app.

Register WebAPI JWT Library
My name is Alexander Zanfir and in this module we will continue to develop the remainder of our JWT service features and once we are comfortable with the concepts of our service, we will replace it with a third party JWT library. We'll begin by implementing our logout functionality on the front-end, then we'll try to get access to our jobs resource, which we'll create and we'll improve the greeting upon registering. Next we'll take a quick design break and add in some view animation so that when we change our views or states, the views fade in and out. Afterwards, we'll learn how to secure our jobs resource, then we'll work on an auth interceptor that will inject our JWT token into the header of every request we make. Then, on the back-end we'll learn how to decode that token from our header to see if the user should be authorized to get that resource. Then for some added security, we'll learn how to verify the JWT signature to make sure it's the correct JWT we had initially sent to the user. Next, we'll take another design break and we'll learn how to fix our alerts when we transition our views. And finally, we'll finish off by switching out our current JWT service for a third party package called jwt-simple. So how does injecting a token work from our front-end? Whenever we make a request to the back-end, whether post or get, from the front-end we will have a middleware called an auth interceptor and these will intercept the requests and add the JWT to the header before it goes off and sends it to the back-end.

Login
Hi my name is Alexander Zanfir and in this module we'll roll out our login view and functionality. We will begin by creating our login endpoint on the back-end, then we'll move to the front-end and work on our login view. Afterwards, we'll create the login functionality with a controller. Then we will create an Angular service that will handle our authentication and wrap it and we'll start by doing this just for login. Then we'll get our view or state to redirect to our main view once the login is successful. And afterwards we'll extend our authentication service to handle register as well. At this point, we'll change our focus to Passport and we'll get login working with Passport instead of our own custom method and then we'll do the same for our register. We'll finish off the module with an optimization to check if there's an email that already exists before you register. So, what's Passport? Passport is an authentication middleware for Node. js. It's quite popular and even though I won't end up using it by the time we get to our last module on Sails. js, I would like to cover it in this module so that you can see yet another option in the Node. js authentication community.

Auth Provider
Hi my name is Alexander Zanfir and in this module we'll start working with the Google auth provider. We'll begin by learning how to use the Google developer console to register our app. Next we'll learn how to work with popup windows in JavaScript and through Angular in order to submit our authentication code requests to Google. We will then handle the response to the authentication code request and pass back the code from our popup window to our main window. We will then create an endpoint on our server to exchange the authorization code for an access token with Google. And finally with that access token, we'll get our Google+ profile data so we can get our email and other things such as our name, last name, et cetera. Before we begin let's take a look at the Google OAuth flow. It begins with our Angular app opening another window to submit the request token, which will give us the authorization code. This authorization code will only be provided when the user consents by accepting the terms in the popup window. Once we have our authorization code, we then pass it into our main window and close our popup window. At this point, we send out a request to our own back-end and pass back that authorization code. Then our back-end sends a request to Google with the authorization code, which then exchanges it for an access token. At this point, our back-end can ask Google for any profile and contact information for the user that was just authenticated.

Satellizer
Hi my name is Alexander Zanfir and in this module we'll take a look at an Angular OAuth library called Satellizer. After we get a bit more familiar with the library Satellizer, we'll then replace our existing Google login front-end with Satellizer's. Afterwards, we'll replace our isAuthenticated state with Satellizer's version as well. Then we will get our logout functionality working once again using the new isAuthenticated service. Afterwards we'll learn how to link our local Passport strategy with Satellizer on the front-end so that they're working together. Then you will see how quickly we can implement Facebook login from scratch using Satellizer.

Email Validation
Hi my name is Alexander Zanfir and in this module we'll get started with email verification. We'll begin by starting to clean up our API a bit, since I mentioned earlier that it was becoming quite bloated, and so we'll make several modules to move our code into. Next we will create a service that will be handling our email verification. We will be working with a site called Ink to create our email template and then we'll be using a library called Nodemailer to actually send out our emails from within Node and we'll be using a plug-in for this library that allows us to send it through our own custom SMTP server. Once the user clicks on the Verify link in the email that they'll receive, we then direct them to our endpoint handler. And once the token is verified, it'll set their accounts to active. We will finish off by creating a front-end active check in Angular to notify the user that they need to active within a set amount of time. Otherwise, their account might be disabled. For this course we will be using a very simple implementation of token verification, which will be stateless. And since it's stateless this means that users can replay their verification, thus hitting the endpoint over and over. Just something to be aware of, and one solution could be to add a very quick expiration so that they only have a few minutes to verify their account once the email has been sent out.

Authentication With Sails
Hi my name is Alexander Zanfir and welcome to the last module, Authentication With Sails. We're finally here. The last module. And my favorite part of the course because we will get to play with and learn about Sails. Next we'll look at policies and create our own authentication policy and this will allow us to _____ middleware that checks if the JWT is valid for any resource route or action we expose. Afterwards, we'll implement a Sails local login and get it work with Satellizer on the front-end. And we will finish off with an exercise that puts the knowledge you have gained from this course on creating and using JWTs to finish up our local login. So, what is Sails? Sails is an MVC Framework and it's gaining popularity and maturity with each day. But in our case, we won't be working with any server-side views and we'll be using it purely as an API or back-end service. And that's fine; in fact, you can generate an entire Sails project without any front-end components. Another nice feature that can really increase your production is convention over configuration, which allows to quickly implement APIs, routes, and actions. Another feature I like that can increase your production is the generators. Just like we saw the Yeoman generators on our front-end, the Sails generators do something very similar.