1
00:00:00,630 --> 00:00:01,463
Instructor: In the last section,

2
00:00:01,463 --> 00:00:03,480
we did some initial setup for our server.

3
00:00:03,480 --> 00:00:05,643
Let's continue with our app setup.

4
00:00:07,110 --> 00:00:07,943
The first two lines

5
00:00:07,943 --> 00:00:09,480
that we're gonna put in here for our app setup

6
00:00:09,480 --> 00:00:11,880
are just a little bit of boiler plate.

7
00:00:11,880 --> 00:00:13,590
They're kind of those gotcha things

8
00:00:13,590 --> 00:00:15,780
that you just gotta put in without really knowing

9
00:00:15,780 --> 00:00:16,620
ahead of time,

10
00:00:16,620 --> 00:00:18,570
having a good inclination of why you might.

11
00:00:18,570 --> 00:00:21,060
So just bear with me as we write the code down

12
00:00:21,060 --> 00:00:23,520
and then we'll talk about exactly what it's doing.

13
00:00:23,520 --> 00:00:24,570
The first thing we're gonna do

14
00:00:24,570 --> 00:00:29,250
is we're going to tell our app to use Morgan

15
00:00:29,250 --> 00:00:32,103
and then we're gonna pass Morgan a string of combined.

16
00:00:33,840 --> 00:00:36,660
We'll do one more and then we'll talk about what's going on.

17
00:00:36,660 --> 00:00:40,950
Gonna put app.use bodyParser.json.

18
00:00:43,020 --> 00:00:46,830
I'm going to invoke json opacity object,

19
00:00:46,830 --> 00:00:50,220
which is gonna have type star slash star.

20
00:00:50,220 --> 00:00:51,720
Make sure you gotta a forward slash in there

21
00:00:51,720 --> 00:00:53,970
between the two asterisks.

22
00:00:53,970 --> 00:00:56,520
Okay, so in both cases,

23
00:00:56,520 --> 00:00:58,350
Morgan and body parser

24
00:00:58,350 --> 00:01:01,980
are what we refer to as middleware in Express.

25
00:01:01,980 --> 00:01:03,030
Middleware in Express

26
00:01:03,030 --> 00:01:05,730
is something that any incoming request

27
00:01:05,730 --> 00:01:07,410
is gonna be passed into.

28
00:01:07,410 --> 00:01:09,990
So any incoming request into our server

29
00:01:09,990 --> 00:01:11,700
is going to pass into Morgan

30
00:01:11,700 --> 00:01:15,330
and it will also be passed into body parser by default.

31
00:01:15,330 --> 00:01:18,030
That's what the app.use function right here does.

32
00:01:18,030 --> 00:01:20,073
It registers them as middleware.

33
00:01:21,600 --> 00:01:24,450
Morgan right here is a logging framework.

34
00:01:24,450 --> 00:01:26,742
So previously,

35
00:01:26,742 --> 00:01:29,010
when we start up the server in the last section

36
00:01:29,010 --> 00:01:30,960
and I went to local host 30 90.

37
00:01:30,960 --> 00:01:32,370
I'm gonna restart my server

38
00:01:32,370 --> 00:01:35,370
by pressing control C to stop it.

39
00:01:35,370 --> 00:01:36,460
I'm gonna restart it

40
00:01:37,350 --> 00:01:39,180
and now I'm gonna go back to my browser

41
00:01:39,180 --> 00:01:40,593
and refresh the page.

42
00:01:42,749 --> 00:01:44,400
And not quite happening yet.

43
00:01:44,400 --> 00:01:45,330
That's okay.

44
00:01:45,330 --> 00:01:46,443
Oh, I didn't save it.

45
00:01:47,820 --> 00:01:48,653
Save the file,

46
00:01:48,653 --> 00:01:49,770
restart the server.

47
00:01:49,770 --> 00:01:50,673
My mistake.

48
00:01:52,620 --> 00:01:54,270
And I can now refresh in the browser

49
00:01:54,270 --> 00:01:57,840
and you can see that I'm getting some logging in here.

50
00:01:57,840 --> 00:01:59,070
So that's what Morgan does.

51
00:01:59,070 --> 00:02:01,320
Morgan is a logging framework.

52
00:02:01,320 --> 00:02:04,650
You can see that it's logging that there was a GET request

