MudBlazor, a Blazor component library whose popularity is on the rise, has a goal of helping developers build web applications faster and easier. This open source library contains around 70 components. Its graphic design is based on Material Design. The best way to find out how to get started with MudBlazor is to see it in action, so a demo will be in the focus of this presentation – we’ll spend most of the time in Visual Studio 2022 building, step-by-step, our demo app and along the way learn about features of this Blazor component library. MudBlazor has a clear list of policies that includes, among others, clear and easy to understand structure, and no dependencies on other component libraries. Demo app: https://github.com/marko-lohert/MudBlazor-And-Default-Blazor-App This PowerPoint presentation I have used in an online meetup on January 25th 2022. This meetup was organized together by Microsoft Developer User Groups in: - Graz, Austria: https://www.meetup.com/MicrosoftDevelope.../events/283236847 - Rijeka, Croatia: https://www.meetup.com/Microsoft.../events/283315641

1. Get started with MudBlazor, a
Blazor component library
Marko Lohert
Ekobit
@MarkoLohert

2. Agenda
• MudBlazor
• Design Principles
• Ecosystem Around MudBlazor - Mudverse
• Demo
• Q&A

3. MudBlazor
• Blazor component library
• Material Design
• Around 70 components
• Free library
• MIT License

4. MudBlazor
• Latest version 6.0.5
• targets .NET 6 -> prerequisite
• Version 5.xx targets .NET 5.0

5. Design Principles
• All components are written entirely in C#, no JavaScript
allowed (except where absolutely necessary).

6. Design Principles
• No dependencies on other component libraries, 100%
control over components and features.

7. Design Principles
• Clean and aesthetic graphic design based on Material Design.
• Good documentation with many examples and source snippets.
• Clear and easy to understand structure.
• Stability! We strive for a complete test coverage.
• Users can make beautiful apps without needing CSS (but they
can of course use CSS too).
• Releasing often so developers can get their PRs and fixes in a
timely fashion.

8. Ecosystem Around MudBlazor - Mudverse
• A company behind the MudBlazor was created
• main purpose is to work on/support MudBlazor
• offer commercial offering for companies like a support license
• MudStore
• Marketplace for templates and themes
• MudAcademy
• Online learning platform for Blazor and MudBlazor
• 100% free
• MudExtensions
• MudBlazor extensions platform

9. MudBlazor Templates
• Installation
• dotnet new --install MudBlazor.Templates

10. Blazor Templates
Template - Default Blazor Template - Admin Dashboard

11. Demo

12. TryMudBlazor
• Test, experiment, and learn in a browser
• https://try.mudblazor.com

13. Key Takeaways
• Free Blazor component library with around 70 components
• Material Design
• Ecosystem Around MudBlazor
• MudBlazor Templates
• TryMudBlazor – online

15. Links
MudBlazor mudblazor.com
GitHub github.com/MudBlazor/MudBlazor
TryMudBlazor try.mudblazor.com
MudBlazor Templates github.com/MudBlazor/Templates
Demo (this talk) github.com/marko-lohert/MudBlazor-
And-Default-Blazor-App

16. @MarkoLohert