1
00:00:00,340 --> 00:00:04,950
Express handles requests through
routes that we can setup in the app.

2
00:00:04,950 --> 00:00:08,705
From a user's perspective,
a route is just like a URL.

3
00:00:08,705 --> 00:00:14,483
Like teamtreehouse.com/about,
teamtreehouse.com/home,

4
00:00:14,483 --> 00:00:17,631
or teamtreehouse.com/account.

5
00:00:17,631 --> 00:00:23,400
It's called a route, because it's the path
a user takes to access data on a server.

6
00:00:23,400 --> 00:00:25,670
From the application's perspective,

7
00:00:25,670 --> 00:00:31,330
a route (also called an end point)
is a command to run a specific function.

8
00:00:31,330 --> 00:00:34,350
Which in turn sends a response
back to the client.

9
00:00:35,450 --> 00:00:40,812
For example, about tells the application
to load the contents for the about page.

10
00:00:40,812 --> 00:00:44,670
Home might direct users to
the front page of the app.

11
00:00:44,670 --> 00:00:49,900
And an account route might trigger logic
that loads content from a user's account.

12
00:00:50,960 --> 00:00:53,230
When you type your URL
into your browser and

13
00:00:53,230 --> 00:00:58,970
hit return, the browser sends what's
called a get request to the server.

14
00:00:58,970 --> 00:01:03,410
This means,you are asking to view or
get a web page.

15
00:01:03,410 --> 00:01:06,210
Get is known as an HTTP verb,

16
00:01:06,210 --> 00:01:09,560
because it represents what
the client wants the server to do.

17
00:01:10,600 --> 00:01:14,340
In this case of get the client is simply

18
00:01:14,340 --> 00:01:18,020
asking the server to return something,
but what?

19
00:01:18,020 --> 00:01:22,760
The is where the URL comes in,
which is more like a noun or

20
00:01:22,760 --> 00:01:24,250
a resource as its called.

21
00:01:25,480 --> 00:01:30,410
The URL tells the server what to get for
the client.

22
00:01:30,410 --> 00:01:34,380
Get requests are the most common
requests made by browsers, and

23
00:01:34,380 --> 00:01:39,760
a server responds to a get request by
sending information off in a web page.

24
00:01:40,760 --> 00:01:45,410
But a browser can also send information
to the server. For example,

25
00:01:45,410 --> 00:01:51,940
when submitting a form to order something
online this is called a post request.

26
00:01:51,940 --> 00:01:55,070
A client sends the values of the form, and

27
00:01:55,070 --> 00:02:00,100
the server receives them and
processes those values in some way.

28
00:02:00,100 --> 00:02:04,080
There are other HTTP verbs besides get and
post, but

29
00:02:04,080 --> 00:02:06,790
we won't cover them in this course.

30
00:02:06,790 --> 00:02:14,280
Feel free to check out the teacher's notes
for other resources on HTTP requests.

31
00:02:14,280 --> 00:02:18,993
What happens when the client makes
a request to a route that the server

32
00:02:18,993 --> 00:02:20,952
isn't set up to respond to?

33
00:02:20,952 --> 00:02:24,672
For example, a URL like

34
00:02:24,672 --> 00:02:33,791
https://teamtreehouse.com/does-not-exist.

35
00:02:33,791 --> 00:02:39,000
In this case, the server would send back
an error, like a page not found error.

36
00:02:39,000 --> 00:02:44,930
This is commonly called a 404,
because of the associated status code.

37
00:02:44,930 --> 00:02:49,290
There's a link in the teacher's note where
you can read more about status codes.

38
00:02:50,450 --> 00:02:55,030
Speaking of 404's,
if I open up the DevTools in my browser,

39
00:02:56,930 --> 00:02:59,980
you can see I'm getting a 404 error code.

40
00:03:01,310 --> 00:03:07,430
Again, that's because express doesn't have
any resources to return for this route.

41
00:03:08,460 --> 00:03:10,220
Let's change that by adding one.

42
00:03:11,570 --> 00:03:17,010
To create a route, I will use
the get method on the app object.

43
00:03:19,390 --> 00:03:25,050
The get method is used to handle
the get requests to a certain URL.

