﻿1
00:00:01,380 --> 00:00:03,290
‫In this lecture, things will start

2
00:00:03,290 --> 00:00:05,450
‫to get a bit more advanced.

3
00:00:05,450 --> 00:00:08,370
‫And that is because we'll now create multiple routers

4
00:00:08,370 --> 00:00:10,860
‫and use a process called mounting.

5
00:00:10,860 --> 00:00:12,713
‫So let's see how all that works.

6
00:00:14,150 --> 00:00:17,090
‫Now, before doing any of that, let's keep in mind

7
00:00:17,090 --> 00:00:20,350
‫that the ultimate goal will be to separate all the code

8
00:00:20,350 --> 00:00:23,510
‫that we have in this file into multiple files.

9
00:00:23,510 --> 00:00:26,220
‫So what I want, is to have one file

10
00:00:26,220 --> 00:00:29,270
‫that only contains all of these routes

11
00:00:29,270 --> 00:00:31,200
‫then I want to have another file,

12
00:00:31,200 --> 00:00:33,713
‫which has the routes for the users.

13
00:00:34,550 --> 00:00:38,370
‫I will also want to have a file which contains the handlers

14
00:00:38,370 --> 00:00:41,690
‫only for the users and then also one file

15
00:00:41,690 --> 00:00:45,680
‫that will contain all the handlers for the tours, okay?

16
00:00:45,680 --> 00:00:47,460
‫And so that's actually what we're gonna do

17
00:00:47,460 --> 00:00:48,900
‫in the next lecture.

18
00:00:48,900 --> 00:00:51,200
‫But in order to be able to do that,

19
00:00:51,200 --> 00:00:54,030
‫we actually need to now create one separate router

20
00:00:54,030 --> 00:00:56,033
‫for each of our resources.

21
00:00:56,940 --> 00:01:01,320
‫So, let's go back to our routes here and so right now,

22
00:01:01,320 --> 00:01:05,890
‫we can say that all our routes, so these four routes here,

23
00:01:05,890 --> 00:01:07,730
‫we can say that they're all kind of

24
00:01:07,730 --> 00:01:09,650
‫on a same router, okay?

25
00:01:09,650 --> 00:01:12,800
‫And the router, is this app object.

26
00:01:12,800 --> 00:01:15,090
‫But if we want to separate these routes

27
00:01:15,090 --> 00:01:17,810
‫into different files, so again,

28
00:01:17,810 --> 00:01:19,820
‫one file for these two routes

29
00:01:19,820 --> 00:01:22,440
‫and one file for these two routes,

30
00:01:22,440 --> 00:01:25,540
‫then the best thing to do, is to create one router

31
00:01:25,540 --> 00:01:28,140
‫for each of the resources, okay?

32
00:01:28,140 --> 00:01:30,720
‫And so, this is how we're gonna do.

33
00:01:30,720 --> 00:01:33,390
‫It's actually not that complicated,

34
00:01:33,390 --> 00:01:34,890
‫but you will have to wrap your head

35
00:01:34,890 --> 00:01:37,283
‫around a couple of concepts, okay?

36
00:01:38,420 --> 00:01:40,070
‫So, let's start by saying,

37
00:01:40,070 --> 00:01:45,070
‫const tourRouter is equal to express.Router.

38
00:01:51,110 --> 00:01:52,560
‫Okay, so just like this,

39
00:01:52,560 --> 00:01:57,120
‫we create a new router and save it into this variable.

40
00:01:57,120 --> 00:01:59,590
‫Alright, and so now let's use that router

41
00:01:59,590 --> 00:02:01,480
‫for these two routes.

42
00:02:01,480 --> 00:02:03,653
‫So here we use it instead of app.

43
00:02:04,860 --> 00:02:07,550
‫Alright, so now we have two router and then route

44
00:02:07,550 --> 00:02:09,710
‫and then of course, the get and the post routes

45
00:02:09,710 --> 00:02:11,420
‫on that router.

46
00:02:11,420 --> 00:02:14,080
‫Now, how do we actually connect this new router

47
00:02:14,080 --> 00:02:15,630
‫with our application?

48
00:02:15,630 --> 00:02:19,370
‫Well, we'll use it as middleware, alright?

49
00:02:19,370 --> 00:02:23,770
‫And so that is because, this new modular tool router here,

50
00:02:23,770 --> 00:02:26,480
‫is actually a real middleware, alright?

