How To Create a Blazor Component

In this video, we're going to learn how to create a Blazor component for a Blazor application. We create a template and write C# code to connect the component with the application.

If you are new to Blazor make sure you have watched the Blazor introduction video first. In this video, I'm going to focus on creating a Blazor component.

Creating a Blazor component is one of the first things we want to do when we create a Blazor application. As we learned in the Blazor introduction, Blazor applications consist of many Blazor components. A Blazor component represents a part of the user interface and can be reused in your application or even in multiple applications.

In this video, I use a Blazor Server application created using the standard application template of Visual Studio 2019. The code works with .NET Core 3.1.

If you have any questions, write it in the comments below and feel free to provide feedback, and if you have any video ideas, put it in the comments as well.

00:00 Introduction
00:36 How to create a Blazor component
01:19 Create your first Blazor component
02:05 Implement your first Blazor component
05:00 Use your component in your Blazor application
05:45 Demo of your Blazor component
06:20 Conclusion

🔥 C#/.NET Bootcamp: The Fundamentals & more (Code FRIENDS10 for 10% OFF)*

📌 .NET Developer Roadmap

📌 YouTube Playlists:

📌 Blazor Introduction:

📌 Blazor Github:

📌 Blazor WebAssembly template:

📌 Bootstrap:

✅ SUBSCRIBE FOR MORE VIDEOS

🚀 CONNECT & SUPPORT

CREDITS

* Affiliate Link: I earn a small commission at no additional cost

[ClaudioBernasconi]

What do you want to learn about Blazor next? How do you like the style of this video?

[widowdev]

Good video Claudio. I do have some questions for you though.. I have a windows applications that was developed for data acquisition that allows my clients to view live data from specific sensors on what usually are things like thermacuples connected to a motor etc. I ideally want to move to the browser. So, before discovering blazor (which seems to be exactly what I need (little UI's dedicated to certain things)) I had made a webAPI in C# .net that communicates with our sqlserver database. All of the functions work (insert, update, delete for all tables) but I am having a hard time wrapping my head around how to connect a blazor component to display data that would be returned to the component through an HTTP GET request in the components razor page.. I am just not sure where to look for this information. Is there an easy way to make api calls within a blazor component?

[drakewallaloss]

Please Show a Perferct Demo or Tutorial on RenderFragment and Cascading Parameters