Page 20 - MSDN Magazine, March 2019

C#
Full Stack C# with Blazor
Jonathan C. Miller
Blazor, Microsoft’s experimental framework that brings C# into the browser, is the missing piece in the C# puzzle. Today, a C# programmer can write desktop, server-side Web, cloud, phone, tablet, watch, TV and IoT appli- cations. Blazor completes the puzzle, allowing a C# developer to share code and business logic right into the user’s browser. This is a powerful ability and a gigantic productivity improvement for C# developers.
In this article, I’m going to demon- strate a common-use case for code sharing. I’ll demonstrate how to share validation logic between a Blazor cli-
ent and a WebAPI server application. Today it’s expected that you validate the input not only on the server but also
in the client browser. Users of modern Web applications expect near-real-time feedback. The days of filling out a long form and clicking Submit only to see
a red error returned are mostly behind us.
A Blazor Web application running inside the browser can share code with a C# back-end server. You can place your logic in a shared library and utilize it on the front and back ends. This has a lot of benefits. You can put all the rules in one place and know that they only have to be updated in one location. You know that they’ll really work the same because they’re the same code. You save a bunch of time in testing and troubleshooting issues where the client and server logic aren’t always quite the same.
Figure 1 Choosing a Blazor Application
Perhaps most notable, you can use one library for validation on both the client and the server. Traditionally, a JavaScript front end forces developers to write two versions of validation rules—one in JavaScript for the front end and another in the language used on the back end. Attempts to solve this mismatch involve compli- cated rules frameworks and additional layers of abstraction. With Blazor, the same .NET Core library runs on the client and server.
Blazor is still an experimental framework, but it’s moving forward quickly. Before building this sample, make sure you have the correct version of Visual Studio, .NET Core SDK and Blazor language ser- vices installed. Please review the Getting Started steps on blazor.net.
Creating a New Blazor Application
First, let’s create a new Blazor application. From the New Project dialog box click ASP.NET Core Web Application, click OK, then select the Blazor icon in the dialog box shown in Figure 1. Click OK. This will create the default Blazor sample application. If you’ve experimented with Blazor already, this default application will be familiar to you.
This article discusses:
• Creating a new Blazor application and a shared library project to house common C# code for client and server
• Creating a validation engine that shares logic in the browser and on the back end
Technologies discussed:
Blazor, C#, ASP.NET Core
14 msdn magazine