Understanding Razor syntax
Blazor apps consist of Razor components. As we learned in Chapter 3, User Interface Design with XAML, XAML is a type of language derived from the XML language. XAML-based UI elements consist of XAML pages and code-behind C# files. Razor components look very similar to this pattern. The difference is that Razor uses HTML as its markup language and C# code can be embedded into HTML directly. Optionally, we can also choose to separate C# code in a code-behind file to separate the UI and logic.
Code blocks in Razor
If we add a new Razor component to the project, it will look like this:
<h3>Hello World!</h3> @code { // Put your C# code here }
In the preceding example, we can design our page just like an HTML page and put programming logic into a code block. Razor pages or Razor components will be generated as C# classes. The filename is used as the class name. They can be used as HTML tags on another Razor page.