Can you develop a webpage using .NET MAUI and blazor and target the web, ios, android and windows?

Question

I have recently read up on .NET MAUI but I am confused about its purpose with Blazor.

Can you develop a webpage using .NET MAUI and blazor and target the web, ios, android and windows?

For example develop the web page effectively to also work as an app on any other devices, but in the browser work the normal Blazor way (i.e use WASM)?

Scammony

MAUI isn't for the web, so you'll end up with two final projects, one targeting the web with Blazor, the rest with MAUI. A web page that acts as an app is PWA, which Blazor already supports. – Multure

@Martheen, ".NET MAUI Blazor" is definitely a thing – Semitropical

@KirkWoll - it’s definitely a thing, but it isn’t what OP asks for. According to description in that link, it lets you use Blazor web code inside a Maui app. That’s the opposite of what is asked for, which is to use .Net Maui everywhere, including on web. Waiting for that myself. (Been waiting for that since Xamarin came out. Without that, Maui is missing on the platform that matters most. Limiting .Net’s appeal. Javascript-based solutions (React) will continue to gain mindshare.) – Waziristan

Daniel Roth from the Microsoft Blazor team demonstrated this scenario with an example app : github.com/danroth27/BlazorWeather and indeed for now you will have 2 project heads, the real blazor one for web and the maui one ( with the same blazor code ) for all other targets. – Creak

Answer 1

In .NET MAUI a BlazorWebView component is added, which can run full Blazor code, including css and the JavaScript interop (so it can even run all kinds of JavaScript components).

Because the way you define pages and the wwwroot can be exactly the same in a .NET MAUI Blazor project as in a Blazor WASM project, you can share your Blazor pages, wwwroot, code etc.: Put the same code both in your Blazor WASM project and in your .NET MAUI Blazor project. You can also add and use your Blazor class libraries. This way, you can run exactly the same code in a web browser (Blazor WASM) AND in a native iOS/Android/Windows/Mac app (.NET MAUI).

Extra bonus: when running on .NET MAUI you run native, so you can access all native components/hardware, add push notifications etc. from Blazor, which you don't have access to from a Web App.

See the Introduction to .NET MAUI Blazor video for a clear explanation.

In the .NET MAUI app, the BlazorWebView is a component, so you can combine it with XAML code if you want to.

However, the opposite is not true, you can NOT run a XAML UI in a Blazor WASM web application.

Prosit

Wow, perfect thank you, definitely worth investing in then – Scammony

@Scammony - To be really clear (because the situation has confused many people): The end result is to use BLAZOR everywhere. MAUI can't run on the web. ("can NOT run a XAML UI in .. WASM web app" may not make that clear to people. ALL the classes that are part of MAUI, won't be there on the web - unless they are part of Blazor. Hopefully someday...) – Waziristan

What about the authentication that is taking place in the blazor wasm app? Doest that need to change or that can stay and BlazorWebView will handle that as well? – Cannabin

There is a first class way to do this now. learn.microsoft.com/en-us/aspnet/core/blazor/hybrid/tutorials/… – Ricardaricardama