Use Blazor Component in MVC! 🔥How to use Blazor Component in Asp.Net Core MVC 🚀
You can use Blazor component in MVC or Blazor component in Asp.Net Core MVC web application to achieve the client-side code rendering.
Blazor is a client-side framework by Microsoft and blazor is mainly used to render the logic on client end side. On the other hand the Asp.Net Core MVC is a server-side web-based framework.
If you want to perform the client-Side logic in Asp.Net Core MVC application, then JavaScript was the only way but now you can use the Blazor components in Asp.Net Core MVC application to achieve the client-side logic calculation functionality.
In this video, we will explain the step by step process to use the Blazor components in asp.net core mvc application.
To achieve this functionality, we have to use following steps.
1. Use the Blazor Middleware in Program.cs
builder.Services.AddServerSideBlazor();
and map the SignalR hub using app.MapBlazorHub();
2. Use the blazor.server.js script file in _layout.cshtml (Your master page)
3. Create a _Imports.razor file to write all the namespaces that will be used by Razor Components.
Here is the list of all these namespaces.
@using System.Net.Http
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.JSInterop
Note: You can add/remove namespaces based on the need of your application.
4. Now you can create your Blazor components anywhere in the project and render them in the MVC pages (.cshtml) using Html.RenderComponentAsync method.
5. Whooho. It is done. Now you can run your MVC app and the blazor component would be working there.
We have covered following Blazor components examples with the Asp.Net Core MVC application in this video,
1. How to use the Counter Component from Blazor framework in Asp.Net Core MVC Web Application
2. How to fetch the data and display it in a table using Blazor component in Asp.Net Core MVC Web Application
3. How to submit the Form using Blazor component in Asp.Net Core MVC Web Application
Get ready to take your Asp.Net Core MVC web applications to the next level. Elevate your client-side logic and rendering game with Blazor components. 🎉
🚀 Watch now and empower your projects with the synergy of Asp.Net Core MVC and Blazor components!"
💰 SUPPORT Nitish Kaushik ☕💳 by donating for more quality content!
📱UPI: nitishkaushik@icici
💳 Paypal: https://www.paypal.com/paypalme/nitis...
☕ BuyMeACoffee: https://www.buymeacoffee.com/nitishka...
Your support is greatly appreciated! 🙌🎥📚
👋👋 Join telegram group: https://t.me/webgentle
Want to setup the development environment like me:
🧑💻 Laptop for developers: https://amzn.to/3YkvKCV
🐀 Silent Mouse: https://amzn.to/3OmOo8E
🎤 Noise cancellation Mic: https://rb.gy/9h89o
🌟 Screen recording software: https://techsmith.z6rjha.net/rQDNnQ
Code Repository: https://github.com/nitishwebgentle/as...
#blazor #aspnetcoremvc #dotnetcore
blazor components in asp.net mvc,Asp.Net Core MVC Web App with Blazor Components,blazor components example,asp.net core mvc with blazor,asp.net core mvc with blazor components,asp.net core mvc with blazor components tutorial,use blazor component in razor page,use blazor component in mvc,use blazor in mvc,use blazor component in cshtml,why use blazor,how to use blazor c#,razor pages vs blazor,asp.net core razor page,asp.net core razor components