How to Add gRPC to Your Blazor App

How to Add gRPC to Your Blazor App

This post reivews how to get started with gRPC within your Blazor apps. We'll start with a basic Blazor WebAssembly app being hosted from an ASP.NET Core server, then modify it to use gRPC.

This post reivews how to get started with gRPC within your Blazor apps. We'll start with a basic Blazor WebAssembly app being hosted from an ASP.NET Core server, then modify it to use gRPC.

The standard communication protocol between frontend clients—like Blazor—and servers have been RESTful APIs using JSON structured data as the default for more than a few years now. The most typical implementations follow strict <verb> /resource patterns, which are great for uniformity, but it does make things a little hard to model in many scenarios. Sometimes it would be great if you could just use more human-readable text like addItemcreateOrUpdateEvent, or addAttendeeToEvent, which can be a little hard with the strict requirements of REST.

This is where gRPC steps into the picture and can address some of these issues. gRPC is a re-imagining of RPC (Remote Procedure Call) with cross-language benefits. gRPC allows your frontend code to call backend servers using protocol buffers in a language-agnostic manner and allows you to pre-define objects to send and receive data. Another added benefit of using gRPC is the data can be transmitted in binary format, which can see a huge reduction in the amount of data transmitted over the wire, thereby greatly improving performance.

Recently, Microsoft has released  gRPC for Web for Blazor to allow us to take full advantage of this new protocol to send data back and forth from the server. The great thing about this release is that gRPC has first-class support within Blazor as opposed to being patched on as an afterthought.

I’m going to go over how easy it is to get started with gRPC within your Blazor apps by starting with a basic Blazor WebAssembly app being hosted from an ASP.NET Core server, then modifying it to use gRPC. Let’s jump into it

blazor grpc

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

Select List in Blazor || DropDown List in Blazor

LIKE | COMMENT | SHARE | SUBSCRIBE In this Blazor Tutorial, I will show you how to use #DropDownList in blazor app using MatBlazor - (Material Design compone...

Blazor : Calling REST API ASP NET Core Blazor | WEB API

LIKE | COMMENT | SHARE | SUBSCRIBE How to call and consume a REST API from ASP.NET Core Blazor application. Blog : https://aspdotnetexplorer.blogspot.com/sea...

Call POST API ASP NET Core Blazor | Blazor CRUD using API Part-1

LIKE | COMMENT | SHARE | SUBSCRIBE In this tutorial, I will show you how to save data into database using Web API form Asp.Net Core Blazor #Webassembly appli...

Call GET API ASP NET Core Blazor | Blazor CRUD using API Part-2

LIKE | COMMENT | SHARE | SUBSCRIBE In this tutorial, I will show you how to get all data from database using Web API form Asp.Net Core Blazor #Webassembly ap...

Call PUT API ASP NET Core Blazor | Blazor CRUD using API Part-3

LIKE | COMMENT | SHARE | SUBSCRIBE In this tutorial, I will show you how to update data from database using Web API form Asp.Net Core Blazor #Webassembly app...