How To Create a Progressive Web App with Blazor WebAssembly

[@computerchris1296]

Thanks for all the great content you provide, you are truly a master at teaching these concepts and staying up to date on current technology.

[@IAmTimCorey]

My pleasure!

[@esmanmudimu1627]

Thank you very much dear Tim. Much appreciated, very helpful. Your explanations are very clear. All of your videos l have watch are just great!!!. Keep it up!!

[@tomthelestaff-iamtimcorey7597]

Thanks for watching and trusting Tim to help expand your skills

[@bananadev13]

Hi Tim, I know you have added a more in depth video of PWA's to your list, but I would just like to encourage you to do it as well please. I have just started my first job and really like your videos, they have helped me countless times.

[@IAmTimCorey]

Thanks for the suggestion. Please add it to the list on the suggestion site so others can vote on it as well: suggestions.iamtimcorey.com/

[@jeffsaffron5647]

Great overview. Looking forward for a tutorial how to combine this with WebAPI. Especially how to publish the whole thing.

[@IAmTimCorey]

I will add it to the list. Thanks for the suggestion.

[@cetinogut]

Mant thanx Tim. Great tutorial. Just a quick note for newbies like myself, Chrome replaced the "+" icon with a download icon and moved it into the URL bar.

[@tomthelestaff-iamtimcorey7597]

Thanks for the tip

[@jiribatulka49]

Thank you Tim! I was waiting for this one.

[@IAmTimCorey]

Hope you enjoyed it!

[@cervantes01]

Loved the video, great explanation, keep up the good work!

[@IAmTimCorey]

Thanks!

[@nimrod2142]

Haha Tim, again, great timing. I already decided that my next project will use PWA cause I need cross-platform and offline support, guess I could not choose a better time for that.

[@IAmTimCorey]

Fantastic!

[@kevingates5851]

Been looking forward to this one. (Also, first comment. Woo!)

[@IAmTimCorey]

Hope you enjoyed it!

[@zoltan.halasz]

I heard about PWA last year when I tried Firebase with Angular. Nice introduction with wasm.

[@IAmTimCorey]

Thanks!

[@belmiris1371]

Are you bugging my phone, I was just telling my friend I was wondering if I could turn a Blazor App into a PWA last night.

[@IAmTimCorey]

Well, I am happy you got your answer.

[@StudentCompanion]

Great topic. Thanks a lot. It really helpful and will definitely try it.

[@IAmTimCorey]

Glad it was helpful!

[@luismendez9436]

Excellent insights on this tool. Will really opens up new ways we can deploy small - personal tools. Thanks for this.

[@IAmTimCorey]

Glad it was helpful!

[@willinton06]

I already built a production application on this, been using it for about a year now, it works great if you work out the kinks

[@IAmTimCorey]

I am glad you are enjoying Blazor.

[@HermanWillems]

Is it not heavy with the whole runtime and GC sitting in the front end? How well does Blazor webassembly do in the benchmarks? Rust webassembly is mostly at the top of all front end frameworks regarding performance. I havent seen blazor webassembly in the benchmark yet...

[@IAmTimCorey]

Right now the runtime is about 2.1MB total and that is decreasing. While that seems huge, the reality is that it is a small percentage of most data-driven websites. It is also cache-able.

[@willinton06]

IAmTimCorey how small do you think the runtime can get?

[@HermanWillems]

@@willinton06 What about getting rid of any runtime. Runtime is just overhead..

[@FrankLiuSoftware]

Hi Tim, I like your tutorials very much! I am making my own tutorials and would like to ask a favor. Would you please tell me how you manage to make your keystrokes silent in your tutorials? Do you record the voice and video separately?

[@IAmTimCorey]

I don't record the audio separately. I use a good directional mic and I clean the background noise.

[@FrankLiuSoftware]

@@IAmTimCorey thank you so much Tim!

[@talkathiriify]

Excellent Course as usual! Thank you very much Tim.

[@IAmTimCorey]

You are welcome.

[@androidsavior]

Hi, Blazor PWA does not work in offline mode on mobile phones right ? I tested this and it does not work offline on mobile but it works offline on PC (chrome + firefox)

[@IAmTimCorey]

It does work offline everywhere, not just on computers.

[@theumairtahir1]

Hey Tim! your video is awesome and informative as always. After watching this, I have decided to make my upcoming android apps as PWAs but there's a thing, can you make a more extensive video on this? I mean including push notifications etc.

[@IAmTimCorey]

I will add it to the list. Thanks for the suggestion.

[@reevesie007]

Thanks, great video. We are about to invest in a new project which requires a web and mobile element. It'll be a self-funded project so cost-efficiency is key. Administrators will use the web front-end and normal users will use the mobile app. I was going to take the Xamarin approach, but after seeing this video, I'm seriously considering PWA. The app will need to run on Android and iOS and requires the use of the phone's camera and we need to send push notifications. In this scenario, would you recommend going the PWA route? Also, do you sell any courses that cover these topics?

[@OdintheAse]

Hey Tim! I really love your Videos and watched almost any and all on C# and now on Blazor. You're really great at teaching! Thanks for all that, this really provides much help Could you do Videos on differnt ways to publish as well? That would really help a lot