53
00:02:04,650 --> 00:02:06,840
made to forward slash.

54
00:02:06,840 --> 00:02:10,110
And we responded with a 404 to it.

55
00:02:10,110 --> 00:02:13,410
So again, Morgan is just about logging incoming requests.

56
00:02:13,410 --> 00:02:16,173
It's mostly, we'll be using it for debugging.

57
00:02:17,790 --> 00:02:20,550
Body parser is another middleware

58
00:02:20,550 --> 00:02:23,733
that is used to parse incoming requests.

59
00:02:24,600 --> 00:02:27,570
Specifically.,It's gonna parse them into json

60
00:02:27,570 --> 00:02:29,250
and it's going to attempt to do so

61
00:02:29,250 --> 00:02:31,830
no matter what the request type is.

62
00:02:31,830 --> 00:02:33,720
So this might lead to some problems down the line

63
00:02:33,720 --> 00:02:36,000
if say we're trying to post a file

64
00:02:36,000 --> 00:02:39,000
or we're trying to make an HTTP request or what have you.

65
00:02:39,000 --> 00:02:39,833
But for right now,

66
00:02:39,833 --> 00:02:40,920
it's gonna work out just fine.

67
00:02:40,920 --> 00:02:43,530
Basically, any request that's incoming,

68
00:02:43,530 --> 00:02:45,840
it's gonna be parsed as though it were json.

69
00:02:45,840 --> 00:02:48,440
That's all we need to be concerned about right here.

70
00:02:49,560 --> 00:02:51,300
So one thing that I hope you just noticed

71
00:02:51,300 --> 00:02:54,300
was me just making a mistake and restarting the server

72
00:02:54,300 --> 00:02:57,870
without having saved the file was kind of annoying, right?

73
00:02:57,870 --> 00:03:00,120
That could probably be a little bit better.

74
00:03:00,120 --> 00:03:03,660
So there is a fantastic helper module called Nodemon

75
00:03:03,660 --> 00:03:05,910
that's gonna help us out with our development.

76
00:03:05,910 --> 00:03:06,870
Let's install it,

77
00:03:06,870 --> 00:03:07,703
get it running,

78
00:03:07,703 --> 00:03:09,240
and we'll talk about exactly what it's doing.

79
00:03:09,240 --> 00:03:10,410
But I guarantee you,

80
00:03:10,410 --> 00:03:11,913
you are gonna like Nodemon.

81
00:03:13,590 --> 00:03:15,000
So back in my terminal,

82
00:03:15,000 --> 00:03:18,510
I'm going to close the server with control C

83
00:03:18,510 --> 00:03:21,510
and then I'm going to run npm install

84
00:03:21,510 --> 00:03:26,510
dash dash save nodemon.

85
00:03:26,550 --> 00:03:30,153
N-O-D-E-M-O-N without any spaces.

86
00:03:34,050 --> 00:03:35,310
So what Nodemon does

87
00:03:35,310 --> 00:03:39,660
is it watches our project directory for any file changes.

88
00:03:39,660 --> 00:03:41,340
If a file ever changes,

89
00:03:41,340 --> 00:03:43,920
it's going to immediately restart the server

90
00:03:43,920 --> 00:03:45,360
so that the server is updated

91
00:03:45,360 --> 00:03:47,430
with whatever changes we just made.

92
00:03:47,430 --> 00:03:48,300
And so what that means is

93
00:03:48,300 --> 00:03:50,190
we can just go ahead and edit this file

94
00:03:50,190 --> 00:03:53,220
or edit anything in our server as much as we want.

95
00:03:53,220 --> 00:03:55,290
And whenever we tab back over to the browser

96
00:03:55,290 --> 00:03:58,710
and say we tried try to refresh the page or what have you.

97
00:03:58,710 --> 00:04:00,600
When we refresh the page,

98
00:04:00,600 --> 00:04:02,850
Nodemon will have already restarted our server

99
00:04:02,850 --> 00:04:05,500
and we'll get access to all the most up to date code.

100
00:04:06,990 --> 00:04:09,060
So it looks like our Nodemon install is done.

101
00:04:09,060 --> 00:04:11,760
All we need to do now is wire it up.

102
00:04:11,760 --> 00:04:14,700
To do so, we're going to make a new script

103
00:04:14,700 --> 00:04:17,072
inside of our package.json file.

