Creating Your First Blazor Application

There are mainly two requirements when we need to develop any web application. A web application needs a server as well as a client-side application. Keeping in mind the market trends and to stay in the competition as a developer it’s inevitable that we learn both client-side as well as server-side programming languages. 

For developing server-side applications, some of the programming languages like C#, Java, PHP, and many others. To develop client-side applications some JavaScript frameworks are used such as React, Angular, Vue, and others.

The reason for discussing the points noted above is the reason why we exactly need to learn blazor. Yes, you guessed it right now C# developers can use their skills to develop client-side code, rather than learning new JavaScript frameworks.

Well, you might be thinking how would we be able to execute a C# code in the browser as the browser only understands JavaScript then how would it understand C# code? It is possible with the help of WebAssembly.

Blazor can run C# code directly in the browser, using WebAssembly. It runs in the same security sandbox as JavaScript frameworks like Angular, React, Vue, etc. Not just C#, in fact, we can run any type of code in the browser using WebAssembly. 

WebAssembly is based on open web standards. So, it is a native part of all modern browsers including mobile browsers. This means for the blazor application to work, there is no need to install any special plugin like back in the days of silver light and flash. 

Let’s now move on to developing our first Blazor application but prior to that do download Visual Studio for a better development experience. Here (https://visualstudio.microsoft.com/downloads/) is the link to download Visual Studio. 

If you already have Visual Studio installed, make sure asp.net and web development workload are installed. To verify if you have this workload installed, click on Tools and then select Get Tools and Features. 

Developing Blazor Application 

Here when creating a demo, I am using Visual Studio 2019 for developing our first Blazor application.

Our first step will be starting Visual Studio and start creating our application. For creating an application start Visual Studio and click on “Create a new Project”. 

Creating your first Blazor Application

Clicking on “Create a new Project” takes us to the screen where we have several options to select from.

Creating your first Blazor Application

In this Create a new project window, type Blazor on the search box. Select the Blazor Server App template and select Next. 

Creating your first Blazor Application

In the screen “Configure your new project”, enter “MyFirstBlazorApp” as the project name and click on the button Next. 

Creating your first Blazor Application

In this “Additional information” screen, select .Net core 3.3(Long Term Support) in the TargetFramework drop-down if not already selected and click on Create button. 

Creating your first Blazor Application

Clicking on create starts creating our project with all the configurations that we selected while setting up our project.

Creating your first Blazor Application

A new project will be created and will be opened in Visual Studio.

Creating your first Blazor Application

To run the application, what we need to do is click on the run button with IIS Express as the option selected.

Creating your first Blazor Application

On successfully running the application, it would open up a screen as shown below:

Creating your first Blazor Application


Similar Articles