What is Asp.net core blazor

In this article, we will learn about what is Asp.net core blazor and advantages and disadvantages and the basic structure of the application

Introduction:

Blazor was released back in September 2019. NET Core 3(Blazor WebAssembly), Blazor application is single page application like angular framework, Blazor Applications will work without using the Jquery and javascript we will implant the Single Page applications with the help of the c# Language

Blazor is a new web UI framework using c#, Razor, and HTML with web Assembly (w3c standards). this application is interacting with c# code, not jquery or javascript

Web Assembly is run low-level bytes code in client-side(browser) with the w3s standards .this standards are run server-side languages like c++,c#…in client-side(Browser) directly instead of javascript

Asp.net core provides a web framework Blazor to build Single page Application using C# language with WebAssembly standards in client site

Advantages of Asp.net core blazor

• Blazor applications will provide native performance, efficient, and portable
• we will use existing third-party rich packages, tools, Nuggets.
• Developers are familiar with easy to write c# code, maintenance, debugging.
• Blazor pages structure are easily understandable

Disadvantages of Asp.net core blazor

• without javascript because of in javascript we have a lot of libraries are available
• maintenance the application like we need more configuration for this applications

The basic structure of Asp.net core blazor application

In Blazor Application view page are can be splitted into 3 parts

• NameSpace(Directive Section)
• Razor Html Section(Dom(Ui Render at Client Side))
• CodeBlock(Using C#)(Function Section)

Directive Section: this section in blazor component is used to configure the routers, import external class libraries, dependency injection…seethe given below structure

.Rought=>@Page
.Id=>@Injection
.Import Class Library=>@Using

Razor Html Section: in this section, we will implement the client-side UI using blazor Tags, Other UI components with the combination of the C# Code this UI will finally render at the client-side.

Function Section: in this section, we will implement the Action functions (event methods), local variables, properties, this function are useful two-way binding also.

Recommended article:

Setup Blazor project in visual studio 2019

add the Blazor component page add the following given snippet code try to run your project

@page "/Component"
@using MyfirstBlazorApp.Data
@using Newtonsoft.Json
<h3> test componenetComponent</h3>
 
 
@if (lst == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>userId</th>
                <th>id</th>
                <th>title</th>
                <th>completed</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var forecast in lst)
            {
                <tr>
                    <td>@forecast.userId</td>
                    <td>@forecast.id</td>
                    <td>@forecast.title</td>
                    <td>@forecast.completed</td>
                </tr>
            }
        </tbody>
    </table>
}
<button class="btn-primary" @onclick="clickincrease">click</button>
 
 
@code {
    private List<Customerdata> lst;
    dynamic ResultStr;
 
    string reqUrl => $"https://jsonplaceholder.typicode.com/todos/";
 
    async Task clickincrease()
    {
        try
        {
            HttpClient client = new HttpClient();
            var response = await client.GetAsync(reqUrl);
            if (response.IsSuccessStatusCode)
            {
                ResultStr = response.Content.ReadAsStringAsync().Result;
                lst = JsonConvert.DeserializeObject<List<Customerdata>>(ResultStr);
                Console.WriteLine(lst);
 
            }
            else
                ResultStr = response.ReasonPhrase;
        }
        catch (Exception ex)
        {
            ResultStr = ex.ToString();
        }
    }
}

• Author
• Recent Posts

DuttaluruVijayakumar

hello ! my name is Duttaluru Vijay.i am working in Microsoft .net technologies since 2016.
I like to share my work experience, research, and knowledge through my blog.
I love developing the applications in Microsoft technologies including asp.net mvc,c#.net, windfarms, SQL server,entityfrawork,Ajax,Jquery,WEbApi,Asp.net core, SEO, WordPress, UI..more

Latest posts by DuttaluruVijayakumar (see all)

• dtoptions in angular10 datatable - April 29, 2021
• Angular 11 Crud Operation - April 14, 2021
• How to create dynamic form fields using jQuery - January 4, 2021