1
00:00:00,510 --> 00:00:02,990
Let's practice writing middleware.

2
00:00:02,990 --> 00:00:05,830
Here's a minimal Express app we can use.

3
00:00:05,830 --> 00:00:08,320
Download the code below to follow along.

4
00:00:08,320 --> 00:00:10,890
I'll start the app in
the terminal using nodemon.

5
00:00:12,090 --> 00:00:16,540
If I go to the browser and
pull up localhost:300,

6
00:00:16,540 --> 00:00:20,690
I get this message telling
me the app is working.

7
00:00:20,690 --> 00:00:25,020
Great, now let's write some
middleware into the app.

8
00:00:25,020 --> 00:00:29,798
Remember, to write middleware,
you pass a function to app.use.

9
00:00:36,132 --> 00:00:41,810
And we'll need our three parameters,
request, response, and next.

10
00:00:43,630 --> 00:00:52,340
Inside this function,
let's just log One to the console.

11
00:00:52,340 --> 00:00:53,556
And then we'll call next.

12
00:00:56,050 --> 00:00:59,820
We'll look more closely into
the next function soon.

13
00:00:59,820 --> 00:01:02,510
But for now, it's enough to know that

14
00:01:02,510 --> 00:01:06,850
we're just calling it to end this piece
of middleware and move to the next.

15
00:01:06,850 --> 00:01:10,300
So to run this,
we'll need to send a request to the app.

16
00:01:10,300 --> 00:01:14,380
Let me save this and we'll switch over.

17
00:01:14,380 --> 00:01:17,750
I'm just gonna clear my console so
we can see it clearly.

18
00:01:17,750 --> 00:01:22,140
And I'm switching over to my browser, and
I'm gonna make a request with the browser.

19
00:01:22,140 --> 00:01:25,400
So I'll refresh it, and
that will send the request.

20
00:01:25,400 --> 00:01:28,585
And then we see we logged One, great.

21
00:01:28,585 --> 00:01:35,460
So now, let's copy this piece of
middleware and paste another one below.

22
00:01:36,490 --> 00:01:39,118
And we'll log Two.

23
00:01:39,118 --> 00:01:43,740
So we'll save this, and
clear out the terminal.

24
00:01:45,010 --> 00:01:49,650
And then refresh the browser,
and we get One, Two.

25
00:01:50,780 --> 00:01:55,700
So I wanted to just show you that
middleware always fires in order.

26
00:01:55,700 --> 00:01:59,710
So this function will always
fire before this one.

27
00:01:59,710 --> 00:02:06,490
And we can also pass several functions
to the same app.use call as parameters.

28
00:02:06,490 --> 00:02:09,050
So to do that,
I'll just copy this function.

29
00:02:11,420 --> 00:02:14,370
And I'll place a comma and paste.

30
00:02:14,370 --> 00:02:19,920
And now we're passing two
functions into this app.use call.

31
00:02:19,920 --> 00:02:22,570
And it will say, One and a half.

32
00:02:23,600 --> 00:02:30,220
So we'll expect One to fire first, or to
log rather, One and a half, and then Two.

33
00:02:31,480 --> 00:02:37,340
So we'll switch back over,
clear the terminal and refresh.

34
00:02:37,340 --> 00:02:39,770
And we get our middleware in order.

35
00:02:41,340 --> 00:02:45,700
So we've just seen two ways to include
middleware functions in an app.

36
00:02:45,700 --> 00:02:51,450
You can call app.use as many times as you
like, passing a function to each call.

37
00:02:51,450 --> 00:02:57,560
You can also pass as many functions as
you want to, to a single app.use call.

38
00:02:57,560 --> 00:03:00,610
Express will always run these
functions in the order they appear.

39
00:03:02,145 --> 00:03:06,679
Let's trigger middleware based on
the URL or route a user visits.

40
00:03:07,710 --> 00:03:13,256
We can do this by placing the URL
as the first argument to app.use.

41
00:03:13,256 --> 00:03:19,840
Let's route this first app.use to /one.

42
00:03:19,840 --> 00:03:24,440
So if I save this, clear the terminal.

43
00:03:24,440 --> 00:03:29,030
And now if I refresh,
then refresh the root route of the app.

44
00:03:29,030 --> 00:03:34,310
So we won't see One, One and
a half, but we do see Two.

45
00:03:34,310 --> 00:03:37,800
And that's because if you don't
specify a route parameter,

46
00:03:38,940 --> 00:03:42,130
this middleware is gonna run for
every route we hit.

47
00:03:43,730 --> 00:03:51,120
So now let's fire the rest of
our middleware by going to /one.

48
00:03:51,120 --> 00:03:54,540
And you see that we got One,
One and a half, and Two.

49
00:03:55,710 --> 00:03:59,440
You can also pass information
between functions.

50
00:03:59,440 --> 00:04:04,140
Let me clear out the second function and
this route.

51
00:04:05,700 --> 00:04:08,960
And we're going to modify
the request object.

52
00:04:08,960 --> 00:04:14,040
So we'll add a property
onto it called message,

53
00:04:15,660 --> 00:04:19,950
and we'll set it equal to,
This message made it.

54
00:04:21,290 --> 00:04:26,420
Now in the second piece of middleware,
we're just going to read that

55
00:04:28,620 --> 00:04:32,570
property back out, req.message.

56
00:04:32,570 --> 00:04:38,770
If I save that, clear the terminal,
and refresh, This message made it.

57
00:04:39,900 --> 00:04:43,310
And middleware will often
modify the request object

58
00:04:43,310 --> 00:04:47,190
to offer data to later
middleware functions.

59
00:04:47,190 --> 00:04:49,810
You'll see this in action
later in this workshop,

60
00:04:49,810 --> 00:04:52,650
when we use the body parser middleware.

61
00:04:52,650 --> 00:04:56,620
Body parser creates a body
property on the request object

62
00:04:56,620 --> 00:04:59,460
that we can use to form
a response to the client.

63
00:05:00,610 --> 00:05:04,880
Let's have a look at the next function,
in the next video.