1
00:00:02,060 --> 00:00:04,030
Dynamic routes are

2
00:00:04,030 --> 00:00:05,890
an extremely important feature,

3
00:00:05,890 --> 00:00:08,490
which you will also see again and again

4
00:00:08,490 --> 00:00:09,880
throughout of this course,

5
00:00:09,880 --> 00:00:12,573
but also in any website you're going to build.

6
00:00:13,700 --> 00:00:17,200
Now, what happens though, in this dynamic route,

7
00:00:17,200 --> 00:00:20,300
if we try to get a restaurant

8
00:00:20,300 --> 00:00:22,193
with an ID that doesn't exists?

9
00:00:23,270 --> 00:00:26,330
So what happens if I manually change this ID

10
00:00:26,330 --> 00:00:31,330
here in the URL to R100, which is not a valid ID,

11
00:00:32,340 --> 00:00:34,240
I mean, it's maybe a valid ID,

12
00:00:34,240 --> 00:00:36,503
but it doesn't exist in our data set.

13
00:00:37,540 --> 00:00:39,230
If I hit enter here,

14
00:00:39,230 --> 00:00:42,240
then you'll note that this keeps on spinning.

15
00:00:42,240 --> 00:00:45,600
So we don't load a page and eventually

16
00:00:45,600 --> 00:00:48,780
this will time out and crash.

17
00:00:48,780 --> 00:00:50,670
Now, why does that happen?

18
00:00:50,670 --> 00:00:53,753
Why will we eventually time out here?

19
00:00:55,370 --> 00:00:58,420
Well, we will time out because in this route,

20
00:00:58,420 --> 00:01:03,360
which handles this request, we only send back a response

21
00:01:03,360 --> 00:01:06,853
if we did find a restaurant by that ID.

22
00:01:07,730 --> 00:01:10,420
Otherwise we don't send back a response.

23
00:01:10,420 --> 00:01:13,160
And I mentioned earlier in the course already

24
00:01:13,160 --> 00:01:14,610
that if you have a route

25
00:01:14,610 --> 00:01:17,160
where you don't send back a response,

26
00:01:17,160 --> 00:01:19,000
ultimately it will time out

27
00:01:19,000 --> 00:01:22,970
and the browser will show an error eventually,

28
00:01:22,970 --> 00:01:26,340
because it never receives a response from the server.

29
00:01:26,340 --> 00:01:31,050
And your server should always send back a response

30
00:01:31,050 --> 00:01:33,750
even if it's just an error response

31
00:01:33,750 --> 00:01:37,280
that tells the browser that something went wrong.

32
00:01:37,280 --> 00:01:40,420
But everything is better than just timing out

33
00:01:40,420 --> 00:01:42,740
and not knowing what's going on

34
00:01:42,740 --> 00:01:44,700
as it's currently the case here.

35
00:01:44,700 --> 00:01:48,140
We don't wanna wait until this eventually times out.

36
00:01:48,140 --> 00:01:50,523
No user will stick around that long.

37
00:01:51,730 --> 00:01:55,030
So therefore here, we also wanna send back a response

38
00:01:55,030 --> 00:01:57,180
if we don't find a restaurant.

39
00:01:57,180 --> 00:01:59,283
And how could we make that happen now?

40
00:02:00,850 --> 00:02:03,100
Well, you could think that you may be at

41
00:02:03,100 --> 00:02:06,170
a else case here in this if block

42
00:02:07,370 --> 00:02:09,830
and you send back a different response

43
00:02:09,830 --> 00:02:11,630
if you make it in here.

44
00:02:11,630 --> 00:02:15,333
But this would be wrong, and why would that be wrong?

45
00:02:16,190 --> 00:02:19,100
Well, keep in mind that this if statement

46
00:02:19,100 --> 00:02:22,150
is evaluated for every restaurant

47
00:02:22,150 --> 00:02:24,490
in this storedRestaurants array,

48
00:02:24,490 --> 00:02:27,880
and we won't have a matching condition here

49
00:02:27,880 --> 00:02:30,900
for the vast majority of all restaurants.

50
00:02:30,900 --> 00:02:34,420
There will only be one restaurant at most

51
00:02:34,420 --> 00:02:36,930
that matches with its ID

52
00:02:36,930 --> 00:02:39,240
because we'll never have more than one restaurant

53
00:02:39,240 --> 00:02:41,510
with that ID we're looking for,

54
00:02:41,510 --> 00:02:45,330
and in some cases we'll have no restaurant at all.

55
00:02:45,330 --> 00:02:48,910
So if we return an error response

56
00:02:48,910 --> 00:02:51,640
whenever this condition is not met,

57
00:02:51,640 --> 00:02:53,800
then we have a lot of cases

58
00:02:53,800 --> 00:02:55,890
where we don't meet the condition.

59
00:02:55,890 --> 00:02:57,940
And we might not even reach the restaurant

60
00:02:57,940 --> 00:03:00,760
where the condition might've been met.

61
00:03:00,760 --> 00:03:03,320
So else is not a good solution here

62
00:03:03,320 --> 00:03:06,143
because we might send back an error too early.

63
00:03:07,050 --> 00:03:09,940
Now, therefore the proper way of handling this

