Razor Components

Learn how to use Razor components and understand their key features.

We'll cover the following

Using components
Parameters
Test yourself
Naming components
Component life cycle

Blazor WebAssembly is a component-driven framework. Razor components are the fundamental building blocks of a Blazor WebAssembly application. They are classes that are implemented using a combination of C#, HTML, and Razor markup. When the web app loads, the classes get downloaded into the browser as normal .NET assemblies (DLLs).

Note: In this course, the terms “Razor component” and “component” are used interchangeably.

Using components

HTML element syntax is used to add a component to another component. The markup looks like an HTML tag where the name of the tag is the component type.

The following markup in the Pages\Index.razor file of the Demo project that we will create in this chapter will render a SurveyPrompt instance:

Get hands-on with 1200+ tech skills courses.

Introduction to Blazor WebAssembly

Building Your First Blazor WebAssembly Application

Counter App

Building a Modal Dialog Using Templated Components

Task Tracking System

Building Local Storage Service Using JavaScript Interoperability

Building a Weather App as a Progressive Web App (PWA)

Building a Shopping Cart Using Application State

Building a Kanban Board Using Events

Completing the Kanban Board Project

Building a Task Manager Using ASP.NET Web API

Building an Expense Tracker Using the EditForm Component

Completing TaskManager Project

Conclusion

Local Installations

Razor Components

Using components