Book Image

Mastering Blazor WebAssembly

By : Ahmad Mozaffar
3.5 (2)
Book Image

Mastering Blazor WebAssembly

3.5 (2)
By: Ahmad Mozaffar

Overview of this book

Blazor WebAssembly is a revolutionary technology in software development that enables you to develop web applications with a rich user interface using C# without JavaScript. It can be run natively in the browser and soon on mobile apps with .NET MAUI, making it a superweapon in the .NET developer’s toolbox. This capability has opened the doors for the JavaScript community to have a stable framework to build single page applications (SPAs) maintained by Microsoft and driven by the community. Mastering Blazor WebAssembly is a complete resource that teaches you everything you need to build client-side web applications using C# & .NET 7.0. Throughout this book, you’ll discover the anatomy of a Blazor WebAssembly project, along with the build, style, and structure of the components. You’ll implement forms to catch user input and collect data, as well as explore the topics of navigating between the pages in depth. The chapters will guide you through handling complex scenarios like RenderTrees, writing efficient unit tests, using variant security methods, and publishing the app to different providers, all in a practical manner. By the end of this book, you’ll have the skills necessary to build web apps with Blazor WebAssembly, along with the basics for a future in mobile development with .NET MAUI and Blazor.
Table of Contents (21 chapters)
1
Part 1: Blazor WebAssembly Essentials
5
Part 2: App Parts and Features
13
Part 3: Optimization and Deployment

Utilizing the ErrorBoundary component

In .NET 6.0, Blazor got a new component called ErrorBoundary. This component is very simple, easy to use, and powerful at the same time. The ErrorBoundary component handles any exceptions that occur during the rendering of a child component and displays a custom UI in place of the faulty component.

The ErrorBoundary component accepts two RenderFragement parameters: one called ChildContent, which represents the UI of the child components when no errors occur, and another called ErrorContent, which represents the content when an error occurs.

For example, when you use Twitter with a poor internet connection, you may see that the tweet details load successfully, but the replies below the tweet display an error message such as Failed to load the replies with a Retry button. This experience can be achieved with the ErrorBoundary component, but you need to keep in mind that the exception you need to handle with the ErrorBoundary error UI must not...