And we're gonna be recognises into two separate parts in the first part.

We're just going to do a simple J W T authentication will recreate tokens, sent tokens to users and authenticate those tokens on our server.

And in the second part, we're gonna talk about how we can use a refresh token in orderto automatically refresh our JWT tokens to increase the security of our server, and also revoked privileges from users that we no longer want to access our server similar to how a log out function works.

So make sure you stick around to the end of the video.

So you get both parts of this video.

So with that, out of the way, let's get started.

Welcome back to Webb.

Have simplified my name's Kyle.

And my goal is to simplify the web for you so you can start building your dream project sooner.

So that sounds interesting.

Make sure subscribe to the channel for more videos just like this one.

And for this video, as always, I have visual studio code opened up completely blank folder so we can start this project.

And the very first thing we need to do is initialized this project with NPM.

So if we just type NPM, innit?

Dash, why is going to initialize our project with all the default settings?

And now we can install the libraries that we're going to be using the library's we're gonna be using.

As I mentioned in the intro, we're gonna be using express Soviet type NPM.

I express.

We also gonna be using a library called Jason Webb Token All one word.

And then lastly, we're going to install dot e N V, and this is just going to allow us to use a dotty envy file, which is going to contain our secret tokens for J W T.

So we can just create that now dot envy.

And this is where we're gonna put those secret tokens.

Lastly, we're gonna install a development dependency and PM I dash, dash save Dev, and this is called no demon.

And what node Mom lets us do is automatically refresh our server every time we makes changes to it.

So we don't have to manually close and restart our server ourselves And as soon as that finishes downloading, we're gonna create a script which is going to allow us to start our server using node money really easily.

And we're gonna do that on a file called server dot Jason, this is going to be our main server file.

So now, insider package Da Jason, you can see all of our dependencies air showing up in here, and we can just come down here and type in Dev's start.

And we want this command to be node Mon, and it's going to run our server dot Jason file.

So this is going to run our service, Jason using Nordmann.

And we can start that by just running NPM Run Dev start.

And it's going to run that file for us.

And of course, we're going to an air because I forgot to save my package Dodge a son.

Now let's run that again.

And as you can see, it started up our server and since we have nothing in it, it just exited out.

Which is fine now is we make changes.

For example, if we put a concert out log, put Hyeon here, save it, you can see that it's actually refreshing our server every time.

So to get started with our server, we want to first important express.

Will you just do that by requiring the express library And in order to set up an express server, we need to get the at variable, which is going to come from express so we could just call the express function and then say ap dot listen and tell what we want to listen.

For example, on Port 3000 now we have an application running on Port 3000.

But of course it doesn't do anything yet.

In order to get our application up and running, let's actually just create a simple route an app dot get route.

This is going to get all of the post inside of her application.

And this is of course, going to have a request and a response.

Variable hopes response.

And inside of here we could just run a function.

And inside of this function, all we want to redo is return a list of post socialist creative variable, which is going to have all of our post inside of it just like this.

And this is going to be an array with objects.

We're gonna have a user name for the person that created the Post.

So, for example, me and we're gonna have a title for that.

And we can just say Post one and let's just put to post in here for now.

So if I just copy this down and we're gonna change this user name here to be Jim never go.

And, of course, the title should be post two and inside of our app Target.

We could just return that.

So we can say resident Jason and we want to return our post.

Now, if we say that, create a new file called request dot rest.

What's not rest, not recess.

Let me change that real quick.

There we go.

And this is going to allow us to make arrest.

Request a P.

I request to our A.

P I.

You can use something else like postman, but because I have the extension installed in visual studio code called the rest client down here.

It allows me to just use a dot rest file to make these calls.

And this dot rest file is really simple.

We could just say we want to make a get request to http local host Port 3000 and we just want slash post.

So now if we send that request, you can see we get the list of our post back for us.

So we know that our application is working and running properly.

Now, the next thing for us to do is to actually authenticate our request using J W T.

So we don't let everyone access the post and only specific users, so we could just create a route to do that.

We can say ap dot Get this is going to be our log in route and, of course, is going to take a request and a response.

And the very first thing you do in this log in route is you want to authenticate the user.

And in our case, I've already done a video on user authentication using passwords and usernames.

So if you want to check that out, it's going to be in the cards and the description below.

So what is gonna ignore this portion of the authentication so we can focus purely on how J.

W T works in the authentication process?

So the next thing we need to do is actually create that Jason Webb token.

And to do that, we want to require that library we used earlier.

So we can say const.

And we want just j W t.

Which is equal to require of Jason Webb Token.

Also, since we're going to be passing Jason to this app dot Get, we need to make sure our server can handle that so we can say ap dot use and we want to pass an express about Jason.

This just lets our application actually use Jason from the body that gets passed up to it inside of request.

And we're gonna change this to be a post actually instead of agate, since we actually want to create a token.