[@IAmTimCorey]

I can add that to the suggestion list. Thanks.

[@OdintheAse]

@@IAmTimCorey That would be great. I'm trying my best to deploy my Blazor Webassembly (no - core, as you suggested) on a Linux server , but can neither find any online documentation on this, nor does it want to work the ways i tried. There are just so many ways you might want to deploy an Blazor App (Server AND Webapplication) that a in depth guid would be really helpful

[@rivaldovola9896]

Hi tim. I want to start making a blazor webshop. should I use PWA and ASP.core hosted or only PWA?

[@markbennett1237]

Would you consider PWA's a good approach to developing portable GUI desktop applications in C#, or would it be better to consider some other GUI library like Avalonia or GTK# or whatever else there is? There do not appear to be too many choices available yet.

[@IAmTimCorey]

It depends on what you mean by "desktop application". A PWA using Blazor WebAssembly can do a lot. However, it isn't going to have the full power of the desktop. It is super-easy to create and deploy, though, so it should be the first option you consider. However, if you need more power, you can use .NET MAUI, Blazor Hybrid, Uno, or Avalonia. Those are the biggest options.

[@markbennett1237]

@@IAmTimCorey Just tried Uno yesterday on Ubuntu Linux. Got everything setup OK, but when I tried running the sample, strange things happened while resizing the window. The controls did not scale smoothly, and sometimes ended up in the wrong location when you are done resizing. Hover the mouse over the controls, and they get drawn in the correct location. Too bad, I had high hopes for this.

[@IAmTimCorey]

Sounds like you might want to dive a bit deeper into what is going on. That's not a common experience, from what I've heard. Submit an issue if you need to on their GitHub.

[@juliandormon7536]

Thanks. I've developed a PWA in Javascript and I am wondering if Blazer has any builtin caching mechanisms, such as Google's Workbox? It would be great to see you cover the more complex side of that. Thanks

[@IAmTimCorey]

Not built-in but there are ways of doing it, including using Google's Workbox with Blazor.

[@digitalman2112]

Not sure what happened but not seeing the plus icon to install for any of my PWA's.

[@IAmTimCorey]

The plus is on Chrome. Different browsers show it differently.

[@hakuryyuu]

Thank you for your great Videos! I have a question about the breaking Patch thing: Is there a way where I can notify the User to restart the app before they start working? Like they start up the App, the app checks the state and the result is it is outdated -> Display a notification. Thanks in advance :)

[@IAmTimCorey]

Yes there is, but you would need to code it. It isn't built into the system. You could check the version number against what the latest version number is on the server to determine that. Or you could listen for the background install event to complete.

[@ahmeddabas]

Thank u tim , i'm a big fan Now ... we looking for tutorial explain CRUD operation using blazor WebAssembly and Server side , to discuss the different between two approaches

[@IAmTimCorey]

I do that in the Getting Started with ASP.NET Core course: www.iamtimcorey.com/p/getting-started-with-aspnetcore

[@maboxdiamond3812]

My applications runs well but after closing Visual Studio and then I experience the problem?????

[@niclast7600]

Been working with a console app that collects data from openweather. I wanted to do a GUI in the future instead of using the console. I was thinking of learning MVC or windows form. But a blazor app seems right up my alley sence Iv been using ado net web applications alot.

[@IAmTimCorey]

Blazor is a great web application type set.

[@kenhuynh3399]

Hi Tim, Can you please show A single C# / .NET 6 Blazor app running in the Browser and on Desktop as a native app? Thank you

[@HermanWillems]

How well does Blazor Webassembly perform in front-end performance benchmarks? Hopefully they make one so we can compare for example with Rust Webassembly frameworks who currently run at the top, near vanilla JS implementations.

[@IAmTimCorey]

It runs really fast, but it is still using WebAssembly so there is a limitation there (regardless of what language is using WASM).

[@chezchezchezchez]

I’m visiting this video a year later, what’s changed since then? Does this video need an update? Thanks

[@IAmTimCorey]

It still works this way.

[@MarkoMijuskovic]

Hey Tim, am I understanding this correctly that when you modify your Blazor WebAssembly app I have to now close/open the app twice? 1st time close so it picks up on the new code, the open but it still 1st load the old code because it's cached so close again and then open to pick up on the new changes? Please tell me I'm wrong because this is less that ideal... Has anything changed since you posted this video almost 3 years ago? I don't care about offline mode, I just want it to be a PWA in online mode and show "offline warning" when it's offline? Also, can I do push notifications? Is there a good tutorial anywhere for how do you actually build an actual app with all these scenarios ironed out...?

[@IAmTimCorey]

Yes, you will have to restart in order to get the new features. This is a WebAssembly thing, not a Blazor thing. Otherwise, your user could be in the middle of doing something and their work would be wiped out by the reload. As for push notifications, yes, you can add those. I’m working on a PWA course that should be coming in a few months.

[@Aslam2k]

Hi Tim. Can you make a tutorial that includes blazor Web assembly as front end and a microservice model for a backend. Creating Apis and consuming. Also loving your videos. helps me learn alot.