51
00:02:26,480 --> 00:02:28,330
‫And so we can say, (keyboard typing),

52
00:02:29,980 --> 00:02:34,980
‫app.use, and then the route but let's keep that for later.

53
00:02:36,760 --> 00:02:41,760
‫So we can use, the tourRouter on our application

54
00:02:42,020 --> 00:02:44,647
‫and where do we want to use the tourRouter?

55
00:02:44,647 --> 00:02:46,650
‫Well, we want to use it on,

56
00:02:46,650 --> 00:02:51,650
‫/api/version one/tours, okay?

57
00:02:53,800 --> 00:02:58,030
‫So again, this tourRouter here, is a real middleware.

58
00:02:58,030 --> 00:03:01,850
‫And we want to use that middleware for this specific route.

59
00:03:01,850 --> 00:03:04,240
‫Okay, and so we use app.use

60
00:03:04,240 --> 00:03:07,883
‫and specify the middleware function, which is this router,

61
00:03:07,883 --> 00:03:11,540
‫then we specify the the route so the URL,

62
00:03:11,540 --> 00:03:15,200
‫for which, we actually want to use that middleware, okay?

63
00:03:15,200 --> 00:03:16,640
‫And so just like this,

64
00:03:16,640 --> 00:03:20,700
‫we created basically a sub application, okay?

65
00:03:20,700 --> 00:03:22,270
‫Now, there's just one thing

66
00:03:22,270 --> 00:03:24,060
‫that we really need to change here,

67
00:03:24,060 --> 00:03:27,110
‫which is these routes in here, okay?

68
00:03:27,110 --> 00:03:29,830
‫So let me change this here, and then explain

69
00:03:29,830 --> 00:03:31,830
‫why it has to be this way.

70
00:03:31,830 --> 00:03:34,267
‫So here, we only want the route,

71
00:03:34,267 --> 00:03:37,600
‫and in here, we only want the id, okay?

72
00:03:37,600 --> 00:03:39,450
‫Now, why is that?

73
00:03:39,450 --> 00:03:42,540
‫Well, it's because this tourRouter middleware,

74
00:03:42,540 --> 00:03:46,200
‫only runs on this route here anyway, okay?

75
00:03:46,200 --> 00:03:48,400
‫And so once we are in the router,

76
00:03:48,400 --> 00:03:50,700
‫then we already are at this route.

77
00:03:50,700 --> 00:03:54,150
‫So at our tourRoute, and so this first route

78
00:03:54,150 --> 00:03:57,370
‫that we had to before, we only want to run it as,

79
00:03:57,370 --> 00:04:00,090
‫api/version one/tours

80
00:04:00,090 --> 00:04:03,740
‫and so that is what this route here now means, okay?

81
00:04:03,740 --> 00:04:07,720
‫So it's basically the route of this URL, okay?

82
00:04:07,720 --> 00:04:10,750
‫So is this small mini application, alright?

83
00:04:10,750 --> 00:04:14,260
‫So, actually, when we create a router system like this,

84
00:04:14,260 --> 00:04:18,650
‫we actually say that we kind of create a small sub app

85
00:04:18,650 --> 00:04:21,793
‫for each of these resources, okay?

86
00:04:22,860 --> 00:04:26,410
‫So this is the route of or mini application,

87
00:04:26,410 --> 00:04:30,390
‫which is again, at /tours, Okay?

88
00:04:30,390 --> 00:04:34,150
‫And then the second route, is at /id, right?

89
00:04:34,150 --> 00:04:35,680
‫And that's because, before,

90
00:04:35,680 --> 00:04:39,303
‫it was at tours /id, so it was all of this.

91
00:04:40,190 --> 00:04:44,330
‫So like this, but now, this URL here

92
00:04:44,330 --> 00:04:49,330
‫is already in our kind of parent route up here, right?

93
00:04:49,400 --> 00:04:51,980
‫So let's say that we have an incoming request now

94
00:04:51,980 --> 00:04:56,690
‫for /api/version one /tours/version id.

95
00:04:56,690 --> 00:04:59,460
‫So the request goes into the middleware stack

96
00:04:59,460 --> 00:05:02,190
‫and when it hits this line of code here,

97
00:05:02,190 --> 00:05:05,060
‫it will match this URL here, right?

98
00:05:05,060 --> 00:05:07,380
‫So it will match this route and therefore

