Mastering Razor

Razor is the templating engine that mixes HTML with C#. Understanding its nuances is key to building performant UIs.

1. Directives

- @page: Defines the URL route for the component.
- @inject: Injects a service from the DI container.
- @using: Imports namespaces.
- @implements: Specifies an interface implementation (like IDisposable).

2. Code-Behind Pattern

For small components, using <code>...</code> blocks inside the .razor file is fine. For large, complex components, use the **Partial Class** pattern. Create a MyComponent.razor.cs file. This keeps your HTML separate from your logic and makes the code much easier to manage and test.

3. Architect Insight

Q: "Should I use @bind or @onchange?"

Architect Answer: "Use @bind for simple two-way data binding. Use @onchange when you need to perform logic (like validation or an API call) immediately after the user changes a value. Remember: @bind is just syntactic sugar for a property and an event—don't be afraid to write it out manually if you need more control."