[Debug Mode] Angular Nodejs MySQL Pagination Sorting Filtering RestAPIs - Express + Sequelize ORM Article: Angular 10 Nodejs Pagination RestAPIs + Filtering Sorting Example – Fullstack: Angular + Nodejs RestAPIs+ MySQL Tutorial https://loizenai.com/server-side-pagination-in-node-js-angular-10-mysql-sequelize/ I. Architecture Design Angular Node.js Application In the tutorial, We develop 2 projects: 1 - Backend Project – Nodejs MySQL Pagination Application gets data from MySQL database then provides RestAPIs with pagination, filtering and sorting function for frontend 2 - Frontend Project – Angular Application use HttpClient to fetch data from Backend Application then shows them in Bootstrap table with pagination, filtering and sorting functions II. Goal – Make a request at API: /api/customers/pagefiltersort with pagination, filtering and sorting params as below: page: 0 – first page size: 5 – size of a page salary: 4000 – filtering by salary field agesorting: true – sorting by age desc: true – descending or ascending sorting III. Overall Node.js Sequelize MySQL Pagination To handling Pagination RestAPI requests and do Paging Filtering and Sorting queries with MySQL database, we create a backend web Node.js application with 4 main points: 1. To handle pagination RestAPI requests with Node.js, We use Express framework. 2. To do pagination filtering and sorting queries with MySQL database, We use Sequelize ORM. 3. We define all RestAPI URLs in router.js. 4. We implement code how to process each paging filtering and sorting RestAPI request in controller.js file. IV. Nodejs Sequelize Pagination Queries To do the pagination with database, Sequelize ORM provides 2 model methods for supporting the purpose with limit and offset parameters: - .findAll() – Search for multiple elements in the database - .findAndCountAll() - Search for multiple elements in the database, returns both data and total count V. Create Angular Project We create an Angular Pagination Application with 2 main blocks: 1. CustomerService is used to fetch data through Angular HTTP Client 2. TableComponent is used to display data with pagination, filtering and sorting view – We implement a component: angulartable with 2 files angulartable.component.html and angular.component.ts to display data on web. – We implement a service customer.service.ts using Httpclient to interact with SpringBoot restPAPI to fetch data with pagination, filtering and sorting. – We define 2 helpful class customer.ts and message.ts for mapping data with RestAPIs. VI. Related posts: 1. Nodejs JWT Authentication Example – Express RestAPIs + JSON Web Token + BCryptjs + Sequelize + MySQL/PostgreSQL https://loizenai.com/nodejs-token-based-authentication-jwt-json-web-tokens-authentication-mysql-example/ 2. Angular & Nodejs JWT Authentication fullstack Example | Angular 6, 7, 8, 9 – Express RestAPIs + JWT + BCryptjs + Sequelize + MySQL/PostgreSQL https://loizenai.com/angular-10-nodejs-jwt-authentication-mysql-examples-tutorials/ 3. Nodejs MySQL Pagination Filtering Sorting Tutorial – Stack: Express RestAPIs + Sequelize ORM + MySQL database Examples https://loizenai.com/server-side-nodejs-mysql-pagination-example/ VII. Structure Video for Angular Nodejs MySQL Pagination RestAPI 0:0 - Introduce results of projects 0:14 - Review Overview of Article https://loizenai.com/server-side-pagination-in-node-js-angular-10-mysql-sequelize/ 1:26 - Download Sourcecode 1:48 - Install needed dependencies for Nodejs Project 2:10 - Import nodejs pagination project to Visual Studio Code 2:21 - Reivew project structure of Nodejs Pagination RestAPIs project 3:26 - Start Debug Nodejs project 3:40 - Check customers table in MySQL database and prepare data for processing 4:19 - Start debug code with Pagination Filtering and Sorting with Nodejs restAPIs and Postman client 5:31 - Install needed dependencies for Angular Pagination Project 5:55 - Import Angular Project to Visual Code Studio 6:07 - Review Coding of Angular Project Structure 7:22 - Start Running Angular Project 9:02 - Start Expore Sourcecode of Angular project in Browser 9:21 - Start Debug Angular Project with Sourcecode - Loading Pagination data at the begin time 11:28 - Start debug with Pagination Bar when having any click event 12:25 - start Debug with NEXT Button in Pagination Bar of Angular Client 13:17 - Start debug with Previous Button of Pagination Bar in Angular Client 14: 29 - Start Debug with Filtering Age=3500 15:41 - Start Debug with Pagination and Filtering Age=3000 16:18 - Start Debug with Age Sorting - Pagination + Filtering and Sorting with Age ASC direction 18:11 - Start Debug with Age DESC Sorting - Pagination + Filtering Salary = 3500 + Age Sorting with DESC direction ---------------------------------- @Copyright by https://loizenai.com Youtube loizenai
[Debug Mode] Angular Nodejs MySQL Pagination Sorting Filtering RestAPIs - Express + Sequelize ORM Article: Angular 10 Nodejs Pagination RestAPIs + Filtering Sorting Example – Fullstack: Angular + Nodejs RestAPIs+ MySQL Tutorial https://loizenai.com/server-side-pagination-in-node-js-angular-10-mysql-sequelize/ I. Architecture Design Angular Node.js Application In the tutorial, We develop 2 projects: 1 - Backend Project – Nodejs MySQL Pagination Application gets data from MySQL database then provides RestAPIs with pagination, filtering and sorting function for frontend 2 - Frontend Project – Angular Application use HttpClient to fetch data from Backend Application then shows them in Bootstrap table with pagination, filtering and sorting functions II. Goal – Make a request at API: /api/customers/pagefiltersort with pagination, filtering and sorting params as below: page: 0 – first page size: 5 – size of a page salary: 4000 – filtering by salary field agesorting: true – sorting by age desc: true – descending or ascending sorting III. Overall Node.js Sequelize MySQL Pagination To handling Pagination RestAPI requests and do Paging Filtering and Sorting queries with MySQL database, we create a backend web Node.js application with 4 main points: 1. To handle pagination RestAPI requests with Node.js, We use Express framework. 2. To do pagination filtering and sorting queries with MySQL database, We use Sequelize ORM. 3. We define all RestAPI URLs in router.js. 4. We implement code how to process each paging filtering and sorting RestAPI request in controller.js file. IV. Nodejs Sequelize Pagination Queries To do the pagination with database, Sequelize ORM provides 2 model methods for supporting the purpose with limit and offset parameters: - .findAll() – Search for multiple elements in the database - .findAndCountAll() - Search for multiple elements in the database, returns both data and total count V. Create Angular Project We create an Angular Pagination Application with 2 main blocks: 1. CustomerService is used to fetch data through Angular HTTP Client 2. TableComponent is used to display data with pagination, filtering and sorting view – We implement a component: angulartable with 2 files angulartable.component.html and angular.component.ts to display data on web. – We implement a service customer.service.ts using Httpclient to interact with SpringBoot restPAPI to fetch data with pagination, filtering and sorting. – We define 2 helpful class customer.ts and message.ts for mapping data with RestAPIs. VI. Related posts: 1. Nodejs JWT Authentication Example – Express RestAPIs + JSON Web Token + BCryptjs + Sequelize + MySQL/PostgreSQL https://loizenai.com/nodejs-token-based-authentication-jwt-json-web-tokens-authentication-mysql-example/ 2. Angular & Nodejs JWT Authentication fullstack Example | Angular 6, 7, 8, 9 – Express RestAPIs + JWT + BCryptjs + Sequelize + MySQL/PostgreSQL https://loizenai.com/angular-10-nodejs-jwt-authentication-mysql-examples-tutorials/ 3. Nodejs MySQL Pagination Filtering Sorting Tutorial – Stack: Express RestAPIs + Sequelize ORM + MySQL database Examples https://loizenai.com/server-side-nodejs-mysql-pagination-example/ VII. Structure Video for Angular Nodejs MySQL Pagination RestAPI 0:0 - Introduce results of projects 0:14 - Review Overview of Article https://loizenai.com/server-side-pagination-in-node-js-angular-10-mysql-sequelize/ 1:26 - Download Sourcecode 1:48 - Install needed dependencies for Nodejs Project 2:10 - Import nodejs pagination project to Visual Studio Code 2:21 - Reivew project structure of Nodejs Pagination RestAPIs project 3:26 - Start Debug Nodejs project 3:40 - Check customers table in MySQL database and prepare data for processing 4:19 - Start debug code with Pagination Filtering and Sorting with Nodejs restAPIs and Postman client 5:31 - Install needed dependencies for Angular Pagination Project 5:55 - Import Angular Project to Visual Code Studio 6:07 - Review Coding of Angular Project Structure 7:22 - Start Running Angular Project 9:02 - Start Expore Sourcecode of Angular project in Browser 9:21 - Start Debug Angular Project with Sourcecode - Loading Pagination data at the begin time 11:28 - Start debug with Pagination Bar when having any click event 12:25 - start Debug with NEXT Button in Pagination Bar of Angular Client 13:17 - Start debug with Previous Button of Pagination Bar in Angular Client 14: 29 - Start Debug with Filtering Age=3500 15:41 - Start Debug with Pagination and Filtering Age=3000 16:18 - Start Debug with Age Sorting - Pagination + Filtering and Sorting with Age ASC direction 18:11 - Start Debug with Age DESC Sorting - Pagination + Filtering Salary = 3500 + Age Sorting with DESC direction ---------------------------------- @Copyright by https://loizenai.com Youtube loizenai