Getting Started With Blazor In ASP.NET Core 7.0

Introduction

In this article, I am going to explain the basics of Blazor and what are the tools required for Blazor Application development. What’s new in ASP .NET Core 7.0? ASP.NET Core 7.0 was released on November 8, 2022 and how to create, execute our first ASP .NET Core 7.0 Blazor Server Application. Blazor is a free, open-source Web framework to build Web apps using C# that run in a Web browser.

What Is Blazor?

Blazor is a Single Page Framework (SPA) from Microsoft for creating client side applications using C#/Razor and HTML that runs in the browser with WebAssembly (just like JavaScript do).

WebAssembly

In Blazor WebAssembly, the application runs on the browser via web assembly. Whatever application needs will be downloaded onto the browser and executed. It is developed as a web standard and supported by all the major browsers without plugins.

Blazor Server

In Blazor Server the application is executed on the server. The server will be a ASP.NET Core Application. So, in this model, there will be the server and the client which will be connected by a SignalR link. On any event, a Signal-R message will be transmitted to the server via the client. The server evaluates the request/event and calculates the difference in the HTML required. In this way, it doesn’t have to send the entire HTML snippet back to the client.

Why use Blazor?

It makes web application development easier and more productive by providing full-stack web development with .NET. It runs in all browsers on .NET runtime and has full support for .NET Standard without the need for any extra plugin. Blazor is fast, have reusable components and is open-source with great support from the community.

What’s New?

• Custom elements
• Handle location changing events
• Dynamic authentication requests
• Improved JavaScript interop on Webassembly
• Improve performance with .NET WebAssembly
• New Blazor WebAssembly loading page
• Blazor data binding get/set/after modifiers

Read my previous articles, using the below links.

• How To Install Visual Studio 2022
• Getting Started With Visual Studio 2022 Community Edition
• Getting Started With .Net 7
• Getting Started With Asp.Net Core 7

Prerequisites

1. Install Visual Studio 2022 updated version 17.4.0
2. Install .NET SDK 7.0

Tech Knowledge

1. C#
2. HTML
3. CSS

Creating Your First Blazor Server Application

1. Start Visual Studio 2022 and select Create a new project.

2. In the Create a new project window, just type Blazor on search box and hit Enter, it shows all the Blazor app templates.

3. Select Blazor Server App project template and select Next button. 

4. In the Configure your new project window, Give a valid name to your project and select a path for it. Then click Next button.

5. Now, Select framework .NET 7.0(Standard Term Support). You can select the Authentication Type as None, Individual Account, Microsoft Identity platform, or windows. For the demo purpose, I am selecting none. Based on your project need and Authentication requirement you can select this option. You can select Configure for HTTPS based on your need.

If you need Docker in your project then Select Enable Docker.

Uncheck Do not use top-level statements.

Then click the create button.

6. Our First Blazor Web application will be created and project structure is shown below,

7. Modify, Index.razor file

8. The Project.cspoj file looks like below. Where you can see the target Framework net7.0, by default Nullanle and ImplicitUsings are enabled. 

9. Now, build and run the application.

Output

Conclusion

In this article, we explained the basics of Blazor and what’s new in .NET 7.0 and also create our first Blazor Server App and execute it.