Create a CRUD Blazor Webassembly API Controller

In this tutorial we’ll create and consume a CRUD API Controller in Blazor WebAssembly. This is focused on the main HTTP Request types: Create, Read, Update and Delete. By the end of this video, you will know how to create an API with all the basic endpoints, to give them a custom URL route and to consume it from your Blazor WebAssembly components using HttpClient.

In the first part of the tutorial, we’ll review the changes from last week’s tutorial, but feel free to download code from below or watch the video linked here for step-by-step instructions on the project.

Following, we’ll create a Blazor EditForm to allow us to edit data from our Web API Controller. Then we’ll get to the fun part which is setting up the CRUD Web API Controller. Two of the methods were already created (Get and List). And we’ll focus on Create, Update and Delete and the functionality encapsulated by these actions. We’ll discuss about how these endpoints can be consumed and how you can add parameters to your methods.

Also, we’ll work with the EditForm OnValidSubmit action to integrate Saving and Creation logic in our application. Finally, we’ll add Creation and Deletion functionality to really make this dashboard as comprehensive as it can be.


0:00 – Intro
0:40 – Project Overview
9:35 – Create a Blazor EditForm
13:38 – Set-up a CRUD Web API Controller
21:45 – Saving/Update functionality
26:06 – Delete functionality
32:08 - Create functionality

🙌If you enjoyed this tutorial, please like this video consider subscribing for more content like this!

Useful Links:

Credits:

[aog.tr.]

Thanks for the nice and comprehensive explanation. I am now a member of the channel.😊

[alessandrodk]

Hi Julian, I want to thank you for providing this great content that is helping me a lot in my work 😃

[TheOnlyDominik]

You can also use the coffee.id to decide if it's new. If(coffee.Id == null) then coffee its new, else old. BTW Thank you for the great videos.