In this Angular CRUD tutorial, I will be showing you how to build a filterable Data Table with complete CRUD(Create, Read, Update and Delete) operation using a REST API
I also show you how to load the data from a remote server REST API service called JSON Place Holder, we also added a search-filter functionality to the table using Custom Pipes in Angular, with no third-party libraries.
The table is designed using Bootstrap 5. We also made use of services in Angular, by creating endpoints from the JSON server endpoints using the inbuilt Angular Http Client.
The tutorial is beginner-friendly and easy to follow along. All you need is a basic knowledge of HTML, JavaScript and Angular.
Chapters
------------------------
0:00 - Introduction and project preview
04:39 - Create a new Angular Project
06:46 - Setup Bootstrap 5
08:08 - Import The Necessary Modules
11:25 - Implement Project Design
16:00 - Create The CRUD Endpoints
27:28 - Consume Endpoint to Get All Post
32:30 - Consume Endpoint to Create a New Post
41:47 - Consume Endpoint to Edit / Update Post
53:06 - Consume Endpoint to Delete a Post
55:43 - Implement Search Functionality
1:02:23 - Outro
Topic
------------------------
Learn Angular by Building a Filterable Data Table with CRUD Operation using a REST API
JSON placeholder Doc:
👉 https://jsonplaceholder.typicode.com
Source Code Frontend:
👉https://github.com/desoga10/ang-data-...
Join my telegram community:
👉 https://t.me/thecodeangle
For more resources on Web Development:
👉 https://thecodeangle.com/
Follow Me on Twitter:
👉 / thecodeangle
Leave a like and subscribe for more awesome tutorials.
Thanks a lot for watching ❤
Watch video Learn Angular by Building a Filterable Data Table with CRUD Operation using a REST API online without registration, duration hours minute second in high quality. This video was added by user The Code Angle 17 November 2021, don't forget to share it with your friends and acquaintances, it has been viewed on our site 2,828 once and liked it 48 people.