In this series of posts we’ll be creating a Portfolio app from scratch. It’s going to be a web application. Now, which technology are we going to use? Well, there are a couple of options out there. As this is supposed to be a web app, the popular JavaScript frameworks like React, Angular or Vue may come to your mind. I’ve had some experience with each of them, but what if I wanted to use C# instead of JavaScript? Maybe you’re a C# developer who doesn’t want to learn a new language to make web applications. Well, it wasn’t easy, or even possible, some time ago, but now, we do have a web framework that you can use without (or almost without) JavaScript. It’s Blazor.
The framework is relatively new, if you compare it to the well-established JavaScript frameworks. I’ve been learning it for some time now. As I learn best by doing, I decided to create this My Portfolio project using Blazor. This also gives me the opportunity to share with you. You can follow along and tweak the code so that it suits your needs. But, as I just mentioned, I’m by no means an expert, I’m just learning. So, if you find any errors, please, let me know. I will be grateful for your feedback. Maybe you’re a more advanced learner than I am. Maybe you notice that something I do, even if it works, could be done in a better way. If so, also let me know.
At the end of the day maybe I’ll use all the posts to write an ebook, who knows.
Now, with that said, let’s have a closer look at the Blazor framework.
What Is Blazor?
Blazor is a web development framework. It was created by Microsoft and, which is not very surprising, it uses C#. You can use it to create interactive web applications. Blazor leverages the full .NET Core framework.
As you know, there are several other Microsoft web frameworks like ASP.NET MVC or Razor Pages out there, but with Blazor you can develop apps that run in your browser using C#. Also, unlike the aforementioned frameworks, Blazor is component-based, just like the JavaScript frameworks.
Blazor comes in two basic flavors, Blazor Server and Blazor WebAssembly. Blazor Server runs on the server using a Signal-R connection. Blazor WebAssembly runs in the client. Our app doesn’t require the server because all we need will be in the browser. We’re going to use Blazor WebAssembly in our project. We could create a fullstack application with a Web API project and a database to store the data that we need, but this project is so small, or rather the amount of data that needs to be stored is so small, that a simple file will do. We’re going to focus on the client-side and the data may come from any source you like, be it a database or a file like in our case.
Blazor WebAssembly apps are fast because they run locally in your browser. The application assemblies must be downloaded into the browser, though, and this initial download can take some time. But this is done only once.
What You Will Need
In order to write your code, you need an editor or IDE. In this series we’ll be using Visual Studio 2022, so make sure you have it on your computer and you’ll be good to go. The free Community version is just fine. In the next part of the series we’ll create the project, so stay tuned.