Modernize the Blazor Web template

[mkArtakMSFT]

Includes accessibility testing (plus some feedback here: https://github.com/dotnet/AspNetCore-ManualTests/issues/2474)

[ghost]

Thanks for contacting us.

We're moving this issue to the .NET 9 Planning milestone for future evaluation / consideration. We would like to keep this around to collect more feedback, which can help us with prioritizing this work. We will re-evaluate this issue, during our next planning meeting(s).
If we later determine, that the issue has no community involvement, or it's very rare and low-impact issue, we will close it - so that the team can focus on more important and high impact issues.
To learn more about what to expect next and how this issue will be handled you can read more about our triage process here.

[mkArtakMSFT]

As part of this, we will consider feedback provided #50927 and #51326

[KennethHoff]

I want one of two things personally:

1. A template with no third party dependency whatsoever ( no jQuery, no bootstrap, no SCSS, no Tailwind, no nothing). Maybe some default styling - in actual CSS - but no library.

2. A template that allows for selecting from a list. "I want a Blazor Template with TypeScript and Tailwind", "I want a Blazor template with TypeScript but no CSS build step", "I want a Blazor Template with no JS or CSS build step", and so on. Ideally it sets it up such that all modes have the same styling such that you can very easily compare the solutions.

The former is much easier for you guys, while the latter is a potentially better UX (assuming it automatically uses the latest versions of things and sets up the build step).

[glen-84]

I prefer option 1.

Option 2 will always:

• Not include everyone's preferred frameworks.
• Become outdated more quickly, thus adding a maintenance burden to this project.

[sultan]

The project from template better not include copy pasted dependencies but instead a Libman nugget dependency + references to js deps within. I have my young students do projects from templates and have them replace links with bootstrap buttons and replace copy pasted libs with either datatables.js or tailwind.

[sultan]

As stated in issue #50121 : css classes are not well placed within the multiple css of the project. The behaviour is not consistent between desktop and mobile and this was easily corrected with the code I provided. I hope you can take all contributors code to the live templates.

[EdCharbeneau]

As stated in issue #50121 : css classes are not well placed within the multiple css of the project. The behaviour is not consistent between desktop and mobile and this was easily corrected with the code I provided. I hope you can take all contributors code to the live templates.

I fixed a lot of those issues in this PR: #51030

[wolfgangschneider]

I‘ll love option 1.

It took me hours to remove Bootstrap from the project.

update:

Content e.g Counter /Weather forecasts , optional Login should still be there.

[webprofusion-chrisc]

While a completely stripped down template may be desirable for new apps (realistically established app devs probably have a UI toolkit in mind) it's not the best for those exploring the framework and kicking the tires.

Perhaps the template could have default content (or even a small dynamic feed demonstrating an http get) that links to some useful stuff, e.g. MudBlazor is a phenomenal OSS toolkit, Microsofts own FluentUI etc. You could argue that creates favoritism but the point of a template is to get people started and set them up for success, and there are some things more likely to do that than others.

[begerard]

Having a demonstrative template with example for several use case (more than a simple Counter please!) will greatly help the adoption of the technology. And having it compatible with the different modes (SSR, Interactive, WASM) would help a lot to understand their differences.

Of course, no matter which toolkit you use for this you will be criticized. You have to live with it and not stop you from doing it.

Also, Microsoft have doing its dogfooding with some success for a long time so using FluentUI -even if it's probably not the best toolkit- would make sense (and may also help them).

[Eagle3386]

@begerard

FluentUI -even if it's probably not the best toolkit-

Says who based on what substantial evidence?

Because as a long-term MudBlazor supporter who also contributed to the project multiple times myself for almost 5 years now, I'm just in the process of switching to FluentUI-Blazor.
Thus far, there's plenty of stuff that's way easier to configure & use, yet more extendable & it's even visually more advanced due to not bearing the burden of Material Design.

[webprofusion-chrisc]

@Eagle3386 the FluentUI Blazor toolkit has come a long way this year so I think it's unfair to pick on that comment now as it was lagging at the time. Fluent UI has it's own styles which could be considered a burden in the same way that Material could be, so that's subjective. I'm also using both MudBlazor and FluentUI in different projects.

Overall though, the current FluentUI would be a good inclusion as long as the template content links to prominent templates (or perhaps to a list list https://github.com/AdrienTorris/awesome-blazor), the main advantage of including a toolkit is being able to present a very convincing first experience for new users but we still want to encourage other/new toolkits (and even no-toolkit).

[Eagle3386]

@webprofusion-chrisc Nope, it's pretty much the opposite - if you got my point right, that is.

What that is, you ask? Less judging about (UI) frameworks, especially when they're just about to mature from "better leave to POC-ish usage" to "ready for real-world use".
And that's because going back 1 year, FluentUI-Blazor, after adopting .NET 8 & finally dropping NodeJS dependencies for good, reached "rocket-speed" in gaining track - just as MudBlazor did a couple of months prior to that.

If there's anything unfair here, it's only denying FluentUI-Blazor to "fight fire with fire", so to speak.
And that's the only reason I stepped in & asked my question above - in a slightly provoking way, I'll give you that. 😉

[begerard]

FluentUI -even if it's probably not the best toolkit-

Says who based on what substantial evidence?

It is my opinion based on an evaluation I did last year so your feedback on its state nowadays is welcome!

Let's hope .Net 10 get Blazor the demo app it needs, no matter the toolkit used (which mean please vote this issue so it gets higher in the ranking as the team is probably finalizing the next version backlog right now).

[Eagle3386]

Glad, I've renewed your interest. Especially, because I got greenlight for a massive improvement regarding FluentMainLayout. 😎

Regarding your suggestion about .NET 10, I would've liked it more, if the emoji had survived. But anyway, I'm glad you didn't take it as an offense as I didn't mean to do that either.
After all, we're responsible for pushing Blazor to where it belongs - web dev spotlight #1! 😎🥳