44
00:03:26,150 --> 00:03:31,940
For this example, we're going to create
a route for the root route for our app.

45
00:03:31,940 --> 00:03:36,860
In other words, this is the route to
follow if a visitor just visits our site

46
00:03:36,860 --> 00:03:39,770
without specifying a particular folder or
file.

47
00:03:40,850 --> 00:03:44,320
For example,
when you type in teamtreehouse.com,

48
00:03:44,320 --> 00:03:48,390
you get treehouse's root route.

49
00:03:48,390 --> 00:03:55,420
Then if I go to Stories,
which is teamtreehouse.com/stories,

50
00:03:55,420 --> 00:03:59,640
you get the Success Stories for
some of our students.

51
00:03:59,640 --> 00:04:05,590
The root route is also one we visited
when we got the 404.

52
00:04:05,590 --> 00:04:13,000
To indicate the site's root route we
use the slash as the first parameter.

53
00:04:13,000 --> 00:04:16,700
The first parameter is sometimes
called the location parameter.

54
00:04:18,060 --> 00:04:20,790
The second parameter of the get method

55
00:04:20,790 --> 00:04:23,760
is going to be an anonymous
callback function.

56
00:04:23,760 --> 00:04:27,930
This function is going
to take two parameters,

57
00:04:27,930 --> 00:04:33,171
a request object And a response object.

58
00:04:38,598 --> 00:04:43,480
This callback will run when
the client requests this route.

59
00:04:43,480 --> 00:04:48,340
We'll talk more about the request and
response objects throughout this course.

60
00:04:49,350 --> 00:04:54,472
For now, we're going to use
the response's send method.

61
00:04:58,215 --> 00:05:02,163
The send method sends
a string to the client.

62
00:05:04,592 --> 00:05:09,810
Now when we refresh the page,
you notice we still get an error.

63
00:05:09,810 --> 00:05:13,350
The reason is because even
though we changed our code,

64
00:05:13,350 --> 00:05:18,040
the express server is still
serving up the old code.

65
00:05:18,040 --> 00:05:22,690
The express server needs to be
restarted to apply the new route, and

66
00:05:22,690 --> 00:05:24,730
the changes we've made.

67
00:05:24,730 --> 00:05:30,570
We can do this from the command line
by hitting Ctrl+C to stop the server.

68
00:05:30,570 --> 00:05:32,230
Since the server is stopped,

69
00:05:32,230 --> 00:05:35,390
we'll need to start it back up
the same way we did the first time.

70
00:05:37,120 --> 00:05:45,130
When we visit localhost:3000 now,
we see our application now works.

71
00:05:46,140 --> 00:05:50,590
One more thing,
if you don't have nodemon installed yet,

72
00:05:50,590 --> 00:05:53,540
I would recommend you doing that for
this course.

73
00:05:53,540 --> 00:05:58,015
I'll be using it throughout this
course to restart the express server.

74
00:05:58,015 --> 00:06:02,010
It's also generally a good thing to
have on hand for node development.

75
00:06:02,010 --> 00:06:07,050
Without it, you'd be restarting the server
every time you made a change to your code

76
00:06:07,050 --> 00:06:10,450
which can get really old, really fast.

77
00:06:10,450 --> 00:06:14,914
To install it, just type npm

78
00:06:14,914 --> 00:06:20,500
install -g nodemon and hit Enter.

79
00:06:22,830 --> 00:06:27,230
To use it, make sure that package.json
has the property main and

80
00:06:27,230 --> 00:06:29,540
it points to the right entry file for
your app.

81
00:06:30,820 --> 00:06:33,070
In our case, the entry file or

82
00:06:33,070 --> 00:06:38,490
file that will run to start
the express app is app.js.

83
00:06:38,490 --> 00:06:45,750
Now I can just go to my terminal and type
nodemon, and it will run the right file.

84
00:06:47,360 --> 00:06:50,600
Congratulations on your first express app.

85
00:06:50,600 --> 00:06:51,430
On the next video,

86
00:06:51,430 --> 00:06:54,740
we´ll make some adjustments to
enhance our basic application.