Getting started with Blazor WebAssembly
Welcome to Blazor WebAssembly!
This tuttorial introduces you to the essentials of Blazor WebAssembly by walking you through building an online shop with a catalogue, shopping cart and check-out form.
You can download the example code used in this topic on GitHub.
Prerequisites
To get the most out of this tutorial, you should already have a basic understanding of the following:
Take a tour of the example website
In Blazor WebAssembly, components are the basic UI units that let you reuse sets of UI functionality. Each component consists of:
- HTML tags: define how the user sees the component.
@code{ }section: handle data and functionality.- CSS: improve the look and feel for the user.
In this example we have the following components:
App.razor- the first component to load the container for other components.ProductList.razor- display a list of products.ProductDetail.razor- display details of the product.
Create a blank project
To create a blank project, you will need Visual Studio 2019 or later with ASP.NET Web and .NET 5 Runtime.
After that, you will see the template for Blazor WebAssembly:
Next step
Continue to explore Blazor WebAssembly by Creating the API for the online shop example.
