Implement Search, Sort, Filter and Pagination Rest API With Node JS | Express | MongoDB

what's up guys welcome to my channel today  we're gonna be building this awesome project   with mern stack by building this project  you're gonna learn how to create api which   handle pagination sort filter and search yes all  this in one api and we also gonna learn how to   call this api and show the data in beautiful  ui from front end so why do we need to build   api like this because by adding search filter  with pagination makes it easier for the user   to find what he is looking i am so excited to  build this project for you guys i hope you too   i recommend you to have basic knowledge of  node and react for building this project   before we jump into our vs code  those who new to this channel   i highly recommend you to subscribe and like this  video so without wasting time let's get started   first open up a command prompt in your computer  then create a folder named imdb clone after   creating this folder navigate into it inside this  folder create server folder where we write all   our backend code let's initialize server folder  with npm with default values after initializing   let's install dependencies we need in this project  which are express mongoose dotenv cors and nodemon after installing dependencies open this  project in vs code with this command   ok now we are in vs code first open package.json  file change main file to be server.js   inside scripts remove test command and  add start command to be nodemon server.js after making changes save this file in  root directory create file named server.js inside this file import dot env module then import  express module and also import course module   first save express instance in app variable  we're gonna use express.json and cors define port variable its value can be port  defined in environment or 8080 then we gonna   listen our app on port and console.log save this  file and create dot env file in root directory in this file add your mongodb url   after adding url save this file and  create dbconnect.js file in root directory in this file import mongoose module then create  arrow function name db connect and don't forget   to export inside this function add connection  params variable which will be use new url   parser to be true with mongoose.connect  method we will connect to our database   it required two params database url and connection  params on connected event we will console log   connected to database successfully on error  event we console log error occurred while   connecting to database and we also console log  error on disconnected event we will console log   mongodb connection disconnected that's it  guys save this file and open server.js file here import dbconnect file and call  the function so that we can connect   to our database save this file now let's  create models folder in root directory inside that folder create movie.js file in this file import mongoose module we  gonna create schema for our movie model   which define structure of document default values  validators and etc so define movie schema variable   and assign new mongoose.schema inside  that object add name type will be string   and required to be true exactly like  that we need image type will be string   and year type will be number and genre type will  be array of strings and rating type will be number let's create model with help of mongoose.model  method it required two params model name   and schema then export the model save this file  now and create routes folder in root directory inside that folder create movies.js file ok now we gonna write our api which handle  pagination search filter and sort so first import   router from express module then import movie  model from models folder it's going to be a get   api so add router.get method with endpoint /movies it's going to be async function and add   try catch block in it if error occurred we console  log and send response with 500 status code before   we write our code in try block first export this  router because i forgot to export most of time   let me know in comments is there anyone like  me ok after exporting. In try block define   page variable and assign page number  vc from query by subtracting with 1   if not received it will be 0 you might  be thinking why i am taking 0 for page 1   just wait you will understand define  limit variable and assign query limit   or default limit will be 5 then define search  if search query not received assign empty string   then define sort and assign query if  not received default sort will be rating   exactly like sort define genre if not received  default will be all in order to filter movies by   genre we need all genres we have in our database  it is just a demo so i am adding genres manually   in an array in real world scenario you should save  all genres in a database and get data from there   so after getting all genres then if genre  is all we assign our genre options array   else we split the genre query with comma then if  sort query received exactly like genre we split   them with comma and assigned to sort else we add  sort in an array next we define sort by variable   with empty object why we need this because we  also gonna allow user to sort rating or year   in ascending or descending order so if sort length is greater than 1 it means user has   specified in which order he wants so assign  sort order to be sort of index 1. here we are   taking first element of sort array as dynamic  property else default sort will be ascending   now define movie variable and add await movie.find inside that add regex and search variable   options is i which means case sensitive it matches  every letter doesn't matter it's capital or small   add one more method where to chain. It filters  genres by given genres then add sort and pass   sort by variable and add skip method here we need  to specify how many documents we want to skip   it will be page multiply by limit let's  assume it's page 1 so it will be 0 in back end   0 multiply by 5 which is default limit 5 here  we skip 0 documents that is what we want but   for second page we skip five documents i hope  now you understand why we set it to be zero   then don't forget to add limit method which  limit documents that's it we got our movies   but in order to show how many pages we have  we need to do the same query we thought limit   after getting total save it in a variable define  response variable and add error to be false,   total, page, limit, genres so that we can  show all genres on frontend and movies then send response with status code of 200. that's it save this file  now and open server.js file in this file import movie routes and  then add app.use /api movies routes   save this file now in order to test this api  we need to have movies in our database so   i have created this config folder inside that  created movies.json file. inside this file i have   array of movie details we will push this array of  movies to our database you can find this json file   from github repo i will add it in description  now let's write this function in movies.js file   first import movies.json file  and save it in a variable then create async function name insert movies  with try catch block in it. In try block   add await movie.insertMany and pass movies  array save the result and return if error   occurred we return error then call this function  console.log docs and errors save this file now   now open command prompt by starting our project  insert movies function will execute so our movies   will be added to database to start our project  enter npm start command ok connected to database   and here we go our movie is also added  don't stop our project let's go to vs code   and comment out insert movies function because  we don't need this anymore after making changes   save this file now it's time to test our api  open postman okay i am in postman i have already   added this api let's call by clicking on send  button as you can see we have got our response   total documents are 14 and it's  page 1 let's change it to page 2   now we are in page 2 let's set  limit to 6 instead of default 5 and it is also working fine now i want movies with genre drama on  page 2. let's see what we get in results okay it is also working let's go to page one now let's sort movies by year default is ascending let's set  desc to get in descending order if you want movies with multiple  genres add , and then add genre last one more left search i will search godfather  movie by just adding god because i'm lazy this api is working fine now let's wrap things up   in next video we're gonna use this api in  react project to learn how to handle pagination   sort search and filter on frontend. subscribe  to my channel to don't miss next video or for   exciting future videos i hope you have learned  something new today by watching this video so bye you

Channel: CyberWolves

Views: 90,674

Keywords: programming, python, javascript, pagination in react js, Paginated Rest API, mongodb, mongodb filter, mongodb search, search sort filter, crud operation in react js, crud opertations, mern stack, mern project, imdb clone, amazon clone, clone, spotify clone, lama dev, javascript mastery, rest api node js, pagination, server-side, web dev, simplified, crud app, todo app, beginner node js, zoom clone, netflix clone, mern application, node js, express, restful api, filtering, how, to

Id: 0T4GsMYnVN4

Length: 13min 13sec (793 seconds)

Published: Mon Jun 20 2022