64
00:03:09,940 --> 00:03:14,540
is to wait until we exhausted our list of restaurants

65
00:03:14,540 --> 00:03:18,670
and we went through this entire list of restaurants.

66
00:03:18,670 --> 00:03:20,853
So after this for-loop.

67
00:03:21,960 --> 00:03:25,270
At this point, we had a look at every restaurant

68
00:03:25,270 --> 00:03:27,290
and we compared all the IDs.

69
00:03:27,290 --> 00:03:29,730
And we now know that there is no restaurant

70
00:03:29,730 --> 00:03:31,700
with a matching ID.

71
00:03:31,700 --> 00:03:35,940
And therefore now is the time to send back an error response

72
00:03:35,940 --> 00:03:39,363
where we let the user know that we didn't have a match.

73
00:03:40,570 --> 00:03:44,220
Now, how should this error response look like?

74
00:03:44,220 --> 00:03:46,160
That is up to you.

75
00:03:46,160 --> 00:03:50,180
You could send back this restaurant-detail template,

76
00:03:50,180 --> 00:03:53,570
maybe with some alternative content.

77
00:03:53,570 --> 00:03:55,820
In this restaurant-detail template,

78
00:03:55,820 --> 00:03:58,560
we could also add a if check

79
00:03:58,560 --> 00:04:01,900
and then maybe check if we have any restaurant data,

80
00:04:01,900 --> 00:04:03,750
in which case we output that.

81
00:04:03,750 --> 00:04:06,550
And if we don't have any data, we output something else.

82
00:04:06,550 --> 00:04:08,870
That could be one option.

83
00:04:08,870 --> 00:04:11,350
An alternative would be to prepare

84
00:04:11,350 --> 00:04:15,053
a dedicated 404 error page.

85
00:04:17,120 --> 00:04:20,360
And we have all seen these kinds of pages

86
00:04:20,360 --> 00:04:23,200
where you visit some part of a website

87
00:04:23,200 --> 00:04:27,070
and all of a sudden you get this 404 error page

88
00:04:27,070 --> 00:04:30,003
that tells you that this resource couldn't be found.

89
00:04:30,890 --> 00:04:33,583
And I wanna indeed add such a page.

90
00:04:34,480 --> 00:04:39,480
So I'll add a brand new template, 404.ejs.

91
00:04:40,130 --> 00:04:43,410
And in there I'll grab the general skeleton

92
00:04:43,410 --> 00:04:45,780
from about.ejs let's say.

93
00:04:45,780 --> 00:04:48,293
So I'll copy that and parse that in here.

94
00:04:49,330 --> 00:04:54,330
But then here in this h1 tag on the 404.ejs page

95
00:04:55,700 --> 00:04:59,773
on this template, I'll say page not found.

96
00:05:00,640 --> 00:05:03,360
And then maybe we add some explanatory text below

97
00:05:03,360 --> 00:05:08,360
that where we say, unfortunately we weren't able to,

98
00:05:08,470 --> 00:05:11,923
whoops, we weren't able to find this page.

99
00:05:12,940 --> 00:05:14,230
And of course you could add

100
00:05:14,230 --> 00:05:16,500
a more detailed error message here,

101
00:05:16,500 --> 00:05:20,173
but I'll keep it fairly simple deliberately here.

102
00:05:22,020 --> 00:05:26,400
So now that's my 404 error page, which I wanna show

103
00:05:26,400 --> 00:05:28,323
if we don't find a restaurant.

104
00:05:29,480 --> 00:05:32,593
And to make that work, back in app.js

105
00:05:32,593 --> 00:05:35,520
after this for-loop as discussed,

106
00:05:35,520 --> 00:05:38,930
we can now again render a response,

107
00:05:38,930 --> 00:05:42,053
but now it's the 404.ejs file.

108
00:05:43,220 --> 00:05:45,910
And we don't need to parse any data into that

109
00:05:45,910 --> 00:05:48,880
because this template, in my case here at least,

110
00:05:48,880 --> 00:05:50,853
doesn't use any dynamic data.

111
00:05:52,840 --> 00:05:55,610
We also don't need to return here

112
00:05:55,610 --> 00:06:00,210
because previously I returned to force a stop

113
00:06:00,210 --> 00:06:02,570
of this function execution.

114
00:06:02,570 --> 00:06:05,840
Now, here we are at the end of the function anyways,

115
00:06:05,840 --> 00:06:09,570
there is no code after that, so we could return,

116
00:06:09,570 --> 00:06:12,160
but it really doesn't make a difference.

117
00:06:12,160 --> 00:06:15,820
The function execution stops after this line anyways,

118
00:06:15,820 --> 00:06:19,433
because this function in which we are here is done.

119
00:06:20,880 --> 00:06:22,223
And hence this is enough.

120
00:06:23,220 --> 00:06:25,760
And now with that, if you save this,

121
00:06:25,760 --> 00:06:28,820
if you reload this unknown ID,

122
00:06:28,820 --> 00:06:32,380
you now get this 404 content,

123
00:06:32,380 --> 00:06:34,600
which is better than timing out,

124
00:06:34,600 --> 00:06:36,760
and which clearly informs the user

125
00:06:36,760 --> 00:06:38,483
that something went wrong.

