Getting Started with Blazor (3 Part Series)
A couple of weeks ago I wrote an article about building and deploying a Blazor app without touching a Windows machine and realized maybe I should take a step back and explain what Blazor is and why anyone would use it. It's still fairly new to most in the front end development world, but it's awesome and you should check it out.
Blazor is a framework from Microsoft that you can use to develop interactive client-side Web UIs with C#.
In their own words:
Pretty cool right? You can download it here and get started.
Remember the old way of developing web applications?
For the longest time, we built applications that ran solely on the server, using things like ASP.NET, PHP, etc and they generated an HTML file to be pushed to the browser.
There are some downsides to this pattern that we're all aware of:
- The server needs to be configured with software to run the web app. ASP.NET, PHP, etc. Backend processors or runtimes have to exist on the server.
- Most of the processing power is on the server.
- Page loads are annoying and slow.
So we found a new answer to it.
With the rise of the Single Page Applications we have a new pattern, with frameworks like Angular, React and Vue:
This is an excellent improvement on what we had before, which essentially manipulating HTML and tossing it back and forth. Now we have real applications running in the browser, and page loads are mostly a thing of the past.
But Blazor improves on that pattern further. There are two main ways to develop with it.
When you choose to build a Blazor Web Assembly application it looks like this:
Blazor uses Web Assembly which ships in all major browsers now. Web assembly is a binary instruction format that runs a virtual environment in the browser.
So what does that really mean?
- You can run it on any static file server (Nginx, ISS, Apache, S3, Heroku, etc)
- It runs JS as bytecode, and runs C# at near-native speeds.
- You can use C# to develop rich front-end applications.
- Web Assembly ships with all major browsers
- Reuse .NET components
- Use Microsoft tooling and debugging
This is great for low latency applications such as games. There's no need for communicating with a server if you don't need to. You can download the application and run it offline in a browser. This is great for games and other things you need to run lightning fast in a browser.
- The .NET Framework and other runtime files need to be downloaded (one time)
- You're restricted to the capabilities of the browser
- All secrets (credentials, API keys, etc) downloaded locally
- Not all .NET Framework components are compatible
So this may not be ideal for all applications. The good news is, there's another Blazor pattern we can use.
If you decide to build a Blazor Server application, it looks like this:
- You get the full power of the .NET Framework
- Everything rests on the server, small downloads
- Web Assembly is not required
- Your secrets are safe
- No offline applications
- Requires a server running .NET Core or a service
- Can be high latency with lots of network traffic
If you want powerful client-side applications that can run offline and served from a static server, choose Blazor Web Assembly. If you want the full power of .NET and want to run a model with thin clients, choose Blazor Server.
Blazor patterns open up big opportunities for development. Whether you want to build a powerful service with several thin clients, or some cool interactive game that runs in a browser, Blazor enables rich, interactive application potential.
Web Assembly is the way of the future. It enables near-native speeds in a browser, and uses a common interface. You will find Web Assembly on PCs, Phones, and tablets. If you have a bunch of C# developers on your team who don't do front end programming, they are now empowered to do it in the language they love.
It's pretty awesome, and I'm excited to see how Blazor progresses.
You can learn more about it from Microsoft's Blazor Site.
I recently wrote a tutorial about setting up and deploying Blazor apps without touching a Windows Machine
If you want to dig deep and learn Blazor, Pluralsight has some modern courses that will get you running quickly:
- Blazor - The Big Picture
- Blazor - Getting Started
- Blazor - Authentication and Authorization
- Creating Blazor Components
So try it out! Let me know what you think of Blazor and share your experiences in the comments!