Name: Create A Paginated API With Node.js - Complete Tutorial
Uploaded: 2020-03-28T16:43:44.000Z
Duration: 23 min 21 s
Description: Thousands of YouTube videos with English-Chinese subtitles! Now you can learn to understand native speakers, expand your vocabulary, and improve your pronunciation...

Future simple

In today's video, we're gonna look at pagination, which is the ability to return just a subset of the results from your A p I to the users so that they can go page forward or Paige back, just the same as how Google search works.

Present continuous

And we're gonna tackle this in three different ways.

First, we're gonna build just the most basic pagination that you can build inside of an A p I.

Secondly, we're gonna take that a step further, and we're gonna make a nice middle where for a pagination so we can apply it to any of the resource is in our a p I.

And then third, we're gonna hook up this simple section of our pagination to a database that we actually have a real world mongo D B database that we can paginated with our A.

Now, as always, I just have a completely blank folder open in visual studio code, and the very first thing we need to do is to run N p m on it with the dash.

Why is the flag and this is going to initialize the repositories with a package da Jason.

Next we need to install the dependencies we're gonna use.

And since we're going to use this server, we need to install Express, which is going to be the framework for our server.

Also, we're gonna install a dead dependency by typing and dash dash save, Dev, And this is going to be for node mon.

And what Node Mon allows us to do is it automatically refreshes our server every single time we make changes.

This way, we don't have to manually stop and start our server every time we make changes now in the package dot Jason, in order to use Node mon, I was just create a simple script.

We're gonna call it Deb start and inside this script, we just want to put no daemon.

And we want to put our server dot Js file just like this and this is going to be a file that we're gonna create now.

So let's create that server dot Js and this is going to be where all of our server code goes.

So let's just make sure we save our package, Jason and then inside of our server dot Js, let's set up the most basic express server we can.

So we want our express variable which we could get from the express library.

We could just say require express And then we also want to get the app portion of that which is just calling this express function flips just like that.

And then lastly, we can just say ap dot Listen, and we can give it a port, for example Port 3000.

And now if we come down here and we type and PM run Dev start, which is that command we just created, you'll see that our server is gonna start up and you say it's starting note server dot Js and our application is listening on Port 3000 and this is great, But right now, we aren't doing anything with this server.

So let's set up our very first route, which is going to be getting a list of users.

We can do that very simply by saying app dot get and we want to get users so we could just say slash users.

And of course, we have a request and our response variable.

And in here we just want to return our users so we could just say, responsive dot Jason, we want to return users, so let's just create that users variable.

And as I mentioned at the beginning of this video, the very first step is just a very simple pagination.

We're not gonna worry about the database that's going to come later in the video.

So for now, we're just gonna create a user's variable.

And we're gonna set this tour own array and inside of here, what's put our user objects.

So our users are goingto have, Let's say an I d of one and we're gonna give them a name, for example user one.

And now I'm just gonna copy this down a bunch of different times so we can simulate having a bunch of users.

I'm just gonna income in all of these numbers just like this.

10 11 12 13 and same thing for the names of the users.

Now, if we go down here, save this, you see our application restarted and we can create a file over here, which is gonna be called request dot rest.

And I'm using an extension in visual studio code this extension here is called Where can rest client right here.

And this allows me to make rest request inside of a file called dot rest, for example, we can say that we want to get at a local host 3000.

Make sure you put http at the beginning slash Slash and we want to get slash users just like that and you see the center request button.

If I click that, you'll see it makes the request over here.

As you can see, we get our list of users return to us in Jason, so we know their application is actually working.

Go back to our server so we know that our users is working.

But we actually want to be able to pass what Paige and what offset we want so that we could get on Lee.

The resource is we want and not the whole list because you can imagine this close could be thousands of users long, and we don't want all the users every single time.

So, for example, let's look at our request here, and maybe we want to build a pass.

Some resource is, for example, we want to be able to pass that we want to have a page, Let's say, for example, page one and we also want to pass a limit.

We want the limit here just to be five, for example.

Give me the first page of users and I only want five users from that page.

Obviously, right now, if we send that request, we still get all the users.

So let's go into our server and start implementing this.

So inside of this get users function we want to build to get those variables we just passed up.

So we have our page, which is equal to request Doc.

Query got Paige and the exact same thing for that limit.

Now we're actually processing this page and limit request that's being sent up to us, and all we need to do is actually get the array that we're returning right now, which is all of our users, and condense that toe only the specific page and the specific users in that limit range.

And the easiest way to do that is to get this START index and the end index of where we're going to be QUERIAN and start indexes, actually fairly simple over doing is taking our page minus one, and we're just multiplying.

So what it's saying is we know that our page that we're on is going to be a page we want.

For example, one is going to be a page one page to his page, too.

But since a raise our zero indexed and these pages are one indexed, we need to make sure we subtract one.

Because Page one is essentially the same as starting a Index zero insider application.

So one minus one would be zero times our limit.

We start at Index zero now moving on to the end index.

This is just going to be a page times limit because we don't need to worry about subtracting one, since we want to get the very end of our array and not the beginning of it.

So now that we have our Start Index and our end index we can do is actually query our users to return just the users in between the start and end index, and that's actually fairly straightforward.

Well, we need to do is say, users dot slice and the slice method.

We pass it a start and an end number and it gives us everything between those So we can just say Start index and End Index.

So we could just set this to result users and let's actually return.

Now let's make this request again and you can see we get users.

1234 and five These air just our 1st 5 users.

If we change our page to page to make a request, You see, we get the next five, we get six through 10 and we could maybe change this to be a limit of three.

And now if we make the request, you see, we get 456 which is the second page, if you limit by three.

But usually when you have a paginated a p I, you actually want to return somewhere inside that a p I what the next page would be and the previous page so that the user knows if there is a next page or if there isn't a next page and same thing with previous page.

It just makes it easier for the client consuming the AP.

I So in order to do this, we actually want to upend extra results to here.

And we're gonna set it to an empty object.

And then our result users were just gonna save results.

Dot results is going to be equal to thes users, and then we want to return our results.

So now in our request, if we make this again, you see, we have a result section which is going to return our array of users and I we can actually put extra information inside of our object for the next and the previous pages.

So we can say results dot next, and this is just going to be equal to empty her an object.

And the object is goingto have a page as well as a limit property.

And now the limit property is going to stay exactly the same.

We're just gonna pass the limit they passed us.

But as for the page, we actually want to pass the next page.

And we could do the same exact thing for previous.

And as you guessed that, we just want to do Paige minus one.

Subtitles ListPlay Video

Create A Paginated API With Node.js - Complete Tutorial

bunch

properly

exact

express