Open at Microsoft - FluentUI.Blazor

Open at Microsoft

A few days ago, Vincent and I were lucky enough to be invited to Open at Microsoft.

Open at Microsoft is a weekly program for open-source enthusiasts. It features guests sharing their views on an open-source project. Thanks to Frank and Pablo we were able to record 3 video vignettes on FluentUI Blazor.

• Vincent: Getting started with the Fluent UI Blazor library
• Vincent: Exploring the Fluent UI Blazor components
• Denis: Advanced scenario with FluentUI-Blazor

1. Getting started with the Fluent UI Blazor library

In this episode, we’ll explain the origins of the FluentUI Blazor library. We’ll talk about FAST, Web Components, Fluent Design and more…

• 00:00 - Introduction
• 00:30 - What is it?
• 06:22 - How to get started

2. Explore Fluent UI Blazor components

In this episode, we explore the wide range of components we offer. Through our demo and documentation site, we showcase our layout, form/entry and other categories. We demonstrate that all demo sources can be easily downloaded, and highlight some of the site settings you can experiment with. Finally, we take a closer look at the implementation of our demo site.

• 00:00 - Introduction
• 00:50 - Visual Studio demonstration
• 06:40 - Viewing component samples
• 08:48 - How to contribute

3. Scénario avancé avec FluentUI-Blazor

In this episode, we’ll be using the FluentUI Blazor library to discover the components that are commonly used. We’ll create a Registry page containing a modal confirmation dialog box.

• 00:00 - Introduction
• 01:24 - How to get beautiful icons
• 04:21 - Discover the Dialogues component
• 10:00 - Here’s how to get started

Ressources

• Demo and documentation (current): https://www.fluentui-blazor.net
• Demo and documentation (vNext): https://preview.fluentui-blazor.net
• NuGet packages: https://aka.ms/fluent-blazor-libs

Divers

• FAST: The adaptive interface system for modern web experiences
  Interfaces built with FAST adapt to your design system and can be used with any modern UI Framework by leveraging industry standard Web Components.
• Fluent 2 Design System
  Explore the next evolution of Microsoft’s design system, enabling more seamless collaboration and creativity than ever. Move fluidly from design to development, between apps, and across platforms.
• Fluent 1 Design System
  This is where the current Web Components and Blazor components are designed on
• Fluent UI Web Components Overview
  Overview of Fluent UI Web Components
• The Fluent UI Web Components
  Playground to try out all available Fluent UI Web Components

Feedback

If you find something out of the ordinary, let us know in the repo on GitHub, or Twitter / X.