Creating a Blazor WebAssembly Application

Blazor WebAssembly applications use Razor components as building blocks. The component itself is a reusable part of the UI that can be used anywhere in our application. Razor components are a combination of HTML and C# code; however, the HTML part of the component is compiled into C# code and emitted in the final DLL. The component files are not standalone files like in standard .html pages.

In this chapter, we will learn about Razor components. We will understand how these components are built, how they communicate with other components on the page, and what their life cycle is. We will learn how to create and use components, how to add parameters to components, and how these components can notify parents that something has happened. This is useful when we want to notify the parent about the data changing, a button or link being clicked, and so on.

We will also learn two ways of defining C# code for the components, in addition to learning how to specify the route URL for the component and how to read data from the website URL address.

Finally, we will take a look at the project we want to build and start building it using the default Blazor WebAssembly App project template provided by Microsoft.

By the end of this chapter, you will understand how to create a new project for a Blazor WebAssembly application using Visual Studio. You will also understand the concept of Razor components, how they communicate, and how Blazor uses these components to render the content on the websites.

In this chapter, we will cover the following topics:

• Learning how to write Razor syntax
• Creating Razor components
• Understanding page routing in Blazor
• Project overview and preparation