99
00:05:07,380 --> 00:05:10,150
‫or two router middleware function will run.

100
00:05:10,150 --> 00:05:14,310
‫So or two router is this sub application that we created,

101
00:05:14,310 --> 00:05:17,740
‫which in turn has its own routes, okay?

102
00:05:17,740 --> 00:05:20,570
‫And if the request was for /id, well,

103
00:05:20,570 --> 00:05:22,480
‫then it will inside our mini app,

104
00:05:22,480 --> 00:05:25,220
‫hit this route here, right?

105
00:05:25,220 --> 00:05:26,250
‫And finally, of course,

106
00:05:26,250 --> 00:05:29,030
‫it will run one of these handles here,

107
00:05:29,030 --> 00:05:31,190
‫depending on the method that was used.

108
00:05:31,190 --> 00:05:34,010
‫So I hope that made sense.

109
00:05:34,010 --> 00:05:36,580
‫And so let's now actually go ahead and do the same

110
00:05:36,580 --> 00:05:39,363
‫for all users, alright?

111
00:05:40,220 --> 00:05:44,089
‫So, I will go ahead and create another router here,

112
00:05:44,089 --> 00:05:47,370
‫(keyboard typing) called, the userRouter,

113
00:05:49,727 --> 00:05:52,520
‫and then just like before, it's express.Router

114
00:05:55,970 --> 00:05:58,823
‫not like that, yeah.

115
00:06:00,160 --> 00:06:02,333
‫Okay, so use a router,

116
00:06:05,810 --> 00:06:08,970
‫and then we need to do the same process as here.

117
00:06:08,970 --> 00:06:12,980
‫And by the way, this is called mounting the router, okay?

118
00:06:12,980 --> 00:06:17,980
‫So mounting a new router on a route, basically, okay?

119
00:06:19,770 --> 00:06:23,970
‫So we have now users and here user.

120
00:06:26,100 --> 00:06:28,870
‫And actually, mounting the routers,

121
00:06:28,870 --> 00:06:32,330
‫has to come after all of these definitions

122
00:06:32,330 --> 00:06:37,330
‫or at least after we declared a variable, right?

123
00:06:39,660 --> 00:06:41,190
‫So we cannot use the routers

124
00:06:41,190 --> 00:06:43,560
‫before we actually declare them.

125
00:06:43,560 --> 00:06:46,630
‫Okay, now all we need to do is to go ahead

126
00:06:46,630 --> 00:06:50,223
‫and also change the routes in here.

127
00:06:51,850 --> 00:06:55,160
‫And so just like before, if there is now a request

128
00:06:55,160 --> 00:06:59,740
‫for /api/version one/users/id,

129
00:06:59,740 --> 00:07:02,350
‫the request will enter the middleware stack

130
00:07:02,350 --> 00:07:04,680
‫and when it hits this middleware here,

131
00:07:04,680 --> 00:07:06,560
‫it will run the user router,

132
00:07:06,560 --> 00:07:10,250
‫because this route here is matched, okay?

133
00:07:10,250 --> 00:07:12,320
‫And so then it enters the user router

134
00:07:12,320 --> 00:07:14,220
‫and again, just like before,

135
00:07:14,220 --> 00:07:18,960
‫this error is the route basically in our sub application,

136
00:07:18,960 --> 00:07:23,860
‫and this here, is the entire URL/id, okay?

137
00:07:23,860 --> 00:07:25,550
‫Does that make sense?

138
00:07:25,550 --> 00:07:26,710
‫So before moving on,

139
00:07:26,710 --> 00:07:29,723
‫let's actually test if this still works.

140
00:07:30,640 --> 00:07:35,210
‫So, let's get all the tours here and indeed, it does.

141
00:07:35,210 --> 00:07:40,000
‫So everything still works to the same with the users

142
00:07:40,000 --> 00:07:42,380
‫and also that still works.

143
00:07:42,380 --> 00:07:45,410
‫So we did all these changes and decode the works,

144
00:07:45,410 --> 00:07:49,350
‫meaning that our two new routers are correctly mounted.

145
00:07:49,350 --> 00:07:53,230
‫Alright, and with that, we are ready to actually separate

146
00:07:53,230 --> 00:07:56,250
‫or different routers now into different files.

147
00:07:56,250 --> 00:07:58,993
‫And that we will do right in the next lecture.