[@IAmTimCorey]

I will add it to the list. Thanks for the suggestion.

[@reodanoe-jankolar1410]

I'd like to see how to publish and then run the app. I'm also a little bit confused about client side blazor apps in general. Like, how do you give the app to users to use and what's the actual difference between that and progressive web app.

[@IAmTimCorey]

My Which ASP.NET Core course shows you how to publish Blazor projects (both types). As for how to give this to customers, you give them your project's URL. They browse to it like any other site and install it if they want. That is what the PWA is - an installable website.

[@mitkram99]

What about focusing a specific element like let's say input element? Does C# Blazor able to handle that UI behavior? or will it be needing a javascript support to handle that kind of UI behavior? The reason I ask is because I currently use VueJS right now where I have a realtime notication and if you click the the alert notification, it will push a new component and focus on the inputbox next to the specific data the user is notified for. Am gonna finish watching this video once I'm done completing my task later that's why I asked this question ahead. I'd like to dig in more about the behavior of Blazor in UI so I could visualize its limitation on UI behavior. Thanks

[@DavidSeesSharp]

You cant access the DOM over Blazor (Webassembly and Server) directly and therefore have to use Javascript Interop.

[@mitkram99]

@@DavidSeesSharp - right, that's what I was thinking while starting to dig in with Blazor. There's still has its own limitation on UI. But it's really a nice alternative for C# developers though who hates working with javascript.

[@nimrod2142]

Specifically for focusing an element you will still need some JS code but I find Blazor very good at making your page dynamic, so you can basically do all the other things you listed easily with Blazo. You will end up with 4 lines of JS code to do what you need in this case. And who knows maybe they will add support for that in the future :)

[@IAmTimCorey]

For UI manipulation (display/element manipulation), you will probably need the JavaScript interop (just like you do for any WebAssembly application). However, for all data manipulation, you can do that in C#.

[@scwyldspirit]

So Tim are you planning on doing the other side of this by going over the .net core hosted/progressive web app?

[@IAmTimCorey]

Yes I am.

[@shaun811]

I am trying to decide on what to build our next application in. I cant seem to find a good answer as everyone just says microsoft never makes up their mind what they will continue to support. So is blazor web assembly the best choice to make a desktop application or is wpf ? Which would you choose to create a dashboard that needs support for the next 5 years.

[@IAmTimCorey]

