React Datatable with Pagination, UPDATE Modal (CRUD) - Create Read Update Delete - Laravel REST API

Channel:
Philippines Sentgine
Subscribers:
3,500
Published on ● Video Link: https://www.youtube.com/watch?v=UGZBQ_OXrHo


Category:
Vlog
Duration: 18:11
119 views
5

In this Laravel API Tutorial video, we are going to activate Laravel Sanctum in our Laravel 8 Project, and create the CRUD Create, Read, Update, Delete endpoints. This time, we are going to build the update function for our user paginated table. The React Datatable supports Pagination, Modal Form to perform CRUD operations - Create Read Update Delete using the Laravel Backend REST API. We're reusing our form modal component here to update users to our database.

You can easily implement token based user authentication using Laravel Sanctum. You can follow this Laravel API Tutorial video as a starting project for your Rest API projects. This Laravel API Tutorial video will assist you in making your first Rest API. The React Datatable that supports Pagination, Modal Form to perform CRUD operations source code is an amazing headstart especially when you Create Read Update Delete operations using the Laravel Backend REST API.

Most of the backend data from a backend of any enterprise application need datatables to represent the list of records from a Datatabase Model. Most of the time, a pagination feature is needed to navigate through the list of items. Pagination is very important as it helps with optimizing the performance of both your frontend and backend.

Download composer: https://getcomposer.org/download/
Using Laravel 8.54

Previous video: https://www.youtube.com/watch?v=4_4Xa3i0iWs

0:38 - Create two modes for the Form Modal component - Create and Update
6:54 - Create the method to update the user
9:00 - Find a way to stay on the same page after updating, creating, or deleting a user

Git: https://github.com/jackoftraits/rest-api-laravel-sanctum-spa-backend
Git frontend: https://github.com/sentgine/react-frontend-with-laravel8-livewire
Copy the form modal html: https://pastebin.com/TJfs8kx1

Relevant Links:
https://tailwindcss.com/docs/guides/create-react-app
https://reactrouter.com/en/main/start/tutorial
https://vitejs.dev/guide/env-and-mode.html

#react #datatable #pagination #modal #createModal #addButton #createUser



Other Videos By Sentgine


2024-02-14React Datatable with Pagination, UPDATE Modal (CRUD) - Create Read Update Delete - Laravel REST API
2023-10-27React Datatable with Pagination, CREATE Modal (CRUD) - Create Read Update Delete - Laravel REST API
2023-02-18React Datatable with Pagination, DELETE Modal (CRUD) - Create Read Update Delete - Laravel REST API
2023-02-08React Datatable with Pagination, Modal (CRUD) - Create Read Update Delete - Laravel REST API Part3
2023-01-30React Datatable with Pagination, Modal (CRUD) - Create Read Update Delete - Laravel REST API Part2
2023-01-23React Datatable with Pagination, Modal (CRUD) - Create Read Update Delete - Laravel REST API Part1
2023-01-16Rest API Laravel Sanctum & Single Page Applications part6 - Frontend Login Component React - Part3
2023-01-09Rest API Laravel Sanctum & Single Page Applications part5 - Frontend Login Component React - Part2
2023-01-02Rest API Laravel Sanctum & Single Page Applications part4 - Frontend Login Component React
2022-06-21Rest API Laravel Sanctum & Single Page Applications part3 - Create Read Update Delete (CRUD)
2021-09-05Rest API Laravel Sanctum & Single Page Applications part2 (Laravel Sanctum setup, Login, Logout)
2021-08-29Rest API Laravel Sanctum & Single Page Applications part1
2021-03-15Laravel 8 Livewire Tutorial (Building a Simple CMS): Create a Simple Livewire Chat (part 14)
2021-02-12Laravel 8 Livewire Tutorial (Building a Simple CMS): Push Notifications without Pusher (part 13)
2021-02-01Laravel 8 Livewire Tutorial (Building a Simple CMS): Finalize Dynamic User Access Roles (part 12)
2021-01-20Laravel 8 Livewire Tutorial (Building a Simple CMS): Create a Livewire CRUD Generator (part 11)
2021-01-06Laravel 8 Livewire Tutorial (Building a Simple CMS) : User Access Roles Laravel Middleware (part10)
2020-12-25Laravel 8 Livewire Tutorial (Building a Simple CMS) : Implement Dynamic Navigation Menu (part9)
2020-12-10Laravel 8 Livewire Tutorial (Building a Simple CMS) : Understanding the Basics of Alpine JS (part8)
2020-11-30Laravel 8 Livewire Tutorial (Building a Simple CMS) : Frontend Design Using Tailwind CSS (part7)
2020-11-18Laravel 8 Livewire Tutorial (Building a Simple CMS) : A Brief Intro To Tailwind CSS (part6)


Tags:
reactjs
datatable
laravel
laravel sanctum
react datatable
form modal
rest api
dynamic pagination
dynamic pagination numbers
pagination numbers
react pagination
crud
updateModal
updateUser