opensource UI controls with blazer?

[touseefbsb]

like every js framework these days has big list of opensource UI controls with two way data binding with backend. will it be possible to create same kind and quality of UI controls with blazor as well? I know we cant use xaml for UI on the web, but if blazor can unify the MVVM pattrens which we use in uwp and xamarin.forms that would be great for all c# devs, because I think MVVM is the most appreciated pattren among C# devs, and if we r just able to make plug and play UI controls like we have on uwp and xamarin that would be the best way to make this project succesful in the community. because the key to encourage web development for c# developers is to ignore all js frameworks and keep reducing friction and increase simplicity progressively by following a standard. Just a thought :)

[davidbmasterson]

I do not agree with this. many .net developers do not use the mvvm pattern. It is better to build a platform using global standards, that others can add what you would like to, rather than try and drive everyone to a specific pattern.

[touseefbsb]

ok maybe not mvvm, a basic platform would be great, what about open source controls? would that be possible on this platform? :)

[plasticalligator]

I am of the opinion the primary goal should solely be enabling DOM manipulation in the browser through .NET on par with Javascript and allow developers to produce their own UI frameworks around Blazor.

If UI controls are provided .. Blazor will inevitably become a bloated framework (think Silverlight) rather than a light-weight replacement for Javascript.

[touseefbsb]

well I wish blazor is good enough itself so that developers dont need to create their own frameworks, biggest it will encourage the biggest chaos of the web development community which is "too many frameworks". Instead of creating new frameworks around it, if developers can create services and controls using blazor ( as reusable code ) that will actually help the community more specially for beginers, where they wont have to choose from infinite number of ui frameworks. I really hope blazor can remain a proper standard full stack .NET development, extending it will be a great thing but creating new frameworks with different names and different approaches might kill the purpose, but again its just my opinion :)

[RyoukoKonpaku]

How about some standard components from MS via another package? This would solve bloat as it won't be tightly coupled with Blazor itself while having the flexibility of using components when one want's to do so.

Though that won't be possible yet without templating support at aspnet/Blazor#404 as well as proper nuget support I guess.

[touseefbsb]

with that I totally agree, standard components packages from MS would be perfect bcz they will be extending blazor, and not any new frameworks. more like "Blazor-Toolkit" or something like that.

[SteveSandersonMS]

We're working on several enhancements that will make it easier to share components via NuGet packages. Whether or not Microsoft will ship a package of Blazor components is undecided, but I'd definitely hope to see community-built packages that make it easy to consume components from Bootstrap, Material, etc.

[RyoukoKonpaku]

A fluent design inspired set would be wonderful I'd bet, it would also benefit MS by spreading their Design philosophy across platforms like how Google Material is used on websites and phones.

As for feasibility of fluent design on the web is yet to be known, though i'm sure it'd get traction if done right. Something along the lines of MS Fabric UI but for Blazor and uses more fluent design elements like light, transparency and depth.

[muqeet-khan]

@SteveSandersonMS you may be right person to tell if this is the right approach. https://github.com/muqeet-khan/BlazorComponents here I am trying to "port" ChartJS library onto Blazor. I am able to get the basic charts working and updating using Blazor. But I am not sure of the approach. Any guidance is much appreciated.

[touseefbsb]

@RyoukoKonpaku its totally possible as react native is already doing it.

[SteveSandersonMS]

here I am trying to "port" ChartJS library onto Blazor

@muqeet-khan That's extremely cool! Your general approach looks good. As soon as we implement aspnet/Blazor#340 it will be straightforward to publish your components as a NuGet package. I'm sure a lot of us would love to see that happen - charts are something people commonly want.

[touseefbsb]

and maintaining the list of qualified nuget packages/GitHub repos , regarding blazor can be listed in readme file of this official Blazor repo, that will make this repo as standard repo for blazor where we can find all the component packages for blazor as well @SteveSandersonMS

[agonzalezm]

easy to use UI components is must have! I hope MS can provide some basic UI like chats, grid, etc.. and the Office Fabric UI would be great too as pointed by @RyoukoKonpaku.

For UI components (charts, grid, progressbars, editors, etc) what is the strategy to build wrappers on top of existing javascript ui components or to rewrite UI components enterely on c# without any dependency on javascript? what are pros and cons of each?

[plasticalligator]

Rewriting components in C#: Pros: Uses a simple, modern, general purpose, and object oriented programming language with strong typing. Cons: None

Wrappers on top of Javascript: Pros: None Cons: Uses Javas!@#.

[rstropek]

@andras-ferencz I think that component vendors see cons in rewriting components in C#. They want to build web control libraries once and offer it to as many developers as possible. JavaScript is and will for a long time be the only common denominator. So I guess we will see more Blazor wrappers around JS than native Blazor libraries. But who knows, time will tell.

[ChristianWeyer]

In fact; I think we need a viable solution for Blazor components to interact with Web Components.

[rstropek]

@ChristianWeyer Without having tried it, shouldn't that just work? Web Components are part of the DOM and Blazor should be able to create them. I will try that and report the results back.

[rstropek]

@ChristianWeyer I can confirm that at least basic Web Component scenarios work. This is my demo code:

@page "/"

<hello-world who=@Greeter></hello-world>

<button @onclick(ChangeGreeter)>Change</button>

@functions {
    public string Greeter { get; set; } = "Demo";

    public void ChangeGreeter() => Greeter += "!";
}

hello-world is the demo Web Component from here. I am sure there are more complex scenarios that require further testing and maybe even changes in Blazor. However, basic stuff works as expected.

[SamProf]

Material Components for Blazor https://github.com/BlazorComponents/MatBlazor