How To Learn Blazor In 2023
How do I learn Blazor well in 2023? Is it something I should know? As we start into 2023, if you are a C# web developer or an aspiring C# web developer, Blazor is an important tool to learn. Not only is it a great option in the ASP.NET Core set of tools, but it is also a technology that Microsoft is investing heavily in.
In this video, I will start by answering some of the commonly asked questions about Blazor. Then, we will look at the different flavors of Blazor and when to use each. After that, I will outline the order to learn Blazor in, I will go over the steps to take when learning Blazor, I will cover the easiest way to become a Blazor developer, and finally, I will cover some tips and tricks to learning Blazor well.
Full Training Courses: IAmTimCorey.com
Mailing List: signup.iamtimcorey.com/
0:00 Intro
1:31 Blazor FAQs
12:38 Blazor Flavours
24:52 Learning Order
35:51 Learning Steps
40:26 The Easy Path
53:16 Tips & Tricks
I've been working on a Blazor project for the past 6 months and I have to say it is very impressive. I was able to meet most of the requirements without writing a single line of javascript code, with a few exceptions. It masivelly improved my productivity and cut down on the development time. I don't know if Blazor will become widely used or mainstream (in our world the best tech doesn't always win), but, in my opinion, it is well worth the time and effort to learn.
Two years ago in my company, there was a need to move from web forms to another framework. We did a lot of research and eventually ventured into Blazor. With our fingers crossed we started our project and migrations. God, it has been the best decision. We were able to create applications and migrate some of our stuff super fast.
It is a great tool.
Which library/framework did u used for frontend? I still not satisfied with Blazor controls in most of library/framework in the market
@cheeze adhy I am using mostly Radzen for projects within my company. However, for side projects I sometimes use mudblazor or I create my own
@@claudios.castillo9737 Ok, thanks
*Timestamps* 0:00 Intro 1:31 Blazor FAQs 12:38 Blazor Flavours 24:52 Learning Order 35:51 Learning Steps 40:26 The Easy Path 53:16 Tips & Tricks
Thank you!
I've been a developer for more than 25 years and have done my share of application building. I follow a lot of development courses just because I like learning new things. And there are some really good instructors out there on the internet. But I've never encountered one on your level. Especially the courses from start to finish, looking into all the complications, the overview and the considerations that come with developing a real application. Also, your explanations on why you do things a certain way as opposed to other possibilities. It is like pair programming with a very experienced colleague. There is so much to choose from on what to learn nowadays. This video offers a clear path for developers, whether they are on a beginner, intermediate or senior level. Thank you for sharing your knowledge.
Thank you for sharing! I’m glad it was so helpful.
Thanks for your reply @jooststolk5671, I'm a .NET programmer for 9 years and wondering if I should just start with the C# Mastercourse. I think doing the courses will pay itself back but it's a step for me. I've done everything on my own till now, all self study. What do you think?
@@IngmarCrone Hi Ingmar. I think it is definitely worth the time and the money. I'm a self-taught programmer also, and I find good instructional videos are way better than just books. And Tim is one of the best instructors out there.
@@jooststolk5671 Thank you.
Tim, this is an excellent well-organized and well articulated post. Thanks!
You are welcome.
great video Tim! Thx 4 sharing!
You are welcome.
Thanks for the lessons. It always is a an honour.
You are welcome.
This video is mentioned in the community standup. That’s great for visibility. Thanks for the great video Tim.
Great!
Thank you for this video. The way you presented the prerequisites was nice. It's making me rethink my decision to use Blazor for the frontend of the current project, because it is small, and i would have too much to learn. I jumped in the middle, as you called it, and realized that without a better foundation/understanding, designing will be a nightmare. When you explained it here, i was thinking, "yeah, that's me". I should probably just stick with VB as the front end because that is what i am familiar with. We do not really need an internal website as the UI, flexible as it may be.
Having a good understanding of what your app is built upon is really important for support down the road. I'm glad I could help.
After stumbling my way through my first production blazor app, I viewed this and found out where I made all my mistakes. This is great!
I am glad it was helpful.
This is the best tech video I've seen in a long time.
Thanks!
As always, great video.
Thank you.
I plan to share this with my team. Great way to think about it.
Thanks for sharing!
Oh what are the odds that learning Blazor is precisely what i set out to do during 2023? :D Thx for your work!
Excellent!
Thanks for these tips
You are welcome.
This is really really useful🔥🔥...Thank you
You are welcome.
Perfect, not that much project videos on youtube about blazor yet it seems very attractive.
Not a lot of coding examples on the web either. It is still a bit new and evolving fast.
Doing a quick count, I have over 25 videos about Blazor on this channel: www.youtube.com/@IAmTimCorey/search?query=blazor That doesn't include the full, free course here on KZhead that is about building a full Blazor application: kzhead.info/channel/PLLWMQd6PeGY0cZFMqx5ijmdaD87sJKCsU.html Plus I have a course on Blazor Server: www.iamtimcorey.com/salespage.html?course=in-bzs-01 I also cover it in my C# Mastercourse and my Exploring C#: Blazor WebAssembly course.
Microsoft finally got it right with Blazor, Blazor Hybrid and MAUI, FANTASTIC!!!!!
I'm glad you like them.
We have just decided to start new projects with Blazor for a good number of reasons and I am really looking forward to using it; especially the part where I don't have to write as much JS. We're switching to Tailwind too, so no writing CSS either.
Great! As for Tailwind, why not use Blazor since Bootstrap already does? You still don't need to write CSS if you don't want.
@@IAmTimCorey Sorry, I am new to this so I don't really understand what you mean by `why not use Blazor` in place of CSS. Does Balzor have it's own style system built in?
Bootstrap is a CSS styling system that is built into Blazor.
Tim miswrote,he meant to write why not use bootstrap since blazor already does..
so so so good material thanks a lot.
You are welcome.
Thank you for the thorough video explanation, as always. Your video has been instrumental in my understanding of Blazor technology. I was wondering if you might have the time to create a new video exploring MAUI in 2023, as I have seen mixed reviews and would appreciate your insights again.
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/
@@IAmTimCorey Thank you very for Tim! Will do so.
One thing that was missing about blazor hybrid which is much easier is you can use the blazor webview control in wpf and even windows forms. In that case, a person deploys it the same way they deploy a normal wpf app. Blazor hybrid can be a good option to even replace xaml. I've done xaml before but found that blazor is easier to create maintainable apps vs using xaml.
You can definitely do that, but I don't recommend doing it for every case. It is like any other tool - use it in moderation. If you find yourself using it everywhere, you are probably using it wrong.
@@IAmTimCorey The only cases currently I don't use blazor are the following: 1. When I just need a simple console app. 2. When I do web apis. For nearly everything else (especially when I need a gui), blazor seems to be the best unless I am missing something.
Extra tip is to have a project. And slowly making progress to make it real and learn bunch of stuff while you make it. It is good motivator.
It can be. Just be very careful that it is only a test project. Otherwise, you will release a really buggy application that looks like it works at first.
Thanks, very useful video
You are welcome.
Amazing video Tim, as always. One question, what do you think of C# CMSs like Umbraco that use Razor pages and so on, would you include that in your path if, for example, one wants to be a freelancer?
I wouldn't add them until after the things in the path currently, but learning them could be valuable.
@@IAmTimCorey thanks Tim, much appreciated
Been using blazor for 3-4 years now. Had several big and small, intranet or public and all of them have been a success! We been so damn fast with it and no major hiccups. Some usecases JS is better and if you have a JS team its obviously better but Blazor is a great damn alternative for a .NET team.
Thanks for sharing!
Thank you
You are welcome.
practice!
Definitely.
“Practice” I understand that’s the most important thing as you said, but I (and may be everyone) always struggle to find a zeal unless I am working on a real world project.
Well, that's something to push through. If you practice just what you are learning, you can practice quickly and repeatedly. If you try to "practice" on a real-world project, you can only practice once and it takes a long time to get there. Also, when you practice on a real project, if you make a mistake, it really affects you. Basically, you endanger the health of that real project by learning on it.
Buen Video, para inciar
You are welcome.
Hi Tim, awesome content but where can I find the suggestion-site tutorial on youtube?
It's a playlist: kzhead.info/channel/PLLWMQd6PeGY0cZFMqx5ijmdaD87sJKCsU.html
@@IAmTimCorey MVP, Greetings from Sweden!
So, I need advice. I have pretty much zero knowledge in anything to do with coding. But I've been given an opportunity from a relative to work for him and do work involved with Blazor Webassembly API calling and work with databases with SQL Server and UI and other such things. I don't even really know the terminology of things or what does what. And I know pretty much nothing about any of these. Do you have any suggestions or a good roadmap for me to follow of what to learn to be able to do this? I would greatly appreciate any help. Edit: I apologize. You give a better roadmap than I have seen before, not too long into the video. But if there is anything else you'd suggest from what I mentioned, I'd appreciate it.
Server side Blazor cannot be considered a serious product because, as far as I know, the browser connection is tied to the server from which it started. Back in the day, when we used session state, you had to turn on sticky sessions at the web farm to redirect the client back to the same server, or server pool, so the client's state was maintained. This didn't always work. Blazor WASM, on the other hand, seems like the go to technology since it does not have this restriction. And lately, Steve Sanderson (creator of Blazor) is talking about possibly having the two technologies working together seamlessly with there even being able to flip a switch called "auto" where Blazor itself would decide where to create the rendering. Blazor is going to dominate, and I am jumping in headfirst.
I disagree on Blazor Server not being a "serious product". First, being tied to your original server would not be an issue for the vast majority of websites, since most sites don't use more than one server. Second, the idea of sticky sessions isn't an equivalent because the user was coming back to the site. With Blazor Server, they are maintaining the connection, so even if you scale up the number of servers, it won't be a problem. No special consideration is needed. Third, you can offload the SignalR portion to a service, allowing for even more growth and flexibility. WASM does not have the always-on limitation, which is nice, but there are trade-offs. First, you have a larger initial payload. That can negatively impact SEO (not always a problem with web apps, but something to consider). Second, the performance of the site relies entirely on the user's machine. If they have a slow machine, the site will be slow. Third, you will need to create an API to support the site, since it cannot access the database directly. Finally, you will be giving away all of your front-end code. None of these are deal-killers, but they are considerations.
I have created the 2,3 project on blazor .But one thing i noticed that Hot reload should be improved.and framework should be lightweight.
Hot Reload is always being improved. However, it already works really well. It isn't designed to be always running while you develop. Remember that unlike JavaScript or PHP, C# is a compiled language, not a scripting language. That means significant changes cause too much disruption.
Hi Tim - Great video ! What's the difference between blazor server and razor ?
It depends on what you mean by "razor". Microsoft has unfortunately reused that term a bit. Razor Pages is a server-side web project. The ASP.NET Core web projects (including Blazor) use the Razor syntax to inject C# into the HTML. Blazor pages are actually Razor components (the extension is .razor).
Hi Tim, so .razor is the same as .cshtml?
Tim, and everyone else, I want to create a WASM library from existing C# code libraries (non-UI code, no external dependencies) that can then be used on either the server side or the client side. I don't mind paying for an online course if it will help me achieve this objective, would rather not subscribe to a Blazor course to find out it's not possible without overhauling ewriting the existing C# code. Thanks for any advice.
With Blazor, you can just build a class library that can be used by Blazor Server or Blazor WebAssembly.
can you elaborate how should I practice. should I just rewrite the same code again and again? until when? My goal is to become a Unity C# game/app dev. I've been learning from YT vids / udemy vids for 3 years now. made a couple small c# games... I want to practice my skill but dont know where to start.
I would apply for the job you want, and take the feedback you get to direct your next steps.
Blazor is great.
I'm glad you like it.
@@IAmTimCorey I've been doing a bit of it for the past year and totally like it
Not sure if my comment is going through. But I wanted to ask. I know blazor server is a SPA and uses signal R to not do a full page refresh. Does regular razor asp netcore (not blazor) able to utilize the same technology as far as SPA and no full page refresh? Or do you have to add that in such as signal r or something thanks
@IAmTimCorey
Razor Pages and MVC are both server-side languages. What you are looking for is client-side functionality. The way to do that would be to add something on top. It could be SignalR and JavaScript, it could be a JavaScript framework, or you could use a Blazor component.
Right. So basically razor,mvc are not spas by default and need to do full page refreshes. So now that we have blazor, would there be a point to have beginners learn mvc or razor when we have blazor. And i dont mean the theory of mvc, i meant the project type.
I amnot saure I totally agree with the author. Yes, C# is necessary to learn blazor. But why not dive into blazor after learning c#?
Blazor is built upon C#, ASP.NET Core, HTML, and CSS. You should understand how those work before trying to add Blazor. Otherwise you are skipping steps and making it harder on yourself.
Hi, are you planning on opening enrolment for monthly all access pass?
We just had enrollment open at the end of 2022 through the start of 2023. It will not open for a while yet.
Tim I don't use Blazor servor because my use cases require SPAS. You seem to prefer Blazor Server. If that's true, why?
13:12 and 15:18
I'm curious what you mean by "requires SPAS". I'm assuming you mean that you need a single page application (SPA). If so, I don't see how that could be a requirement. A SPA is way to meet requirements. It shouldn't be a requirement itself. If the requirement is to have responsive pages without postback, Blazor can do that. If you want the URL to not change when loading new pages, you could try to get Blazor to do that, but that's actually not a good thing and something you have to work hard to get SEO and other things to still work when doing so.
Im working in a dotnet shop yet our architects still think Blazor is bad compared to React so we haven't made the switch yet. Do you still think its worth investing into Blazor or will it always be in a land between Razorpages and JS SPA? I mean it will always have the issue of initial download size using WASM or latency issues using serverside.
If you already know React and have tooling built around it, I'm not sure there is a big reason to switch. However, if you are looking to get away from that complexity, Blazor is already a great alternative. The WASM download size is coming down quite a bit. As for Blazor Server, I'm not sure what you mean by "latency issues". The SignalR connection is literally a few bytes of data. Even on a slow connection, it shouldn't be a problem.
@@IAmTimCorey Latency as in your users needs to be close to the server since they need a socket connection. UX is really bad as its noticable laggy if you are on a bad line or far from the hosted server. Also every time you deploy your users gets thrown out and lose their state, server is a no-go for us. Dont get me wrong, I've enjoyed Blazor the times I've worked with it. But for me its not in yet in a state to replace JS SPA for publically production apps, specially not ecommerce as SEO would slaughter Blazor.
would u do a full project on blazor?
I already have: kzhead.info/channel/PLLWMQd6PeGY0cZFMqx5ijmdaD87sJKCsU.html
Great info! Ive been working with Blazor on a major commercial application for the company i work with. we've had endless gotchas and surprises. I was always reluctant to deep dive into C# because i have to juggle so many things, but i think its time. One quirk that seems to be always be in Blazor server apps is the response of form inputs. The lag between the client input and the server state seems to be enough that it can mess with form input. If the user types a little too fast , you see the input field missing characters. It also happens if you are trying to backspace text by holding down the backspace button, the text keeps coming back into the field. You can see this happen on your own suggestion site as well using the search field at the top. Do you have any suggestions/thoughts on dealing with this issue?
I'm curious as to what type of Internet connection you have. I don't have a terribly great one, but I don't see any of those issues. I can't replicate them at all unless I throttle my network down to Slow 3g. At that point, I can start to see some of those issues. There are some things you can do if you have issues like that such as watching less items on the page, not watching for specific changes to fields, or even fully changing how forms work so that they only make a change on submit. At the end of the day, though, if your Internet is that bad and it is causing a problem with users, you probably want to consider something like Blazor WebAssembly. That works locally and won't have those issues. It will create a larger initial download of the site, though, which is something to test out since connectivity is such an issue. If none of those things fix the issue, you may want to look at making just your data input pages (or the heavy input pages at least) Razor Pages instead. You can mix those into a Blazor Server project just fine. That way, you have the responsiveness you need for most of the site and the reliability on your input pages.
@IAmTimCorey about 30mbps down/up, 80ms to Comcast Miami. Its not terrible, and ive also tested on my office connection which is faster. It could be a latency issue. When im running the project locally it doesn't do it, only on production. I suspect your latency maybe sub 20ms? Thank you for the suggestions, ill definitely take them into consideration!
Yeah, latency would do it.
The part on employability hit me quite hard. It's as if this video was in my feed just so I could hear that part.
I am glad it was helpful.
I realy liked blazor. But problem is when i make a web site in blazor, the hosting companies give expensive prices in Turkey.
Have you tried Azure Web Apps?
@@IAmTimCorey no. I havent even investegated it yet
Tim, why Blazor? Why not React/Vue/Angular etc.?
Because this channel is dedicated to C# development, so if you are already a C# developer, the easiest choice for client-side web framework is Blazor. Angular/React/Vue are written in a different language, use different package management, and have their own learning curves. With Blazor, you get to use the same language (if you are already using C#), you get to use the same package management system, and the learning curve is minimal because it is mostly C#.
Your description of webassembly and hybrid sound exactly the same ..
The results are similar, in that they both can install on most devices. However, the difference is that Blazor WebAssembly "installs" as a progressive web application (PWA), which is basically just a fancy wrapper around a web application. A Blazor Hybrid application actually installs as a native application. It does not need to talk to the web in order to render or run. It has a lot more permissions than a web application has and it needs to go through the app store to be installed on mobile (which also means you can monetize it more easily).
@@IAmTimCorey so Blazor Web assembly (PWA) runs natively on the client but still pulls a server side rendered web page into it's view? How is that better than just rendering via your default browser? How does that allow for any offline functionality?
No, a PWA does not run natively. It runs a headless web browser to run it. It is essentially the same as a web application except for the look, the fact that you can have an icon on your phone’s Home Screen for it, and it can work offline using cached data.
And Blazor WebAssembly is client side rendered, not server-side.
Blazer is kind of like webforms++. If you’re familiar with webforms and the razor engine, learning Blazor is like: Step 1: Learn Blazor. Step 2: There’s a step 2?
It is pretty easy to get started, once you know C# and the other foundational things.
What is the point of Blazer if you know JavaScript?
It saves context switching, it reduces complexity, and it speeds up development. If you are already in C#, adding Blazor is a quick way to get a SPA up and running while reusing your existing tools and libraries. If you decide to use a JavaScript framework instead, you now need to add npm, new packages and libraries, a more complicated build system, and more. There is absolutely a place for JavaScript and the various frameworks inside of it. However, there is also a place for using Blazor.
Let’s say a “solopreneur” wants to use Blazor to create a custom web app that serves anywhere between 100-10,000 users. What do you feel would be the most reliable yet economical approach to HOSTING that, without getting utterly destroyed by monthly fees?
It depends on what you mean by 10,000 users. Is that concurrently? Unlikely, but if so that would change things. Personally, I host my Suggestion site ( suggestions.iamtimcorey.com ) on Azure. It costs me $73/month, but that's because I share that plan with multiple websites. I could get by with the $9/month plan if it was just the one site. My site has over 800 active users. It could handle 10 times that number easily. So, you could probably host your site anywhere that supports web sockets. I like to host on Azure because you can start really small and then scale up only when the need presents itself (and scaling up is easy).
@@IAmTimCorey appreciate that. Do you have any course that goes deeper on exactly which Azure components you’re using for your site, and whether user activity affects the monthly cost? I was thinking 1 strong web server plus MS SQL DB would cost more than that.
Only use Blazor Server if you know that there won't be many users accessing your site. Why? Because the code in all the functions is executed on the server. Using Webassembly moves this workload to the client, which often gives better performance and less work for your server.
I also prefer the architecture with Blazor Webassembly and a separate API.
That is incorrect. First, server-side languages are not new. In fact, the primary type of website is one that is powered by a server-side language. Wordpress runs off of PHP. 43% of all websites on the Internet are powered by Wordpress. If server-side languages were a problem, they wouldn't be the primary system powering the web. MVC and Razor Pages are also server-side. Now, with that being said, client-side applications can be better for your server because you are doing the page rendering on the client and not the server. However, you are still doing work on the server. Every call to get data goes through an API, which is a server-side system. Plus, every time someone loads your site, you are downloading the raw source code for the entire site to the client. In a LOT of cases, the cost of this plus the cost of the API adds up to as much or more than just running a server-side language.
If performance is the primary concern never use any server side technologies.
39:19
Currently I am learning blazor and I think it can replace task of Javascript I think. I am not sure about it but it can do the task of Javascript and I found it that it easy to learn if you know c# well than Javascript if you have the knowledge of c# you can learn it in a short time.
Blazor won't replace JavaScript entirely, but it does do a lot of the tasks that traditionally only JavaScript could do.
@IAmTimCorey yeah I am just starting to learn blazor, and I saw a lot of stuff that JavaScript can do on blazor. I ♥️ your videos!!!
Blazor server remenber me to PHP
Except PHP is only server-side. Blazor Server acts like a client-side project while being server-side. That's the benefit.
Considering the recent annoucement of Blazor United by Steve Sanderson (kzhead.info/sun/Z5yAj6d9foqQjYU/bejne.html) I would advise everyone to jump on the Blazor wagon because it is starting to look like a game changer. Tim it would be nice if you could make a video about the implications of Blazor United and it's features as demostrated in Steve's video... basically make a video about a video... :)
I've thought about it, but it is a little early to make a video about it. Right now, it is still a tech demo. It isn't guaranteed to be in .NET 8 and it isn't guaranteed to look or act the way it does in the demo. I love the tech and want to see it implemented, but I'm going to hold off on covering it so that I don't confuse users with something that might not become a reality.
The real question isn't "how", it's "why".
I can answer that too: Blazor is the majority of the future for C# web development. It can do things that other frameworks can't, you can develop your back-end in the same language as your front-end, and it is REALLY easy to build things quickly.
@@IAmTimCorey I said that halfway tongue in cheek. I can see it being convenient. I can also see the inevitable performance problems being acceptable for 'business software' and other use cases where you've got a captive audience and don't lose money/CTR for every 50ms you're slower. Out of curiosity, do you have any practical experience deploying on Linux? I'm seeing weird benchmarking results for Kestrel all over the place, a lot of them done by people who appear to have 0 clue, some that seem reasonable but underspecify the setup.
13:07 *[Time stamp for me, please ingore this comment]*
👍🏻
@@IAmTimCorey I asked for one thing Corey, how could you do this to me xd /sarcasm
lol, I make the rules! Glad you are getting value out of the video.
@@IAmTimCorey i am. your videos are great.
Why there is no "How to Learn Docker in 2023"?
Because that isn't really a multi-step process. Here is a course that will teach you Docker: www.iamtimcorey.com/courses/docker-from-start-to-finish/
We don't get to see your long luxurious hair in the video... oh wait.. that is the other guy... lol
I'm waiting for the real-time video AI to be better so I can digitally add glorious hair back to my head (just kidding - I enjoy being bald and could technically grow most of my hair back if I wanted).
Lowkey disappointed i thought this gonna be a guide lmao, but instead it's u teaching us how to 'learn' for 1 hour............
That's like saying "I'm disappointed the golf instructor focused on swinging the club". Knowing how to learn is really important to succeeding at learning. Also, this video does have a guide with which steps to take in which order to learn Blazor.
Blazor reminds me Silverlight....
Tim made a video about that. Can't link, but video id is uH3z0ja7qfE.
@zabustifu is correct, I did a video on this (linked below). Blazor is definitely nothing like Silverlight, even though it might feel like it has similarities. Silverlight was a proprietary system that relied on a browser plug-in and wide-ranging permissions. Blazor is an open-source system built on top of web standards. Here is the link to the full video: kzhead.info/sun/qKxsqpSimGmnmX0/bejne.html
Blazor is nothing like Silverlight, please dig a little deeper before posting misinformation!
@@conradtwonine9414 It's useful that he posted this 'misinformation' because it was subsequently corrected by Tim and now anyone else who made a similar assumption can see the correction and watch the video. The guy didn't even make a statement - he just made an observation.
aspiring C# web developer
Great!
Dotnet core ecosystem BLAZOR UNITED
The future looks bright.