For a desktop application, you would probably want to use WPF (which will be around in 5 years, even if it isn't in the latest .NET version). If you use WebAssembly, which is a web application that runs on the desktop (not the same as a desktop app really), it would need an API to support it. That could be a great thing, but it is something to note.

[@shaun811]

@@IAmTimCorey Thanks for the reply Tim. Is it incorrect to assume that since blazor client side app with web assembly allows you to create deployable desktop applications that use the browser as the ui and .net(c#) on the backend? What would the API be needed for? Most of my experience is in web developing (html, css, and php) but with my current job we do not have access to a server so desktop application seemed to be the best option. I loved the idea of an HTA BUT it is not really supported these days so blazor got me really interested and I was comfortable with learning c#. Thanks again for all the great info and videos. Really impressive and fun to learn from.

[@sukhmindersingh2291]

Can we create a Progressive web app using Blazor server side application?

[@aakburns]

Are you going to do a course on converting Server to WASM? It's a big issue.

[@IAmTimCorey]

Thanks for the suggestion. Please add it to the list on the suggestion site so others can vote on it as well: suggestions.iamtimcorey.com/

[@verttix]

this was great. Will you be adding this to the Blazor course?

[@IAmTimCorey]

This is Blazor WebAssembly. I have a Blazor Server course now. I will be adding courses on Blazor WebAssembly in the near future.

[@H8orSk8]

Hey Tim, Just out of curiosity, how does PWA do in terms of saving the user application state? If the function of the application was somesort of data analysis, would the users have to input the same data everytime they open the application or would the application save its state with the data on that specific device (considering that they've installed the PWA on their device). Normally I would use authentication to keep the user data consistent, but I've read somewhere that you can't use sqlite for PWA (I don't know if this is true). Is there a solution to all this, or am I trying to use the wrong tool (WebAssembly) to build this application?

[@chezchezchezchez]

Did you find out?

[@alibarznji2000]

Hey Tim, I´m really inerested in Blazor, but I have some doubts about the runtime issues it´s having because it´s still new, but do you recommend it against other server side technologies?

[@jeffsaffron5647]

really depends what you need to do specifically. As my experience Blazor PWA... it is definitely a new tech with a lot of issues. Firstly install option shown in the video only seems to work in Chrome. I didn't manage to figure out how to install the app in Edge or Firefox (or Safari :) ). Development is little annoying, VS is still buggy, mostly highlighting non-existent issues. But it will get better for sure.

[@IAmTimCorey]

Comparing a client-side application to a server-side one isn't really a fair comparison - they do different things. My general recommendation is to use Blazor Server for most cases. Use Blazor WebAssembly when you need offline support, PWA support, and other things that only a client-side app can do.

[@dimka59ru]

Great! How do you think, It will be popular in the future? Can I use this in my new projects?

[@IAmTimCorey]

I can't predict the popularity of it, but I am using Blazor Server in most of my new projects and Blazor WebAssembly in the projects that need offline support.

[@dimka59ru]

@@IAmTimCorey thanks!

[@TonoNamnum]

Hi Tim thanks for all your great videos. Thanks to your videos and blazor I will try web development. It sounds much more interesting now. I tried your video, created the blazor webassembly app and it ran great under IIS. But how can I run it without IIS? I tried opening index.html on my computer and it displayed an error. Moreover, I copied the wwwroot directory to a different web server (Mongoose) and it never load. How can I run the app locally without the help of IIS?

[@IAmTimCorey]

You need a web server to run it. It isn't a desktop application. Even if you deploy it so offline will work (you can't use offline in development, for good reason), you still need to host it on a server. The computer you deploy it to will need to be connected to the Internet for the first connection. After that, it will be able to work offline.

[@dhirenpathak]

It's a good tutorials, but i had problem when i deploy to IIS , get error service worker is not register, pl. help

[@IAmTimCorey]

It sounds like there is some type of issue with your IIS setup. Either that or you aren't deploying all of your files correctly.

[@kevinfurst8163]

Hi Tim I didn't know where to put this question, so I will just put it here in your latest video. Can you recommend a tool/framework for a cross platform desktop application? I need to write an application that runs on windows and macOS. I was thinking about xamarin, but it seems to me that this is more suitable just for mobile apps. Also, my dektop app might have "heavy" UI content, like very specific buttons and styles.. I have never done something for crossplattform, so I'm a bit lost. Hope you can help me.

[@IAmTimCorey]

Check out the Uno Platform: platform.uno/ (soon we will have MAUI as well)

[@stewarthyde5111]

Tim interesting video, but I am curious how the PWA and ASP .Net Core options work together - you can used both but can they work together. I would assume they don't work in offline mode but maybe they do. Weather service goes though this .Net Core portion.

[@stewarthyde5111]

Except looking at actually and Pages like fetchdata and actual service, I can not figured out way to detect the difference. It not that important but for Extension I working on

[@IAmTimCorey]

They don't work offline. Only Blazor WebAssembly itself works offline.

[@stewarthyde5111]

@@IAmTimCorey But the options can be used to go - Microsoft must have a purpose - unless they found a way to make included core net to work locally but I doubt it - probably only for when it is connected.

[@SibTiger33]

@@stewarthyde5111 Yep i'm also curious about this

[@SibTiger33]

@@IAmTimCorey what is the purpose of the asp.net core host option ? which can be enabled at the same time

[@adamschneider868]

Is there a way to change the ICON for the application when installed?

[@IAmTimCorey]

Sure. That's one of the options you get to set in the configuration.

[@BenHayat]

Corey, this video came out almost a year ago and Blazor wasm is getting new updates. What about building hybrid apps using Blazor and Cordova to install as an Android or iOS app?

[@IAmTimCorey]

The Blazor Hybrid apps and other fun things are coming out in the .NET 6 timeframe (November 2021). That's when we can start building native or near-native apps like we can do today with Electron.

[@MrTellus]

I was expecting beeing shown best practicies in the service-worker.js - so see it as a suggestion! Heard there is a way to access the client machines file system from a pwa, do you kow what nuget or something else that's needed?

[@IAmTimCorey]

This is an intro video to PWA with Blazor WebAssembly. I will cover service worker more in-depth in future videos. As for accessing the client's file system, you can upload files with Blazor directly but you don't have access to the file system directly (that is a web security thing).

[@MrTellus]

@@IAmTimCorey OK. Was told that since the serviceworker can do work without the browser being active that you could go outside of the sandbox with the worker but good to know security concept holds up even with the serviceworker and javascripts.

[@1eyewonder27]

Hey Tim, thanks for the great content as always. This might be a silly question but are there any benefits to making a PWA ASP.NET hosted? I know you can do prerendering for instance but I have only seen that for a standard web assembly hosted project.

[@IAmTimCorey]

You need to get your data from somewhere. The hosted project basically creates an API that can send data from the server-side to your Blazor WebAssembly app. You don't need that hosting, though. In the TimCo Retail Manager app, we are building a Blazor WebAssembly PWA using our own API instead of a hosted app.

[@1eyewonder27]

@@IAmTimCorey So if I had other external APIs my client was using, would I ideally want to call them from the client to prevent additional traffic on my server side application or is it structured to be once it is hosted I have to go through the server side app? Thanks for the quick response!

[@DigitalNomadOnFIRE]

@@1eyewonder27 Hosted apps provide the API project for you, setup in a fast convenient way and you don't need to setup CORS. It's an out of the box solution that often makes sense for greenfield sites where you're creating a new blazor client app AND API from scratch (at least that's my understanding). It also allows simpler deployment of a single site essentially.

[@denisr.8248]

The PWA dont work after you change the name of the app i think did you tested it ?

[@IAmTimCorey]

Yes, I tested it and it worked.

[@andywalter7426]

