Preview
Video Player
00:00
00:00
A Simple API
4:13Let's put the concepts we've learned into practice by building a very simple REST API!
Remember, unlike a traditional server-side
application, which responds to requests
0:00
with HTML, a REST-ful API responds with
data, most of the time a JSON object.
0:05
To see how this works,
0:09
let's write a simple route that
responds to a GET request with JSON.
0:11
To follow along with me, download the
starter files from the link on this page.
0:15
Locate the project folder
from the terminal and
0:20
run npm install,
to install the project's dependencies.
0:22
Then open the starter files in
your preferred text editor.
0:26
We're starting off with some standard
files for a basic Express app.
0:29
Along with a file called records.js,
and a file called data.json,
0:33
both of which we'll discuss very soon.
0:37
Right now, let's look at the app.js file,
0:39
which is where we'll
begin writing our code.
0:42
Open up that file, and
you'll see that we're importing express,
0:44
creating an express app,
and listening on port 3000.
0:48
We'll begin by creating
an Express GET route handler.
0:51
Recall that the Express function adds
a bunch of methods to Node's HTTP server,
0:55
to make it easier for
us to receive and respond to requests.
1:00
These Express methods include GET,
POST, PUT, and DELETE.
1:04
We're creating a GET method.
1:08
The GET method takes two arguments.
1:12
The first argument is the route
that we wanna handle.
1:14
Let's write some code that will respond
to a request to a route called greetings.
1:16
So in quotes, we'll say '/greetings'.
1:20
The second argument is the callback
function we want to run when this request
1:23
comes in, how we want to respond.
1:28
Recall that when a client, a browser, or
some other application makes a get request
1:33
to this URL, Express will run the code
inside of this callback function.
1:37
This callback function takes
at least two arguments,
1:43
one representing the incoming
request from the client, and
1:46
one representing the outgoing
response from the server.
1:49
By convention, they're both
typically shortened to req for
1:52
request, and res for response.
1:57
Recall that in a traditional
server-side Express application,
1:59
you'd respond to a client request
using the Express res.render function,
2:03
to render a template and
send HTML back to the client.
2:08
So you might do something like this.
2:11
You'd say
res.render('some_html_template').
2:13
But we don't wanna do that,
because we're building a REST API.
2:19
So inside the callback function,
we wanna send back JSON.
2:22
So to do that, we can use the JSON
method available on the response object.
2:25
So we can say res.json.
2:30
And we can pass the JSON method an object,
and
2:33
it will convert that object to JSON and
send it to the client.
2:36
So let's pass the JSON method an object.
2:41
And this object can be a greeting,
Hello World!
2:45
Now let's save and test this out.
2:49
Open up a terminal on your computer.
2:52
Or if you're using VS Code,
open your integrated terminal by
2:54
selecting it from the menu or
using the keyboard shortcut Ctrl+\.
2:58
Type npm start, to get the server running.
3:03
Recall that this project is using
nodemon to run the server, so
3:07
we don't have to keep restarting.
3:10
See the teacher's notes if you need
assistance installing nodemon.
3:12
As you can see from
the message in the console,
3:16
our app should be running
at local host 3000.
3:18
If we visit localhost:3000/greetings
from a browser,
3:21
You can see that our API is sending
JSON when we make a request.
3:28
The browser, by default,
sends a GET request.
3:32
By visiting localhost:3000/greetings,
3:35
we're sending a GET request to the
greetings route, which we've programmed in
3:38
our Express application to send back
a JSON object containing a greeting.
3:43
You've written code that responds
to JSON when a client makes
3:47
a request to an endpoint.
3:50
At a high level,
that's really all there is to it.
3:51
You've written a very simple REST API.
3:54
If all you want is a REST API that returns
a simple message, then congratulations,
3:56
you're done.
4:01
But we want a REST API that
provides much more functionality.
4:02
We want to display, create,
update, and delete quotes.
4:05
With this in mind,
let's plan out our application and
4:08
start building our first routes.
4:11