1
00:00:02,050 --> 00:00:10,720
In this video, we are going to implement what is called public and then the private nav bar or nav

2
00:00:10,720 --> 00:00:11,560
links.

3
00:00:11,680 --> 00:00:21,010
As it stands right now, if a user is not logged in with to see profile, and even if a user is locked

4
00:00:21,010 --> 00:00:24,510
in, we still say log in and register.

5
00:00:24,520 --> 00:00:26,560
So here is the logic.

6
00:00:26,590 --> 00:00:35,800
Logic number one is that we are going to hide the log in and register when a user is logged in and we

7
00:00:35,800 --> 00:00:42,220
are going to add log out and then the profile if a user is locked in.

8
00:00:43,270 --> 00:00:46,510
So how are you going to achieve that?

9
00:00:46,540 --> 00:00:48,200
Well, here is the logic.

10
00:00:48,220 --> 00:00:57,040
First of all, we are going to check if a user is logged in and for the back end, we can check if a

11
00:00:57,040 --> 00:01:01,450
user is logged in by means of record session.

12
00:01:01,450 --> 00:01:04,260
So what about the client side?

13
00:01:04,269 --> 00:01:13,690
How can we have the log in user inside our template and express Make it pretty simple by making use

14
00:01:13,690 --> 00:01:16,400
of what is called app dot looker.

15
00:01:16,720 --> 00:01:21,670
If you go to the official website that is express JD.com.

16
00:01:21,670 --> 00:01:31,540
And here if we search for locales and that is app don't look us let's have a look it says that the app

17
00:01:31,540 --> 00:01:40,150
dot look has object has properties that are lookup variables within the application and will be available

18
00:01:40,150 --> 00:01:44,170
in templates rendered with red dot render.

19
00:01:44,500 --> 00:01:52,660
It means that any property that we add to the app look will be available inside the templates.

20
00:01:52,990 --> 00:01:58,480
So we are going to take this one as an advantage to implement that.

21
00:01:58,900 --> 00:02:08,050
So inside the server dot JS, that is where we are going to add the log in user into locust.

22
00:02:08,259 --> 00:02:17,530
Remember we have the log in user as a property on the session as user of let's get back to the log in

23
00:02:17,530 --> 00:02:23,050
and this is where we are adding the logging user into session.

24
00:02:23,050 --> 00:02:29,860
So we are going to take the log in user from session and then put it inside the app.

25
00:02:29,860 --> 00:02:35,860
Dot looker as a matter well, so let's see how we are going to implement that.

26
00:02:36,310 --> 00:02:44,260
So let's get back to the server JS file and here we are going to pass it as a middleware.

27
00:02:44,260 --> 00:02:49,150
So before the route, I'm going to add comment by saying that.

28
00:02:49,900 --> 00:03:03,940
See the log in user into locus and going to be as app dot use and pass in the middleware at that.

29
00:03:03,940 --> 00:03:08,650
So here we have access to the req response.

30
00:03:08,650 --> 00:03:17,920
And next, remember this middleware will always run any time we make a request and even as soon as application

31
00:03:17,920 --> 00:03:20,110
run first is going to run.

32
00:03:20,110 --> 00:03:22,810
So it is where we want to implement that.

33
00:03:22,810 --> 00:03:29,200
So in here we are going to check if indeed a user is logged in.

34
00:03:29,200 --> 00:03:34,840
So going to be as red dot session, dot user off.

35
00:03:34,840 --> 00:03:36,960
That's what we provided.

36
00:03:36,970 --> 00:03:46,450
If you check the log in, you can see we added a property or user of on that we have the log in user.

37
00:03:46,480 --> 00:03:55,990
So in case we have one, then we are going to add that user into lookups as red dot lookups, dot.

38
00:03:55,990 --> 00:04:03,940
Any property that you want to use to represent the log in user, you can say log in user or user of

39
00:04:03,940 --> 00:04:05,860
or authenticated user.

40
00:04:05,890 --> 00:04:15,010
I would like to use the same name as user, or it can be any variable, but I would like to use what

41
00:04:15,010 --> 00:04:24,580
is called user off and it's equal to the log in user and that is req the session dot user oath and that

42
00:04:24,580 --> 00:04:25,240
is it.

43
00:04:25,600 --> 00:04:34,330
LS then rest dot lookups dot user oath is equal to NA.