I have 2 questions. First, if a person has to publish first in order to have true offline support, then if a person does not choose aspnet core hosted, then how does a person even run it outside of visual studio if they can't afford web hosting and they already used up all 10 azure app services? Also, i heard you mention about limitations about local storage. However, that was not discussed here either. Another question. Can progressive web app be a good option if they want to support iphone and can't afford to pay 100 dollars a year or if they did pay the 100 dollars but the apple app store won't approve the app.

[@AdamsTaiwan]

Concerning Azure, I'm creating a few PWAs that are nested in subfolders of a single Azure website. My top level acts as a app store. This is the approach I'm using to avoid all the trouble with multi-system development. Both Google and MS are increasing speed in making the browser a better platform for native apps. For example, rendering UI off the main thread which I can't do with WPF.

[@IAmTimCorey]

You can publish to IIS on your own machine or you can pay for a web host that supports unlimited subdomains. The limitations on local storage vary depending on the browser but are typically 5MB, plus local storage can be cleared at any time. For instance, I believe Apple is now saying they will clear local storage after 7 days if you don't use a site/app. As for PWAs being a good substitute for "real" apps, not really. They don't have the same power, they have more limitations, and they are harder to get users to install.

[@zulhishamtan4308]

As always... Very precise. Can you show how to make blazor webassembly running offline mode. Again... Thank you very much.

[@IAmTimCorey]

Noted, added to my suggestions list.

[@jaswinderbhatti3186]

hey Tim! i used this scenario in vs2022 with core 6.0. Its not worked.

[@IAmTimCorey]

It sounds like you missed something. It still works with .NET 6 and VS2022.

[@Pleviwow]

I think you can publish a PWA to an appstore. I don't really know the drawbacks, never tried it

[@IAmTimCorey]

I think it is technically possible but it seems like a lot of work and headache for not a lot of value.

[@paulrosemberg3763]

Tim, going back to Blazor Server, is is possible to host a Blazor Server App in a Subdomain? I've tried and I am getting lots aof 404

[@josephmarsh5031]

I can't seem to add the blazer app template to my projects. I have dot Net core installed and asp web dev but no matter what I do I can't find the template. I'm on windows 10 in VS 2017 community

[@IAmTimCorey]

The issue is Visual Studio 2017. You need Visual Studio 2019. You can get the free Visual Studio 2019 Community Edition at visualstudio.com

[@josephmarsh5031]

@@IAmTimCorey ok thanks!

[@allthecommonsense]

I'm having a hard time imagining any kind of valuable service that could be used offline without also downloading a crap ton of potentially sensitive, hack-able data. My own lack of vision, however.

[@seancpp]

Maybe it could have cached content for when the user is offline, and if the user creates some content while offline, it'll keep it in a sort of local queue and push the new content when a connection is established

[@IAmTimCorey]

I will be doing a complete application from start to finish course that will build a PWA that uses offline data. One reason I have seen is for remote installers - my TV person has my work order on their phone. They can't rely on the Internet being available at my house so the company uses a PWA. They can review the work order, fill in the details, and even close it out (with my signature, pictures, etc.) without the Internet. When they get back in range, the work order syncs to their system.

[@allthecommonsense]

Sean Franklin yep I’ve always known it’s possible to have temporary offline storage that syncs back up, but the use cases are limited. It’s not like we can create a dating site that works offline, for example. Will also be very interested to see how secure the offline local storage is.

[@CoreyThompson42]

We have built a highly configurable enterprise platform app that requires some rather involved configuration files. We have dozens of parallel new projects launching at a time. Enough so that we have multiple full time software engineers getting behind doing this configuration rather than development. We are about to make a companion PWA to reflect off of our dll’s and expose configurable data. We will dynamically create forms based on available data to serialize their choices in the proper format. The user will download their intended target version from our server and may not need web access again for hours while doing configuration. Our end users are project managers or applications people and are heavy travelers, so this is a big win to do this work on a tablet while offline.

[@VenkateshBOLLAM]

@@IAmTimCorey is this app done ? And do we have a course for this

[@AMIRKHAN-dm2fm]

i am facing integrity related issues after deployment but it works fine locally and azure .so please make a tutorial on it how to solve integrity issues.

[@tomthelestaff-iamtimcorey7597]

Topic suggestion noted and have added to Tim's list of viewer requests, thanks.

[@AMIRKHAN-dm2fm]

@@tomthelestaff-iamtimcorey7597 Thanks

[@AMIRKHAN-dm2fm]

please keep it in top priority i have production ready app just stuck with this issue.

[@tomthelestaff-iamtimcorey7597]

@@AMIRKHAN-dm2fm We have several projects in the works. IF Tim even were to consider this video, it would be quite a long time from now and certainly not in any timeframe to assist with your immediate need.

[@KurtInTampa]

Are Push notifications to a (Blazor) PWA a thing while the app is closed but the device is online? I currently get email notifications when an enterprise app I maintain has an exception, would like to get a little fancier...

[@IAmTimCorey]

Push notifications are a thing. I'm not sure about push notifications when an app isn't running, though.

[@KurtInTampa]

@@IAmTimCorey It looks like there has to be a service worker included with the app. Looks like it requires some js (docs.microsoft.com/en-us/aspnet/core/blazor/progressive-web-app?view=aspnetcore-3.1&tabs=visual-studio) thanks again for your time.