104
00:04:18,180 --> 00:04:20,160
So you can see the scripts directory here.

105
00:04:20,160 --> 00:04:23,703
The purpose of scripts are just to define command line.

106
00:04:24,960 --> 00:04:27,240
Basically commands to run at the command line

107
00:04:27,240 --> 00:04:29,010
in an abbreviated format.

108
00:04:29,010 --> 00:04:31,380
So we're going to add one command in here.

109
00:04:31,380 --> 00:04:35,010
I'm gonna put a comma at the end of the existing script

110
00:04:35,010 --> 00:04:38,760
and then we'll put inside of double quotes

111
00:04:38,760 --> 00:04:41,190
dev and then colon.

112
00:04:41,190 --> 00:04:44,973
And then we'll say nodemon index.js like so.

113
00:04:45,870 --> 00:04:47,580
I'll save this.

114
00:04:47,580 --> 00:04:50,130
Flip back over to the terminal.

115
00:04:50,130 --> 00:04:53,100
And to run that script that we just named Dev.

116
00:04:53,100 --> 00:04:56,163
We just run npm run dev.

117
00:04:58,110 --> 00:04:59,670
So this is gonna start Nodemon up.

118
00:04:59,670 --> 00:05:02,760
You can see the Nodemon command right there.

119
00:05:02,760 --> 00:05:06,060
It's watching the current working directory

120
00:05:06,060 --> 00:05:07,860
for any file change

121
00:05:07,860 --> 00:05:11,193
and it's going to start node index.js.

122
00:05:12,630 --> 00:05:14,850
So just to verify that the servers still up.

123
00:05:14,850 --> 00:05:16,560
I'm gonna make a refresh here.

124
00:05:16,560 --> 00:05:17,580
I see the,

125
00:05:17,580 --> 00:05:18,810
I get the console log over here,

126
00:05:18,810 --> 00:05:20,670
it's still in air, totally fine.

127
00:05:20,670 --> 00:05:21,780
But let's see what happens

128
00:05:21,780 --> 00:05:23,970
when we make a change to our file.

129
00:05:23,970 --> 00:05:26,970
Let's say any change is going to trigger Nodemon.

130
00:05:26,970 --> 00:05:29,133
So it can even be a comment.

131
00:05:30,870 --> 00:05:32,280
I'm gonna add in a comment.

132
00:05:32,280 --> 00:05:34,080
I'm gonna save it.

133
00:05:34,080 --> 00:05:35,100
If I flip back over,

134
00:05:35,100 --> 00:05:37,980
we see restarting due to changes.

135
00:05:37,980 --> 00:05:41,373
I can go back over to my browser and boom, here we go.

136
00:05:42,459 --> 00:05:46,110
I'm gonna put in some new lines just because.

137
00:05:46,110 --> 00:05:48,240
I'm gonna delete the comment,

138
00:05:48,240 --> 00:05:50,070
save the file,

139
00:05:50,070 --> 00:05:53,130
and boom, Nodemon restarted my server again.

140
00:05:53,130 --> 00:05:54,660
So basically with Nodemon,

141
00:05:54,660 --> 00:05:58,320
all we ever have to do is run npm run dev,

142
00:05:58,320 --> 00:05:59,550
and we're pretty much good

143
00:05:59,550 --> 00:06:01,680
for all development on our node server.

144
00:06:01,680 --> 00:06:03,930
We don't have to mess around with anything else

145
00:06:03,930 --> 00:06:06,450
or restart it at any time.

146
00:06:06,450 --> 00:06:09,660
So it's a fantastic little tool to have around.

147
00:06:09,660 --> 00:06:12,180
Okay, so with that nice little tip out of the way

148
00:06:12,180 --> 00:06:13,530
and our app set up,

149
00:06:13,530 --> 00:06:15,387
all done with our Morgan middleware

150
00:06:15,387 --> 00:06:17,760
and our body parts or middleware.

151
00:06:17,760 --> 00:06:18,780
Excuse me.

152
00:06:18,780 --> 00:06:20,370
Let's get started in the next section

153
00:06:20,370 --> 00:06:21,690
where we're going to figure out

154
00:06:21,690 --> 00:06:24,420
how to make actual requests to our API

155
00:06:24,420 --> 00:06:27,180
that get responded to with json.

156
00:06:27,180 --> 00:06:28,830
I'll see you in the next section.