So post makes more sense than get now inside of here.

We want to get the user name so we can say constant use.

Your name is equal to request that body dot user name, and now normally you would make sure you authenticate the user first.

But as I mentioned, that's going to be in a separate video which I've already done and you can check out now that we know this user has access to our application and has passed the correct user name and password.

We want to authenticate and serialize this user with Jason Webb tokens.

Now, if you're not already familiar with Jason Webb tokens and how they work, I have an entire video talking about why you should use Jason Webb tokens and how they work.

So you can check that out again, linked in the cards and the description below for this purpose of the video, we're just gonna worry about the implementation of Jason Webb tokens, and it's really actually quite easy to create a Jason Webb token.

We just use that J W T library and we pass it DOT sign, and the sign is first going to take our payload, which is essentially what we want to serialize, and we want to serialize a user object.

So let's just create a user, and this user is going to be equal to hear just an object which has name, and we want to pass that as our user name.

And now we can say that we want to serialize our user and in order to serialize them, we need some kind of secret key.

This is going to be the next parameter and we're gonna get this from our environment Variables.

So process dot e n v dot access lifts access token secret.

Just like that.

And we can create this inner Dottie envy.

We can say access token secret, and we need to set this to some form of secret value and a really easy way to create a secret value.

Is using the crypt library inside of know Js.

So what we can do is just open up another terminal and if we just run note here, we can just run any no jazz code.

We want to quit choir, the Crypto library, and all we want to do is we want to get some random bytes so we can say random fights.

Let's just say that we want to get 64 of them, and then we want to convert this to a string which is going to be in hex, a decimal.

Now we enter.

This is just going to give a random list of characters If we run it again, you see, we get a completely different random list of characters.

We can just copy this up as our access token secret.

And since we're going to be doing refresh tokens later in this video.

What set up our secret for a refresh token as well would issues this other value so that these have two different secrets.

That's really all that you need to make sure is that the secrets for both of these are completely different.

Now we can save that and go back into R J W T sign.

And right now this is complete.

We could add an expiration date to our token.

But since we don't have any way to refresh our token jet, we don't want to add any form of expiration date.

So we can just say that this is going to be our access token.

And what we want to do is just return that so we can save.

Red's got Jason and we want to pass down our access token as our Jason.

So now when we make a request to log in whatever user name, we pass up assuming it's authenticated correctly, it's going to create an access token for us.

And then Access Token is goingto have the user information saved inside of it.

That's what we're doing with our sign here.

So let's go over and actually test this.

If we just put in here three hashtags like that, anything that comes after it is going to be a different request.

So we could just say Post, we want a post to this http local host 3000.

And this time we want to do a log in.

And we want our content type here to be Jason.

So we can just say application slash Jason and then in our body, we need to pass up that user name.

So it's type in user name.

And let's just say we want to do Kyle for example.

Now, if we send that request, you can see we're getting air secret.

Private key must have a value.

And this is because we're never actually loading our Dottie envy variables into our process dot envy variable here.

And we can actually do that really easily.

Just at the very top for application.

We just want to put require, and we want to put dottie envy dot config.

Now, if we say that and make a request, this should work.

And there you go.

You can see we have an access token being returned to us that has no expiration date that has the user information saved in it.

So we can access any of our end points with this user information here.

So now, in order to test that, what's actually creates the middle, where which we're going to put on our post here, which is going to authenticate our token so we can say a function here.

We're gonna call it authenticate, authenticate, token.

And of course, since it's a middle where it's going to take request response and next and then inside of this function, all we need to do is we want to get the token that they send us.

We want to verify that this is the correct user and then we want to return that user up into the function here.

Forget post so we can call that authenticate token function as our middle where so we know we have that in our post and now inside of this function, we need to get the token, and this token is going to come from the header and we're gonna have a header called Bear.

So it's gonna say bearer, and then it's going to have our token afterwards.

So this string over here our token is going to come after the keyword bear and that's going to be in our authorization header.

So in order to get this header, we could just say cost off.

Header is going to be equal to request.

We want to get the headers and then from that headers, we actually want to get the authorization header which is going to have the format of bear followed by our token.

So then all we want to do is get our token portion.

So what we need to do is say that our token is going to be equal to off header flips off header just like that and we want to get this split.

So we're gonna split it here on a space because as you know, there's a space between bear and token and we want to get the second parameter in that array.

So we just say, 01 over here and this is going to be this token portion of our bare token and in order to make sure that we actually have a header, we first need to do off header and and essentially, what this is saying is if we have an off header, Then return the off header token portion which we split on the space otherwise just return undefined.

So our token is either gonna be undefined or it's going to be the actual token.

So we could do a check to make sure to see if our token is no.

So if our token is no, we just want to return to the user and air code, saying that they don't have access, so we can say send status and we want to send a 41 status code so that we know that they have not sent a token tow us.