[@onyxgc2568]

I was actually looking some basic CRUD functionality, and how the syncing would work when user goes online :(

[@IAmTimCorey]

We will cover that in a future video.

[@lardosian]

AWS offer a solution in their Amplify framework called DataStore. The user interacts with their local web db that syncs with dynamo db in the cloud.

[@kandy1249]

Does it not work with kestrel server? I wasn't able to see install option. I'm sure i created a pwa project using dotnet CLI. (Dotnet new blazorwasm -p is the command i used. My os is kde neon. Browser was chrome. It did show install for twitter.com) Edit: Oh i noticed. It does show install but only on localhost:5000 but not on localhost:5001. Don't really know why. :/ Help?

[@IAmTimCorey]

Not sure why the install button isn't showing up for the https site. Maybe it has to do with the developer certificate not being valid? Maybe it is a permissions thing?

[@gunnypaulgiles]

The icon does not show on my window 11 screen using Visal studio 2-1 or 2-222

[@IAmTimCorey]

Sounds like you missed something. The icon will definitely show and it has nothing to do with the version of Visual Studio you use.

[@paragraut3504]

Hi Tim, Did you intentionally missed published serviceworker.js file ?

[@IAmTimCorey]

I am not sure what you mean. I talked about it in this video. I didn't go in depth on it because this is an intro video.

[@paragraut3504]

@@IAmTimCorey yes I was saying same thing :)

[@quosswimblik4489]

I want to see an open source gaming console OS that uses the technique for compatibility across many new arm architectures maybe even RISC V it has the advantage of running well on any adequate machine why should we have to rely on Java Bytecode or having to do much porting. now we have this method.

[@tomthelestaff-iamtimcorey7597]

Thanks for sharing your thoughts.

[@EgyptUnderGroundArmy]

Tim you really need a discord server!

[@IAmTimCorey]

Thanks for the suggestion.

[@aracon9721]

Is blazor production ready? I heard it’s still experimental....

[@JoeBonez]

Both Blazor server-side and client-side (WebAssembly) are in release now.

[@IAmTimCorey]

Yes. Blazor Server was production-ready in November, 2019. Blazor WebAssembly was made production-ready in May 2020.

[@airbus5717]

drawbacks : Needs More YT tutorials

[@IAmTimCorey]

Working on it.

[@gayathrinandakumar1642]

Sir, Can you teach develop. Pos and inventry mangement system in c#😊

[@IAmTimCorey]

Check out the TimCo Retail Manager series.

[@user-gy9je9vh9z]

The visual studio im using is so much different visually compared to the one he is using. makes things so much more difficult

[@IAmTimCorey]

Are you using Visual Studio for Mac?

[@user-gy9je9vh9z]

@@IAmTimCorey yes i am using VS for mac:( i cant see the ISS toolbar. solution?

[@ViewMyBits]

you didn't talk at all about how to get the 'app' onto iOS or android device....or how to get the windows app to say everyone in the office. Are you supposed to just publish like a typical blazor app, and then say on iOS when you go to the link it will have the install button same as you show in this video for windows?

[@IAmTimCorey]

Yep, you get the option to install it when you browse to the URL on whatever device you are on.

[@ViewMyBits]

@@IAmTimCorey ok great thx

[@Beliar275]

But what use does a Webapplication have - without the server side database which you cut off by not enabling aspnet core.... Also your whole video gives off the vibe of a (bad) advertizement

[@IAmTimCorey]

The ASP.NET Core hosting is simply an integrated API. I separated it out because I don't want people to think you have to use the integrated API. In fact, I almost never do. I use a separate API (separation of concerns). For instance, in the TimCo Retail Manager series, we already had an existing API in place that supported our WPF front-end. We added the Blazor WebAssembly front-end and pointed it at the same API (including for authentication and authorization). As for the "bad advertisement" vibe, this is a training video about the Blazor WebAssembly topic. Every training video could be seen as an advertisement video. I am showing you how to use a feature. How else would I do that?

[@munibhardwaj]

This is

[@IAmTimCorey]

I am glad you enjoyed it.

[@AdamsTaiwan]

Trying to get the resources to compile as a subfolder under wwwroot is a pain.

[@IAmTimCorey]

Why are you doing that? Can't you just publish to the sub-folder instead of wwwroot?

[@AdamsTaiwan]

@@IAmTimCorey I want to publish a single website project with multiple PWAs each contained in their own subfolder. I have this working with basic html, but have not figured out how to get this project to compile the resources to a subfolder under wwwroot.

[@hintsoftware]

Can we run blazor pwa only in mobile without any server ?

[@IAmTimCorey]

You need a server to host the PWA.

[@hintsoftware]

@@IAmTimCorey is there any way to direct install the full standalone blazor app in mobile only without server ?

[@冷面包]

Great video!!! I code a project with PWA. When I use localhost in my chrome. it works. But when I go with IpAdress:5001 PWA not work. And chrome said my url is not safe. It seems that my "certificate" is wrong. My project only work in local area network. So I don't want to get a new certificate. Is there anything I can do to make it work?

[@IAmTimCorey]

You could create a self-signed certificate and then put that certificate on each machine on the network as a trusted certificate so that they will all work properly.

[@冷面包]

@@IAmTimCorey Thanks a lot ^_^

[@LuigiZambetti]

So WPF is dead. Long life to PWA ;-)

