Showing posts from August, 2021

Blazor WebAssembly: Using C3.js to Create Charts in Blazor WebAssembly Application

In this tutorial, we will see the way of creating Charts in Blazor WebAssembly by integrating with C3.js in it. Please note that, the implementation is completely my thought which I have suggested to one of my client. In this tutorial, the implementation is done g JavaScript interoperability. One of the great features of the Blazor Application is that, it has an interoperability with JavaScript. I have already written an article on JavaScript interoperability on my blog. You can read steps of JavaScript interoperability from  here .  In Blazor Application, there is no default support for Charts are available. So to provide charts in Blazor some other alternatives must be planned. Recently, when I was  discussing about the Blazor WebAssembly to one of my customer, he raised query on creating Charts. I demoed him and then I thought to write a small tutorial on it.  C3.js C3.js is JavaScript library based on D3.js. This enables deeper integration of charts into the application. This is a

ASP.NET Core 5 and Blazor Web Assembly Apps: Token Based Authentication in ASP.NET Core 5 APIs and Authenticating it using Blazor WebAssembly Apps

     Recently, while conducting training in .NET 5 and Blazor, my students have asked me to show the implementation of JSON Web Token based Authentication for ASP.NET Core 5 API and accessing this secure API using Blazor WebAssembly client apps. After the explanation and demo, I thought to write a tutorial on it. I have already posted an article on the ASP.NET Core 3.1 JSON Web Token with concept of JSON Web Token and implementation. You can read the article form this post . For all the new readers, I have provided all steps of implementation Token based authentication in ASP.NET Core 5 API and accessing the API in Blazor WebAssembly application. The figure 1 explains all steps of the implementation Figure 1: The Blazor WebAssembly Application accessing Token Based Secure API developed using ASP.NET Core 5     As shown in the figure 1, we will be having Identity database which will store Identity Users, Roles, etc. The application database will store application data e.g. Products Info

Blazor WebAssembly: Uploading Image to ASP.NET Core 5 API from Blazor WebAssembly Project

In this tutorial, we will see the mechanism of uploading an image from Blazor WebAssembly client application to ASP.NET Core 5 API. The file uploading is one of the most demanded features by the developer community. In the software applications, e.g. data collection application, social media types applications, etc. the image uploading is required frequently. In the modern web applications developed using ASP.NET Core 5, we can implement this using  the  IFormFile interface.   This interface   can be used to upload the file using HTTP Request. This interface represents a file sent with the HttpRequest. This interface is available in the Microsoft.AspNetCore.Http.Features assembly and its Microsoft.AspNetCore.Http namespace. The IFromFile supports Buffering that reads the entire file. This file is further processed and saved on the server.  The client application will be used as the Blazor WebAssembly application. This executes in browser by having the .NET runtime and project dependenc