Blazor Crash Course for Absolute Beginners

Explore how components serve as building blocks of an application and form a hierarchy within a layout. A component consists of markup and processing logic, implemented in component files.

Learn how to create a child component reference in Blazor and access the child component's public methods from the parent, and how to notify the child when state changes.

Learn to separate markup from logic in Blazor by adopting a code-behind approach, moving logic to a separate file, and using partial classes for cleaner, refactor-ready components.

Demonstrates the execution sequence of component lifecycle methods in a Blazor app, illustrating parent and child components, parameter binding, and asynchronous lifecycle events.

Explore Blazor forms and input components, including bindings, model attributes, and form submission, with an introduction to validation and common inputs like text, date, radio, select, and textarea.

Create your first form in Blazor by building a person model with name, age, and email; bind inputs to the model, use components, and handle submit status.

Learn how dependency injection removes tight coupling by injecting a service from outside the component, enabling easy replacement of implementations and keeping the system loosely coupled.

Learn how to implement dependency injection in Blazor WebAssembly by creating an employee service, defining an interface, and injecting it into a component to decouple classes.

Secure a Blazor WebAssembly app with Identity Server, authenticate users and API calls using individual accounts backed by a database, and set up registration and login flows.

Learn how to secure a Blazor server app by enabling individual accounts, configuring authentication, and using authorize attributes and roles to control access. Configure admin and super user roles.

Learn to call JavaScript from dotnet in Blazor using two methods: one for void functions like alert, and another for value-returning functions. See examples with a script and buttons.

Call dotnet static methods from JavaScript in a Blazor app using dotnet.invokeMethod, specifying the assembly and function, pass parameters, and expose with an attribute.

Call .NET static methods from JavaScript asynchronously by using dotnet.invokeMethodAsync, pass parameters, and handle the returned promise to display the square root result.

learn to call .NET instance methods from JavaScript in a Blazor app by creating a class with a hello method and using a .NET object reference to invoke it.

Understand why state management matters and how to maintain state in applications using services, then learn how to persist state with local storage.

Persist and restore state in a Blazor Web Assembly app using local storage, via a local storage service with save and load functions tied to the counter component.

Learn to persist state in a Blazor server app using a local storage service, with code identical to previous sections, and apply the server app changes to enable persistent state.

Design a simple shopping site using four components: menu, product, card, and customer, with a main navigation component, displaying product lists and selected items for checkout.

Build a Blazor product catalog component by defining product and catalog models in the shared project, rendering product items with a component, and displaying them using Bootstrap cards.

Create a Shelton Card component that receives cart product data, uses a product item component to display them, and fetches product details via a catalog function using IDs.

Implement removal of a selected product from the cart by using a position-based remove function, updating the shopping cart component and triggering a callback to pass the item’s position.