[@michelvosje]

Xamarin forms will evolve into Maui which will be the leading Microsoft cross platform UI framework. Maui also uses xaml to declare the UI. And Maui also supports Blazor. So in a couple of years we can use Maui for every platform. Mobile, pwa, web and desktop.

[@AdamsTaiwan]

Check out the UNO Platform, they made the Windows 10 Calculator (XAML) run as a web app. I can save a link to the home screen on Android and run offline. Unfortunately it's too slow on my phone.

[@IAmTimCorey]

No, this won't kill other application types. This has its place. So does WPF.

[@waz_boolin6582]

Tim, love your videos, but sometimes you speak extremely slow and include details that are not important. Some of us aren't beginners anymore.

[@tomthelestaff-iamtimcorey7597]

Thanks for the feedback. Tim's passion is to help the beginner as well as more advanced developers. He is very careful to name his videos to allow viewers to know the level of the video. Obviously an 'Intro' video will be targeted to the beginner on that topic. You can easily speed up the video if its too slow. Thank you for watching Tim's videos and understanding as Tim tries to bring along those that are not as advanced as you are.

[@tarakshah2010]

Completely agree with you Dan, I feel the same. I then watched - ASP.NET Core Series: PWA's with Blazor kzbin.info/www/bejne/bGnThY2MataWnac from ms guy - much more practical info in 30 mins

[@eloylloveras]

little faster pls

[@IAmTimCorey]

You get to control that with the speed controls on all of my KZbin videos.

[@tenminutetokyo2643]

This stuff changes too fast.

[@IAmTimCorey]

This is an additional option. It isn't taking anything away.

[@mariusbechtold3698]

Thank you Tim!! Do you know how to turn a Blazor Server-Side aplication into a pwa (without offline support)? I found this solution: stackoverflow.com/questions/64387591/is-there-any-way-to-make-pwa-with-blazor-server-side But it is not working for me :(

[@IAmTimCorey]

There isn't really a reason to make Blazor Server a PWA. The purpose of a PWA is to allow offline access. Blazor cannot operate without being online. The two are practically mutually exclusive.

[@mariusbechtold3698]

@@IAmTimCorey Thanks for your reply! I would like that the user can install it on the phone like in client-side. It would be easier to access the app and it also would look nicer without the search tab of the Browser :). I have problems with debugging on client-side, thats why I want to use Server-Side. Do you know how I could achieve this?

[@StijnHommes]

Please stop encouraging people to go along with this spam! A web application is a WEB APPLICATION. If you want to make something on desktop or mobile, you do not need a web application. If you're too lazy to build a separate program, this is not the right career choice. We don't need PWAs. Someone finally needs to grow a conscience and give users a way to remove the ability to install PWAs completely. That means removing the install button from the address bar in Chrome and other browsers, removing the option to install PWAs from the menu and a ban on PWAs in the app store for both iOS and Android. PWAs are a security risk and I hope people get burned so bad that they get banned if no one offers the option for people to do so voluntarily.

[@IAmTimCorey]

I wish you would share your real feelings. 😄 As for your opinion, I disagree with you (obviously). The reason why, though, is because I think you are misinformed on a few things. First, they are no more of a security risk than any other application. In fact, they are LESS of a security risk than a desktop application. A desktop application often connects directly to secured resources. No matter how much you try to encrypt and secure those connections, that connection is vulnerable to the user. PWAs do not have this issue because they cannot connect directly to resources (databases, etc.) They have to operate through APIs, which are more securable than desktop applications. Second, this isn't about being lazy. It is about expanding the reach and filling a niche. A web app is easily deployed and updated (another benefit over desktop apps). Being able to have some offline access and being able to install it locally allows companies to take their web application to mobile and desktop platforms that they would not otherwise be able to get to easily. Tell me - what desktop app supports Mac, Linux, Windows, iOS, Android, Tizen, and more? None. Yet these companies can effectively reach all of those platforms with a single web app with practically no additional work. You think that's lazy? Nah. That's working smarter, not harder. For example, where I used to live, the local cable company technicians used a PWA on their phones to fill out work order tickets. The reason why is because they serviced rural areas and they were potentially servicing houses that did not have working Internet. So, they could still fill out the work order, get the customer signature, and more and then sync it when they were back in range of the towers. Now, if you don't want to use a PWA, you don't have to. There is nothing installed on your machine just because a site is a PWA. Yes, Chrome gives you that little indicator that you can install the web app as a PWA, but who cares? Do you protest showing the lock symbol for SSL even though most sites now run exclusively SSL? Nah, it is no big deal. The bottom line here is that there is a spectrum of solutions available to us because they are filling needs. Instead of being angry over that, I would recommend embracing that fact and learning about the various options and when they would be beneficial (and the answer isn't "never").

[@StijnHommes]