44
00:04:34,420 --> 00:04:43,300
So inside our template we have access to a variable called user of in case we have the user, it means

45
00:04:43,300 --> 00:04:49,030
that the user is logged in by in case there is no property on the user off.

46
00:04:49,030 --> 00:04:52,510
Then it means that the user is not logged in.

47
00:04:52,510 --> 00:04:58,870
So let's get into the nav bar and that is the postures inside the views folder.

48
00:04:59,540 --> 00:05:01,610
And here we go.

49
00:05:01,880 --> 00:05:10,280
So before rendering these links, we can check or we can create two files, one for the public number

50
00:05:10,280 --> 00:05:12,580
and one for the private number.

51
00:05:12,590 --> 00:05:16,260
And we can make a condition to check which one to render.

52
00:05:16,280 --> 00:05:19,190
But let's use this condition here.

53
00:05:19,310 --> 00:05:23,360
So first of all, I'm going to bring the syntax here.

54
00:05:25,450 --> 00:05:30,760
It's that and we are going to make use of if we have the user of.

55
00:05:33,910 --> 00:05:37,420
And let me close as that.

56
00:05:39,800 --> 00:05:40,640
Airs.

57
00:05:44,960 --> 00:05:48,830
Let me close the case as that.

58
00:05:55,120 --> 00:06:03,310
All right, so in case a user is logged in, definitely I want to provide the home link.

59
00:06:03,640 --> 00:06:10,150
And then I also want to provide the profile and then the create button.

60
00:06:16,780 --> 00:06:27,370
Likewise the post also inside that and in case a user is not logged in, I want to provide the same

61
00:06:27,370 --> 00:06:31,150
home link and then list of posts.

62
00:06:33,920 --> 00:06:37,700
And then you're going to have the log in and register.

63
00:06:37,700 --> 00:06:43,580
So let me remove the post here and it's going to be as that.

64
00:06:43,910 --> 00:06:44,840
Save it.

65
00:06:44,840 --> 00:06:53,480
And let's refresh the application and you can see that it's two hanging simply because we are not calling

66
00:06:53,480 --> 00:06:56,000
next inside this mature.

67
00:07:03,480 --> 00:07:11,130
Well, we got an error simply because we need to close the edges here and start.

68
00:07:11,520 --> 00:07:12,370
Perfect.

69
00:07:12,390 --> 00:07:14,520
Yeah, I think it'd be good to go.

70
00:07:15,930 --> 00:07:19,580
And you can see that I have looked in.

71
00:07:19,590 --> 00:07:24,840
That is why I have these links as home profile and then the post.

72
00:07:24,990 --> 00:07:30,450
Let me rearrange the length by bringing this button before the post.

73
00:07:30,480 --> 00:07:37,800
So inside the authenticated links, which is this one, I'm going to cut this one from here and bring

74
00:07:37,800 --> 00:07:38,670
it here.

75
00:07:41,400 --> 00:07:42,840
And that is it.

76
00:07:42,870 --> 00:07:47,730
I also want to add a link for Lockout or Better Store.

77
00:07:47,730 --> 00:07:54,270
When I click on Profile, I can add a button here for logging out, but I think if you add it here,

78
00:07:54,270 --> 00:07:55,320
it would be nice.

79
00:07:55,320 --> 00:08:04,080
So let me copy one of these links and let me use the button link like that and let me change this one

80
00:08:04,080 --> 00:08:05,820
to look out.

81
00:08:07,380 --> 00:08:15,900
And let me add some inline styling by providing what is called background color, and they make it as

82
00:08:15,900 --> 00:08:17,220
pure red.

83
00:08:21,890 --> 00:08:26,690
All right, now I have to look out And then the new post here.

84
00:08:27,170 --> 00:08:31,940
If I look out, you can see our half the log in.

85
00:08:31,940 --> 00:08:36,710
And how can I look out unless I remove the user from session.

86
00:08:36,710 --> 00:08:40,820
So right click and play that and let's refresh it.

87
00:08:43,039 --> 00:08:48,320
And you can see we have the post log in and register.

88
00:08:48,650 --> 00:08:53,240
If I look in as Ben at gmail.com.

89
00:08:54,630 --> 00:08:56,580
One, two, three, four, five.

90
00:08:56,610 --> 00:08:57,660
Look in.

91
00:08:59,200 --> 00:09:01,180
And here we go.