![Create Blazor app in .NET Core Blazor in .NET Core](https://www.sharepointcafe.net/wp-content/uploads/2021/04/pic-1024x558.jpg)
What is Blazor in .NET Core?
Advantages of using Blazor for client-side development
- Create and develop a rich interactive UI in .Net Core application
- Write server-side and client-side code using C# only
- Support of modern hosting platforms such as Docker.
- Share app logic across server and client.
- Benefits of .Net’s reliability and security
- Easy for C# developers
Let’s get some more information about Blazor
Why Blazor?
Below are the reasons for which a developer can start writing code in Blazor.
- Create rich interactive web application using C# code.
- Write server-side and client-side logic in .NET
- Integrate with modern hosting platforms like Docker.
- Create rich web application for multiple platforms like Window, Linux and MacOs.
How to create a Blazor Component in .NET Core?
- Go to Tools ->Extension and Updates..
- From Left pane select Online.
- Then in search box type Blazor.
@page "/MyRazor"
So, to access MyRazor page, I can use below URL –
http://localhost:port/MyRazor
Now let’s do some more code in Razor
Below is the Dialog.razor file and this component can be nested within an another component.In below code, ChildComponent and Title uses the component in UI as well.
<div>
<h1>@Title</h1>
@ChildContent
<button @onclick="ClickHere">Yes</button>
</div>
@code {
[Parameter]
public string Title { get; set; }
[Parameter]
public RenderFragment ChildContent { get; set; }
private void ClickHere()
{
Console.WriteLine("Welcome to Blazor UI Component. Button Clicked");
}
}
The thing to note here is that ClickHere() method is written in C# which triggered on button click event.Now, we will use Dialog.razor in Index.razor file using <Dialog> tag.
@page "/"
<h1>Hello, world!</h1>
Welcome to Blazor.
<Dialog Title="Blazor">
Do you want to Continue?
</Dialog>
So, when you access index.razor, dialog component will be rendered. Another interesting thing about the razor, when you write a message in Console.WriteLine in a razor component, that message is displayed in browser’s developer tools. Yes, I too was surprised when I saw output on the first time in developer tools.
Blazor Web Assembly
Blazor web assembly uses open web standards without any plugins and supports all modern browser.
Watch this video to learn how to create a basic Blazor App using .Net CLI
Summary:
Blazor is new framework to develop interactive client-side web UI in ASP.Net Core. Blazor comes with ASP.Net Core 3.0. Blazor allows us to write client-side code in C# language. This means, you do not need Java Script to write client-side code, it can be done from C#.
It is still new and its use is also new for today’s developer. What will be its scope in the future, it will be known over time. Hopefully, this information about Blazor will prove useful to you. Please like and share this URL on social media.
Dot Net Core Blogs – Dot Net Core Blog
You may read this - What is the difference between Blazor Server and Blazor WebAssembly?