1
00:00:00,270 --> 00:00:07,290
All right, and once we can successfully invoke the instant method, now, let's start talking about

2
00:00:07,290 --> 00:00:10,200
the tokens, more specifically JSON with tokens.

3
00:00:10,620 --> 00:00:16,200
And before we install the package and going to these functions and all the nitty gritty stuff.

4
00:00:16,830 --> 00:00:24,540
Let me give you a brief general overview, just so we all are on the same page and be mentored years

5
00:00:24,540 --> 00:00:32,740
following where we're building the application, where user will be able to register and log in, and

6
00:00:32,740 --> 00:00:38,100
then he or she can create job applications and then keep track of them.

7
00:00:38,370 --> 00:00:38,730
Correct.

8
00:00:38,910 --> 00:00:39,900
And that's the main goal.

9
00:00:40,290 --> 00:00:49,920
Now the key thing here is that I don't want anybody else to access my data, so only the user that creates

10
00:00:49,920 --> 00:00:54,540
that specific job can see the job and modify the job.

11
00:00:54,990 --> 00:00:57,750
And that's a very important part of the application.

12
00:00:58,110 --> 00:00:59,970
So how do we restrict that?

13
00:01:00,450 --> 00:01:06,330
Well, we use something called tokens, where essentially if I'm going to open up the death tolls,

14
00:01:06,330 --> 00:01:10,470
more specifically, I'm looking for a network request because I want to show you something.

15
00:01:10,830 --> 00:01:21,390
And if I go to my login, provide my dummy values, you notice something really interesting as far as

16
00:01:21,390 --> 00:01:22,230
our response.

17
00:01:22,710 --> 00:01:24,570
So hopefully my password was correct.

18
00:01:24,780 --> 00:01:25,140
Yep.

19
00:01:25,440 --> 00:01:32,000
I was able to log in, and if I take a look at the login request, one that I'm making out here and

20
00:01:32,010 --> 00:01:34,980
don't worry about starts right now, that's talking about the logging one.

21
00:01:35,370 --> 00:01:36,720
You'll notice this response.

22
00:01:37,860 --> 00:01:39,660
So this is the token that we're sending back.

23
00:01:39,840 --> 00:01:48,480
More specifically, that is a JSON web token and our storage token on a front frontend in two places,

24
00:01:48,900 --> 00:01:53,670
which you'll notice the token is in the React state.

25
00:01:54,240 --> 00:01:55,530
So it's going to be over here.

26
00:01:55,560 --> 00:01:57,390
Notice here, I have the user.

27
00:01:57,390 --> 00:02:04,140
So this is going to be the data that we're sending back in response, but also in response.

28
00:02:04,410 --> 00:02:09,330
We have the token and we set this token equal to a state value.

29
00:02:09,990 --> 00:02:12,330
And then another place where we'll save that one.

30
00:02:12,580 --> 00:02:17,070
And let me find the application and then more specifically, local storage.

31
00:02:17,460 --> 00:02:20,640
Now this will be saving those values there as well.

32
00:02:21,120 --> 00:02:22,230
So that's the first step.

33
00:02:23,180 --> 00:02:30,050
Every time the user registers or he or she Alakazam will send back this token.

34
00:02:30,960 --> 00:02:38,340
And then once we send back the token now with every future request, we'll be sending back this token

35
00:02:38,670 --> 00:02:43,650
to the server and on the server will validate that token.

36
00:02:44,280 --> 00:02:48,780
And you can kind of make an argument, well, we could come up with just some random strings here,

37
00:02:49,230 --> 00:02:52,430
and you're kind of correct, but that would be very easy to break.

38
00:02:52,640 --> 00:02:55,560
Not is the whole point of the aegis and token.

39
00:02:55,800 --> 00:03:01,110
But the idea, yes, would be exactly the same where once the user shows up to the server.

40
00:03:02,060 --> 00:03:07,850
For a registered logging, you just send back some random value and then you just check whether the

41
00:03:07,850 --> 00:03:11,870
value matches, but of course, devotees are way more secure.

42
00:03:12,330 --> 00:03:17,240
And now let me showcase the other thing where once we have logged in, noticed this request.

43
00:03:17,690 --> 00:03:23,660
So pretty much as the user is going to be navigating around our application, he or she is going to

44
00:03:23,660 --> 00:03:24,770
be making those requests.

45
00:03:25,220 --> 00:03:32,030
Whether that is to have a job, maybe that is going to be when he or she wants to modify the profile

46
00:03:32,480 --> 00:03:40,220
and maybe take a look at all the jobs and what you'll notice that with those requests in the headers,

47
00:03:40,370 --> 00:03:45,290
what we're doing from the frontend, we're sending that token back.

48
00:03:45,710 --> 00:03:49,010
So these are going to be response headers for whatever we're looking for.

49
00:03:49,010 --> 00:03:50,240
Here is this one.

50
00:03:50,630 --> 00:03:53,960
Notice the request headers and now is the authorization.

51
00:03:54,470 --> 00:03:59,840
Now this bearer, I want to talk about it once we get there, but this is the one that we're sending

52
00:03:59,840 --> 00:04:00,110
back.

53
00:04:00,440 --> 00:04:01,850
So hopefully this is clear.

54
00:04:02,940 --> 00:04:08,500
That it is all the time this communication between the server and the frontend.

55
00:04:08,520 --> 00:04:18,510
And remember that the DP is stateless, meaning just because I got the token the first time.

56
00:04:18,870 --> 00:04:23,460
If I don't provide in my future requests, I'll actually will fail.

57
00:04:23,730 --> 00:04:30,990
And let me showcase that by going to the local storage, removing the token from the local storage and

58
00:04:30,990 --> 00:04:38,220
then refresh the page and what you'll notice that the moment we refresh the page, the state will be

59
00:04:38,220 --> 00:04:38,550
empty.

60
00:04:38,790 --> 00:04:40,210
That's just the default behavior.

61
00:04:40,210 --> 00:04:45,000
Remember, we cannot persist the value between the refreshes.

62
00:04:45,090 --> 00:04:47,520
That's why we would use something like local storage.

63
00:04:47,940 --> 00:04:52,920
And then since the token is not going to be present, I'll be automatically logged out.

64
00:04:53,310 --> 00:05:01,110
So let me go to my local storage and here let me just clear everything and once I refresh.

65
00:05:01,380 --> 00:05:02,040
What are you doing?

66
00:05:02,490 --> 00:05:03,290
I got logged out.

67
00:05:03,300 --> 00:05:03,630
Why?

68
00:05:04,050 --> 00:05:05,930
Well, let's take a look at the network here.

69
00:05:06,480 --> 00:05:13,590
Notice I have the stats one and the responses for one basically on authenticated error.

70
00:05:14,130 --> 00:05:22,200
And hopefully this gives you a good idea of the overall setup and why we're using the tokens, more

71
00:05:22,200 --> 00:05:25,290
specifically JWT tokens in the first place.