Wardrobe Inventory

Introduction

Welcome to Blazor!! The current .NET solution for web-development that Microsoft created to compete with React (Meta) and Angular (Google). You might be thinking, why learn Blazor where most jobs want React/Angular? And that’s a good point. In fact I wouldn’t start with Blazor in the front-end before knowing one of the big JS frameworks. But once you have one of those covered, having Blazor in your resume might give you the edge you need to land that dream-job. And make no mistake! Even though there are LESS Blazor jobs out there, they definitely exist. And not many people are fighting for them.

Blazor lets you build user interfaces without using Javascript. Both client and server code is written in C#, allowing you to share code and libraries. It’s just a joy to work with. Up to 2022, there were two types of Blazor projects: Blazor Web Assembly, and Blazor Server. But recently Microsoft creates Blazor Hybrid, which allows you to use Blazor components to build the UI for apps with WPF and most importantly, MAUI. Wow!! Let’s get started??

Requirements

  • This is an application where you should store and retrieve wardrobe data..
  • You should use a Blazor Webassembly project.
  • You can choose whatever database solution you want: Sqlite, SQL server or whatever you're comfortable with.
  • Since we'll only have basic CRUD operations, you should use Entity Framework.
  • Your database should have a single table. The objective is to focus on learning Blazor, so we should avoid the complexities of relational data.
  • Users of your app need to be able to upload pictures of wardrobe items.
  • You CAN'T USE Javascript interop. The objective is to stay away from JS, even though it's still possible to use it.

Resources

Since this is your first Blazor project, I recommend you first complete the Blazor Todo App from Microsoft Learn. It’s a very simple project that will give you a basic understanding of how Blazor works. And don’t forget to reach out on our Discord community if you have questions!

What you'll learn

  • You only need a single project. Contrary to using Angular and React, you don't need to create two separate projects, since the front-end end and the back-end will be covered by Blazor.
  • In this project, you're not allowed to use Javascript Interop. But a nice challenge after the completion of the project would be to integrate it to your project: Javascript Interop Explained, Javascript Interop Youtube Tutorial
Log in to mark this article as read and save your progress.
An unhandled error has occurred. Reload 🗙