- [Instructor] Okay, so as we move forward
with our server development,
it's going to be very important for us
to have an easy and reliable way to test our server.
So far what we've been doing
is just typing the URL into our browser,
and this has worked
but for some of the more complicated operations
we're going to want to to implement,
this won't be quite good enough.
What a lot of people do to test their back end
is to develop a feature on the front end first,
and then use that to test the back end.
But in practice, I found that it's generally much easier
to develop the back end first,
and then build out
the corresponding front end functionality,
or just develop the two things separately,
and then bring them together,
which is what we're doing in this course.
So a tool that's used by many back end developers
for this sort of back end first testing
is a piece of free software called Postman.
If you don't already have Postman,
you can find it at the URL
that you see up here,
right now that's postman.com/downloads,
and you're just going to want to download
and walk through the installation steps, okay?
And once you've downloaded and installed Postman,
it looks something like this,
let's use it to query our back end.
So if you don't already have your server up and running,
let's do so by typing npx babel-node,
source/server.js, and hit Enter
and then we're going to use Postman
to send a GET request
to that hello-endpoint that we created earlier.
So here's what that's going to look like.
You're going to click this little plus tab up here
that'll open up a new request,
and we're going to select GET from the drop down here,
which should be the default,
and in the URL here,
we're just going to type localhost8000/hello,
and to send a request,
we're going to click the Send button
and there we go.
We see that we get the hello response back
from our servers endpoint.
So for those of you who aren't familiar
with the different request types,
such as GET and POST and PUT
and all those different request types,
all you'll need to know for this course
is that GET requests are usually used
to well get information from the server,
such as products, or a user's cart,
those kind of things.
And POST requests are usually used
to modify something on the server,
such as if we wannna add an item to the cart.
And there's also DELETE requests,
which we'll be using later on in the course,
that are usually used
whenever we want to delete
some sort of resource on the server.
So we'll be using that when we want
to remove an item from a user's cart, for example.
Now the additional thing to know about POST requests
is that they can have what's called a request body.
Generally, when we send GET requests,
the only extra information that we send,
if we send any at all
is going to be the headers.
But when we send POST requests,
a lot of the time we're going to want to
send along extra information,
which we can do by using the request body
and we'll see how to do this very soon.
Now, POST requests as I mentioned before,
allow us to pass extra data along to our back end.
So why don't we go back to our server
and create a post route
that's similar to the Hello GET route that we created,
except with our post route
what we want to do
is send along our name to it
in the request body,
and then we want to have it send us back
hello with our name after it.
So let's go back to our server,
and to tell our app how to respond to POST requests
on the hello endpoint,
what we have to do is just add another route here,
which is going to look like this.
We're going to say app dot post and slash hello
and it's perfectly fine to have both a post
and a get endpoint on the same path, right?
It'll know which one to respond to
based on which type of request we send.
So the callback here is going to be pretty much the same,
we're going to say request and response just like that.
So we'll see how to implement
the actual body of this callback in just a second.
The first thing we're going to do though
is take a look at how to send some extra data
along with our POST requests in Postman.
Postman has this little tab here that's body,
and if we click on that,
it allows us to pass along extra data
that it will send with our POST request, okay?
So what we want to do
is select raw here
and we want to change this to JSON,
and what we're going to do
is define a JSON object here
that will send along with our post request
to localhost8000/hello,
and that's going to look like this.
It's just going to be a simple JSON object
with a name property,
and I'm going to use my name here
but feel free to use your own.
And once we actually get our post endpoint
set up on our server,
we'll be able to send this request along to our server,
and it will pull out our name
from the request body
and it'll be able to do whatever we want with it, okay?
So before we're able to do that though,
what we need to do
is express can't actually parse the body
of a request on its own.
What we need to do in order to make it do that
is install a package called bodyParser, okay?
So let's open up a terminal
and type in npm install,
body-parser and hit Enter.
And once that completes inside our server.js file,
we just need to add two things.
First, we need to import bodyParser up at the top.
So we're goinna say,
import bodyParser from body-parser
and then under where we create our app,
we're just going to say app.use,
and then we're going to say bodyParser.json, okay?
And what this line here does
is it parses the JSON object
that we've included with our request body,
this object here,
and it adds a body property
to the request argument for our callbacks.
So if our request body looks like
this one that we're sending from Postman,
the way that we can send back hello
with our name in the message
is going to be like this.
We're going to say response.send,
and then we're going to say,
and we'll use backticks here,
we'll say, "Hello"
and we'll use a template string here
to insert request.body.name,
which is going to contain the value
that we're parsing along
with our request body's name property.
And now if we restart our server,
and just as a side note,
we do have to manually restart our server right now
in order for these changes to take effect,
we'll see how to get around that in a little while.
So if we say npxbabelnodesourceserver.js,
that should successfully restart our server,
and now if we send this post request along to our server,
we'll see that we get back the message, "Hello"
with our name stuck into the string.
So what this means is that our server
is correctly pulling this name property
out of our request body,
and it's responding
with part of that request body in its response.
And this is a really simple example,
but now that we understand
the basic mechanics of interacting with an express server,
we can move on to making it do some more helpful things.