@@IAmTimCorey Hi Tim. The whole PWA thing seriously pisses me off and that anger means it's hard to have a serious discussion with a lot of developers who simply aren't open to my point of view at all. In their opinion, "PWAs are the future. Just deal with it". Your response felt much more balanced and sensible. This post is my response to some of the things you said to me 10 months ago, so you might want to read those previous posts again to refresh your memory if you want to respond to that. However, I didn't post all that to argue. I hope that this information helps you understand my feelings and thoughts and that it helps you point out something that I didn't know that I might feel is an actual advantage to using PWAs. If you don't feel like getting into a discussion or reading a long text, then please skip to the last paragraph of this comment. The security issue I mention is that multiple people encourage users to install PWAs straight from a website instead of an app store. This circumvents the checks app stores make to sure the app is actually safe and doing what it claims to do. Clearly, app stores make mistakes and they're not perfect, but cutting out this extra security check in favor of "easy installation" makes no sense. Even a cursory glance is better than no check at all. (You can't get any easier than hitting an install button.) If you do install from the store, you run into the problem that stores don't show any distinction between native apps and PWAs. This makes it hard to figure out where to go to uninstall a PWA on desktop. Also, I think it's hypocritical that some developers want to cut the stores out of the process, but don't see it as a problem to still use those same stores to distribute PWAs for now. Your cable company example is exactly the sort of thing that I find misleading. It wasn't created as a PWA because they needed offline access. You don't need a PWA to make something with offline access. It was created as a PWA because it was easier *for the developer* to deploy a PWA. People are trying to sell PWAs by saying things like "they're installable", "they have offline access" or "they support push notifications" when the real benefit is having the same code base for every version of the application. The benefits are for the developer and the person paying -- not for the actual end user. I believe choices in coding and design should be made with the end user in mind. When a developer chooses to make a PWA because it is easier for them to deploy, rather than consider what the end user might want to use, then I have no trouble calling them lazy. Especially when they have no regard for responsive design and knock something out with a mobile design without thinking about desktop users or vice versa. (It is important to make a distinction between websites, phone apps, PC apps, PC programs and web apps. They are different things and should be treated as such. If a user deploys a PWA, they're basically writing a fancy website that acts like an app, but that doesn't help if the user doesn't want to settle for something that acts like an app.) On top of that several supposed benefits aren't benefits at all. 1. Push notifications are annoying and mostly used to spam the user, they should be turned off by default and only enabled if the user wants them. 2. Updating automatically without user input. That too is a problem, because it doesn't allow users to stay on an old version of an application if the new one doesn't play nice with their system for some reason (interactions with their settings or other software) or if they simply don't like where the update is going. It takes away control from the user. (Here we have the same problem as Windows who tries to push updates on users. Security and feature updates should be split and only security updates should be mandatory.) 3. I've seen PWAs get installed and open up without asking users for any of the permissions built into real app and that is a massive mistake. Users need that control. And you are right, I don't have to use PWAs, but while it is easy to not us the button on my browser to install one, it is impossible to see whether an "app" on the Play Store is native or PWA if the store doesn't feel inclined to make it mandatory for developers/publishers to actually share that information with the users. I'm being tricked into using PWAs even when I'm actively trying to avoid them because I can't avoid a PWA if I'm not told if it's a PWA. (People say Twitter is a PWA, but they have both a native application that created before PWAs existed and a PWA in Twitter Lite. If they use PWAs to serve me the native app right now, they're misleading me -- the fact this is even a discussion point makes it clear how non-transparent the current situation is.) Yes, the PWA indicator on my browser annoys me, because the space both the icon and the menu entry for that take up, can be used for features or extensions I actually use instead. I actually support choice for the end user, but neither Android nor Windows or my browser actually support choice to the right degree. I can't get rid of rounded corners on Android 12 (or the rounded corners/bad start menu in Windows 11 if I'm ever forced to "upgrade") or one of those new ridiculous color schemes that made my shut down button turn grey instead of red without the other two buttons changing. I'm okay with other people using PWAs if they so choose as long as I get the option to fully opt-out without any leftover buttons or the risk of installing one by mistake and if the existence of PWAs stops negatively affecting the time people dedicate to making real native applications so there's actually something left for me to download. If am ever going to get convinced to use PWAs voluntarily (before I'm forced to do so and seriously pissed about it) I am going to have to find out the advantage to doing so *for the end user*. Also, while we're at it, what is the point of service workers loading without user consent and staying open for well over 6 months after the initial loading of a website? What is the point of a service worker if you have no intention of using the PWA that is attached to the site? I've had my PC internet connection fail multiple times this month and none of the times it showed any cached results to me. (I can still remember the days in which it took a website several minutes to load, so improving the load time by several milliseconds doesn't cut it as an advantage.)

[@fredypulido4358]

Similar to Silverlight lol

[@IAmTimCorey]

Not even close. Silverlight used a browser plugin to operate. PWAs use an industry-standard mechanism to operate that all major browsers support natively. PWAs are not Microsoft-specific.

[@AdamsTaiwan]

Check out the Uno Platform, it's closer to Silverlight. You can use the Uno's Windows 10 Calculator on Android offline.