This is what I thought Blazor was when I first heard of it. I kind of skulked away from it when I discovered painfully it was not. But look! now it is. Thank you for sharing your time and knowledge.
Exactly what I needed. Thanks very much, 12 minutes was all I required. And thanks for not plastering your face all over everything and continually inserting 'funny' images everywhere to try and 'keep my attention'. 😆
Thank you for this. The boilerplate suggested on Microsoft documentation was driving me nuts. What you laid out for WPF in your github repo is so much better. Subscribed!
This 'Blazor Desktop' implementation on my github. It's a hack and isn't what MS is pushing for Blazor-on-Desktop, they want you to use MAUI.@@bossfly8387
@@edandersen I see ok. I will give it one more shot. My problem was MS docs implementation for wpf was making my navigated components all stack one after the other on the same view instead of each component rendering in its view. Not sure what was going on there.
Thank you for the video, I have a question regarding the deployment to a client OS for the desktop version. Would the desktop version need a server version or it would run as a standalone application? Another question would it work the same for WPF? Thank you
Yep, runs totally standalone in either WinForms or WPF. The Blazor code runs in the .NET 6 Desktop process. No need for the server/browser version if you don't want it, you can use this for a desktop app only. For a WPF example of this check out the code repo at github.com/edandersen/blazor-desktop-crossplatform-sample
But this is Blazor Server Side. So each time a Windows Client is started up, a SignalR connection is made to the server, and the server pushes the HTML over socket to the client (normally web, but now a web wrapped in a WinForms). I don't get the point of this. You want a client side app, to be client side. Why have a client side app, the relies on a live socket connection to the server? -It's not really a client side app. Doesn't this approach work with Blazor WebAssembly?
That's not how it works. The winform app has no connection whatsoever with the Blazor server. The reason is all the razor pages are in the shared library and winform project only have a reference to the shared library and not the web project.
Hey! Any ideas on how I can use this approach to prompt the user to access a folder? For example, opening a file system via html input then get the path of the current directory open? What I am trying to achieve is for the user to select a directory and from that path pull all the files within that folder and files within sub directory. Any ideas?
@@edandersen This would definitely be interesting. That's the easiest way I would think to trigger a notification on the parent form. Also, that opens the door to trigger events for when async events are completed and such.
@@NathenxBrewer Yes you can, either by accessing a static class or injecting a service into the dependency container and consuming it in a blazor component
I think the biggest problem I have is that I cannot find the WindowsForms you are installing on my version of VS 2022 nor when I install blazor web forms can I see it on my toolbox.
anyone else getting the error below. I've followed the tutorial twice, closed down visual studio and still getting it: Error CS0006 Metadata file \crossPlatformToolbar\BlazorClassLibrary\bin\Debug et6.0 ef\BlazorClassLibrary.dll' could not be found
@@edandersen Aha. It's that PCIe SSD that makes all the difference. I've got a regular Samsung SSD in my laptop, true, but the whole setup is starting to show its age. It seems there might be a shopping trip in the near future around here 🙂
@@edandersen It occurred to me that putting an NVMe SSD into the laptop's SATA slot (adapters are available) wouldn't accomplish much, due to the SATA bottleneck. I think a fella would want an on-board NVMe port. Oh well...
Great video thanks ! I still wonder if this will allow me to program a native app as administrator's use, and on the other hand the web app for users or both native and web have to be the exact same use.
Answer: yes it is, can access html documents on local filesystem with Navigate() method. Unfortunately I have not found a way to do so with the NavigateToString() method.
Nice introduction! Is it possible to implement the same with the built in authentication mechanisms (EF) which can be selected at the Blazor Server project creation screen? It works whenever I start it as a web application. But it throws exceptions in the winforms app. Any suggestions? Thanks...
@@edandersen I see. Thanks for the content. I wonder if you can setup WebView2 on Avalonia Dekstop project and achieve "pure cross platform application" since Avalonia runs on Linux as well.
I wanted to use Maui. Got VS 2022 preview and everything then found out that to publish the app you need to sideload it. In doing that requires a sign certificate or Windows won't trust it
You don't. However, Silverlight needed a plugin maintained forever to continue to work. Blazor WASM can run on webassembly in normal browsers forever. MAUI is more of a tenuously spiritual successor to Silverlight if you are looking for cross platform Windows/Mac/Web apps, even though its based on Xamarin. XAML etc.
Hi Ted, thanks for this video, I was looking for something like this. I have few questions, I have a Windows form app which read / write to registry and create / reads files in disks. I am planning to make the application to multiple OS platforms through Blazor Desktop, will it be possible to access / create native disk files and for Win only OS, read registry... Any help will be appreciated. Thanks
Thank you for this awesome video, I have got an error and I cannot figure it out, the error is like "InvalidOperationException: Cannot find the fallback endpoint specified by route values: { page: /_Host, area: }."
Thanks for your reply, I already found the cause of the error, the favicon.ico was deleted somehow on time of moving the files to the shared project. Thanks again for the video.
Hello Ted, I'm unity's c# developer I really like blazor model but as you know c# of unity is so different than .net with the latest c# features. there's no clear route to be professional c# developer .. would you do a tutorial from scratch explaining how to be full stack developer using .net stack woth all goodies they offer like linq , asynchronous programming, lambdas function etc.. I like your style of videos it would be so helpful for other unity developer to get starting with app development. unity's documentation is super easy compared to Microsoft.. if you have any resources please share it with us .. thanks
@@edandersen That's what makes it so interesting ! Full power of desktop plus all the fun staff of the web !! This reminds me the functionalities of web server !
Thanks for the video, I have some questions, does it work for a blazor wams project? how is the performance? I have an application with blazor wams but I have problems when rendering many elements, it is possible that this improves when executed from webView
For anyone trying this out with latest packages: you need to do in (Form1.cs) serviceCollection.AddWindowsFormsBlazorWebView instead of AddBlazorWebView
I don't get the value here! Blazor, after all this time is still an inferior cross platform solution than Silverlight. With Silverlight I could deliver a desktop app that ran on Windows and Mac from ONE set of code, no shared silliness at all. I seriously must be missing something.
You are missing a lot. First of all, the BlazorWebView control can be put into WinForms as above, but also into WPF (which is still windows only), but most improtant, into MAUI. MAUI is coming with .NET 6 and is fully cross platform UI framework. So, using Blazor, in one go you can get: a website (server side Blazor), desktop app (both Windows and MacOS), Android and iOS (and iPadOS). All sharing the same CSS, the same languages translations (localization), the same logic, all running multithreaded .NET code.
Any questions let me know in the comments and I will do my best to answer them :)
Or come ask me direct on Discord! tedstech.com/discord
This is what I thought Blazor was when I first heard of it. I kind of skulked away from it when I discovered painfully it was not. But look! now it is. Thank you for sharing your time and knowledge.
Aw, thanks. Yeah I think this is actual ground breaking stuff
Exactly what I needed. Thanks very much, 12 minutes was all I required. And thanks for not plastering your face all over everything and continually inserting 'funny' images everywhere to try and 'keep my attention'. 😆
Glad you found it useful! Thanks!
Very nice video, well explained, concise and the code as reference! Love it!!
Thank you for this. The boilerplate suggested on Microsoft documentation was driving me nuts. What you laid out for WPF in your github repo is so much better. Subscribed!
Just a word of warning that I don't think this method is supported really, they want you to use MAUI for Blazor in a desktop app I think.
@@edandersen Sorry did not get you. What method are you referring to?
This 'Blazor Desktop' implementation on my github. It's a hack and isn't what MS is pushing for Blazor-on-Desktop, they want you to use MAUI.@@bossfly8387
@@edandersen I see ok. I will give it one more shot. My problem was MS docs implementation for wpf was making my navigated components all stack one after the other on the same view instead of each component rendering in its view. Not sure what was going on there.
That's the point.
You've made a very easy maintenance app, very flexible too, for Windows Forms, in less than half hour.
Thank you by share!
Glad it helped!
Shut up and take my like! I love where Blazor is and where it's going! Thanks for this video!
Thanks! How about a cheeky sub too? ;-)
@@edandersen done and done!
Very very helpful. Thank you Ted.
Aw, thanks! Don't forget to like and subscribe ;-)
Wow, i need this for Android and iOS
Yeah - I hope MAUI supports it. An alternative to XAML etc.
Can you create a button on the windows application and by pressing can open the blazor web browser
Great stuff dude. Thanks!
Can you make the Windows Forms app a standalone .exe file? Like, JUST the 1 file, where the .EXE contains everything it needs to run?
For this technique I really doubt it.
Thank you for the video, I have a question regarding the deployment to a client OS for the desktop version. Would the desktop version need a server version or it would run as a standalone application? Another question would it work the same for WPF?
Thank you
Yep, runs totally standalone in either WinForms or WPF. The Blazor code runs in the .NET 6 Desktop process. No need for the server/browser version if you don't want it, you can use this for a desktop app only. For a WPF example of this check out the code repo at github.com/edandersen/blazor-desktop-crossplatform-sample
@@edandersen Will this WPF app run in Linux environment
@@pragmaticprogrammer3397 Nope
From here, how would I package the winform into exe? And what is the good way to push update to user once released?
Already found the answer for the 1st question
Not sure sadly. This is a but of a hack and I wouldn't recommend it now
@@edandersen what would you recommend right now?
I don't have an answer
This was pretty cool!
Won't the appstate be shared for the users of the Blazor web server app? Only the appstate of the winform app isn't shared.
Probably. You'll want to set the DI scope to the user somehow on the server version.
so basically we're embedding an entire browser inside the winform app right? like electron js?
In a way yes I guess.
is it possible to run the host winform event from blazorwebview?
Not sure.
Very useful, thanks. its great❤
Cheers, don't forget to like and subscribe! ;-)
I am using vs studio 2019, I can't find blazor maui template for vs studio 2019. Give up using blazor, maybe next 2 year
You need 2022
But this is Blazor Server Side. So each time a Windows Client is started up, a SignalR connection is made to the server, and the server pushes the HTML over socket to the client (normally web, but now a web wrapped in a WinForms).
I don't get the point of this. You want a client side app, to be client side. Why have a client side app, the relies on a live socket connection to the server? -It's not really a client side app.
Doesn't this approach work with Blazor WebAssembly?
That's not how it works. The winform app has no connection whatsoever with the Blazor server. The reason is all the razor pages are in the shared library and winform project only have a reference to the shared library and not the web project.
Hey! Any ideas on how I can use this approach to prompt the user to access a folder? For example, opening a file system via html input then get the path of the current directory open?
What I am trying to achieve is for the user to select a directory and from that path pull all the files within that folder and files within sub directory. Any ideas?
I'd pop a native dotnet file picker
@@edandersen is it possible that when the user clicks on an HTML button to send a click to open the native dotnet file picker?
I reckon so. You'd need to use the injection method in the code on github
I use mudblazor as UI library. How can I install it to razor class libray?
I was able to use mudblazor with this setup. Works great in both winform and wpf.
Very useful, thanks.
Great video.
How can I access database on azure using the desktop ? Should the blazor be wasm or server side ?
Server side Blazor for database access
@@edandersen
I what should convert to desktop if I want to access to remote data : wasm or server ?
Server. But when it's a desktop app it doesn't matter
Can you fire event's from within Blazor's code-behind and trigger something on the parent WinForm?
Probably! I haven't tried it.
@@edandersen This would definitely be interesting. That's the easiest way I would think to trigger a notification on the parent form. Also, that opens the door to trigger events for when async events are completed and such.
@@NathenxBrewer Yes you can, either by accessing a static class or injecting a service into the dependency container and consuming it in a blazor component
Gracias Mistes Teds.... saludos de los andes peruanos
This no longer works as Webview no longer uses windows forms as a base class. The base class is now called WebViewManager. I'm stuck in its usage.
I think the biggest problem I have is that I cannot find the WindowsForms you are installing on my version of VS 2022 nor when I install blazor web forms can I see it on my toolbox.
Try the github repo linked in the description and see if it works
In Form1.cs you need to do serviceCollection.AddWindowsFormsBlazorWebView instead of AddBlazorWebView
Yeah it's a bit hard to update the video. The linked github repo should be up to date
anyone else getting the error below. I've followed the tutorial twice, closed down visual studio and still getting it:
Error CS0006 Metadata file \crossPlatformToolbar\BlazorClassLibrary\bin\Debug
et6.0
ef\BlazorClassLibrary.dll' could not be found
Things might have changed since this vid was recorded, check out the linked github repo which I try to keep up to date
It's possible there is an error in the share library. Possibly the host.cshtml
Would you be willing to share the specs of your dev box? I like the speed I'm seeing.
Hey. At the time of this vid it was a AMD 5900X CPU, 32GB RAM and a pci-e SSD. Nothing too special :-)
@@edandersen Aha. It's that PCIe SSD that makes all the difference. I've got a regular Samsung SSD in my laptop, true, but the whole setup is starting to show its age. It seems there might be a shopping trip in the near future around here 🙂
@@edandersen It occurred to me that putting an NVMe SSD into the laptop's SATA slot (adapters are available) wouldn't accomplish much, due to the SATA bottleneck. I think a fella would want an on-board NVMe port. Oh well...
Yep
This kind of desktop app can call the MS Outlook for sending out an email? Or just an web app running on desktop?
You can call native C# Windows code from Blazor using this method, so should be able to do Outlook stuff
A very good tutorial. But I have a question. is it possible to build such a solution but using the authorization function on the Blazor side?
I think it's possible. You could have a separate web API project that handle this then call it from the shared library
Great video thanks ! I still wonder if this will allow me to program a native app as administrator's use, and on the other hand the web app for users or both native and web have to be the exact same use.
Quite likely this will be possible :-)
Is it possible to do this with a razor pages app?
Not sure I'm afraid :)
this a good demo
I need to play videos dynamically, in the web view, from my local drive. Is that possible in this setup?
Answer: yes it is, can access html documents on local filesystem with Navigate() method. Unfortunately I have not found a way to do so with the NavigateToString() method.
That's great you figured it out :)
Nice introduction! Is it possible to implement the same with the built in authentication mechanisms (EF) which can be selected at the Blazor Server project creation screen? It works whenever I start it as a web application. But it throws exceptions in the winforms app. Any suggestions? Thanks...
Try one of the MAUI Blazor templates, this method isn't really.supported
How can it be cross platform if Winforms and WPF only runs on Windows?
Blazor Desktop will support MacOS on MAUI, I just haven't got round to figuring it out yet :)
@@edandersen I see. Thanks for the content. I wonder if you can setup WebView2 on Avalonia Dekstop project and achieve "pure cross platform application" since Avalonia runs on Linux as well.
Can any data type be used with AppState?
Yeah pretty much!
you should try blazor maui to do the same and more
I wanted to use Maui. Got VS 2022 preview and everything then found out that to publish the app you need to sideload it. In doing that requires a sign certificate or Windows won't trust it
It is interesting. But how do you know it won't be another Silverlight?
You don't.
However, Silverlight needed a plugin maintained forever to continue to work. Blazor WASM can run on webassembly in normal browsers forever.
MAUI is more of a tenuously spiritual successor to Silverlight if you are looking for cross platform Windows/Mac/Web apps, even though its based on Xamarin. XAML etc.
Hi Ted, thanks for this video, I was looking for something like this. I have few questions, I have a Windows form app which read / write to registry and create / reads files in disks. I am planning to make the application to multiple OS platforms through Blazor Desktop, will it be possible to access / create native disk files and for Win only OS, read registry... Any help will be appreciated. Thanks
It should be doable yes :-)
Great video. In what scenarios do you think this is useful?
As an alternative to Electron
What's the final .exe size minimum?
21MB
Thank you for this awesome video, I have got an error and I cannot figure it out, the error is like "InvalidOperationException: Cannot find the fallback endpoint specified by route values: { page: /_Host, area: }."
Check the linked repo for an up to date version :-)
Thanks for your reply, I already found the cause of the error, the favicon.ico was deleted somehow on time of moving the files to the shared project. Thanks again for the video.
Hello Ted, I'm unity's c# developer I really like blazor model but as you know c# of unity is so different than .net with the latest c# features. there's no clear route to be professional c# developer .. would you do a tutorial from scratch explaining how to be full stack developer using .net stack woth all goodies they offer like linq , asynchronous programming, lambdas function etc.. I like your style of videos it would be so helpful for other unity developer to get starting with app development. unity's documentation is super easy compared to Microsoft.. if you have any resources please share it with us .. thanks
Glad you liked it! Best place to start is the official "dotNET" channel :)
Is desktop app only run in windows?
Yes
So it will work even if some components require JS interop?
Yep it still has a full Edge browser instance
@@edandersen That's what makes it so interesting ! Full power of desktop plus all the fun staff of the web !! This reminds me the functionalities of web server !
Yep check out the linked git repo - you can even do WebGL!
Thanks for the video, I have some questions, does it work for a blazor wams project? how is the performance? I have an application with blazor wams but I have problems when rendering many elements, it is possible that this improves when executed from webView
I think this is designed for server although the boundary is blurred a bit. Its almost a third Blazor mode. Perf seems fine.
Nice Demo
Can it be used in Windows Store as well?
I think so, either with the desktop bridge stuff for UWP in Windows 10 or the normal MSI installer support in the Windows 11 store
Is this ready for production?
I believe its supported in Production when .NET 6 is finished :)
Thanks for the video. Is this possible in VB .Net ?
Not sure I'm afraid :)
@@edandersen Um, VB is the second grade citizen in dot net family.
Is the performance comparable to a native app? Especially for a UI transition + data heavy app?
Same performance as a Edge browser - so pretty good. Maybe even better in some cases.
dear pogramming content creators; please dont use mechanic keyboard.
Nice one!
that is cool
Gidday
Cool
Flutter can do this in less than second
Correct!
For anyone trying this out with latest packages:
you need to do in (Form1.cs) serviceCollection.AddWindowsFormsBlazorWebView instead of AddBlazorWebView
I don't get the value here! Blazor, after all this time is still an inferior cross platform solution than Silverlight.
With Silverlight I could deliver a desktop app that ran on Windows and Mac from ONE set of code, no shared silliness at all.
I seriously must be missing something.
You aren't missing anything.
You are missing a lot. First of all, the BlazorWebView control can be put into WinForms as above, but also into WPF (which is still windows only), but most improtant, into MAUI. MAUI is coming with .NET 6 and is fully cross platform UI framework.
So, using Blazor, in one go you can get: a website (server side Blazor), desktop app (both Windows and MacOS), Android and iOS (and iPadOS). All sharing the same CSS, the same languages translations (localization), the same logic, all running multithreaded .NET code.
Egg sil lint !
Debugging this is hell, checked it.
Highly likely
I hate your keyboard… it’s have a bad sound, do not use it for video!
Cool