Blazor Hero – Clean Architecture Template Quick Start Guide
In this article, we will learn about getting started with Blazor Hero – A Clean Architecture Template built for Blazor WebAssembly using MudBlazor Components. This project will make your Blazor Learning Process much easier than you anticipate. Blazor Hero is meant to be an Enterprise Level Boilerplate, which comes free of cost, completely open sourced. So, If you do like this Boilerplate, do consider supporting me with a coffee maybe? 😉 Let’s get started.
Blazor Hero v2.2 is now available with lots of awesome features!
Here is a complete video overview of BlazorHero! Do Like and Subscribe to my Youtube Channel!
Important Links
Here are a few of the quick links that will help you with the process of getting used to Blazor Hero.
- Youtube Overview Video about Blazor Hero
- Github Repository – Fork, Star and Contribute!
- NuGet Package Page
- Demo Video on my Facebook page (An Older Version)
Prerequisites
- Make sure you are running on the latest .NET 5 SDK (SDK 5.0 and above only). Get the latest one here.
- Visual Studio 2019 (v16.8+) ( You can check out my Installation Guide of Visual Studio 2019 Community which is completely Free to use.) Make sure that ASP.NET and web development workload is installed.
- Install the latest DOTNET & EF CLI Tools by using this command – dotnet tool install –-global dotnet-ef
- I recommend that you read Onion Architecture In ASP.NET Core With CQRS – Detailed article to understand this implementation much better. This project is just an Advanced Version of the mentioned article.
- Once you clear with Onion Architecture Implementation, you will also need to be aware of CQRS MediatR Pattern. I have written a step-by-step guide on how to implement CQRS using MediatR Library. Read it here.
Getting Started With Blazor Hero – Clean Architecture Template
Blazor Hero is available as a NuGet Package for you to install. Fire up Command Prompt and run the following command.
dotnet new --install BlazorHero.CleanArchitecture
This will install the entire Solution Template to your machine so that you can generate Awesome Blazor WebAssembly projects using this template and a line of CLI Command. Let’s see a walkthrough. Note that these steps are also demonstrated in the Video that I have mentioned in the Important Links Section on this Guide.
Important: If you were already using BlazorHero v1.x, run this command to upgrade to v2.2
dotnet new --install BlazorHero.CleanArchitecture::2.2.0
Once the package is installed, it will be available globally on your machine. Let’s open up the command prompt again and change the directory to your actual working directory. Mine is D:\Repositories\
cd /d D:\Repositories\
Now that we are at the Working Directory, let’s use a CLI command that would generate a Blazor Hero templated Solution with your own custom Namespace!
dotnet new BlazorHero.CleanArchitecture -n WarehouseManger
You can see the success message which states your templated project has been created. Let’s check out the Repositories\WarehouseManager Folder.
PS, you might see a slightly different folder structure from BlazorHero v2.2 and above.
This Solution follows an Onion Architecture for better maintainability and scalability of the associated project. You can see that all the Layers of the Solutions are created with your custom namespace. Cool, yeah? Let’s open up the solution file. Wait for Visual Studio to finish installing all the required packages. You can see the Folder Structure of the Project below.
Make sure that you set the YourNamespace.Server project as the startup project.
By default, the localdb instance of your SQLServer is used as the Data Source with your namespace as the DB Name. Feel free to change the connection strings which are located at the appsettings.json and appsettings.Development.json in the Server Project.
"ConnectionStrings": {
"DefaultConnection": "Data Source=(localdb)\\mssqllocaldb;Initial Catalog=WarehouseManger;Integrated Security=True;MultipleActiveResultSets=True"
},
Once you have fixed up your connection string, the next step is to create the database and update it. For this, open up the package manager console and set the default project as the YouNamespace.Insfrastructure project. Make sure that the YourNamespace.Server is set as the startup project as well. This is because all the packages and DBContexts related to building / migrating EFCore SQL Server databases are installed in the Infrastructure project.
With that done, run the following command.
update-database
Note that I have already added the latest migrations of the database. You need not run the add-migration command again.
Important: With the release of v2.0 and above, there are lots of schema changes to the application entity definition. Make sure that you are not using the database of Blazor Hero v1.x. Make sure you have a fresh database.
Once the database migration is done, you will be able to see the newly created database in the server explorer. Default Data like Roles and Users will be seeded into the database when you run the application for the first time.
Note that this screenshot is just a demonstration. You will actually have much more tables than this.
With the database migrations done, we are good to go. I personally recommend using the Kestrel Server instead of the IIS Server Variant. To switch to Kestrel, do the following.
Once you run the application with Kestrel, you can see the below terminal popup. Here you can note that some default data is seeded while the application is run for the first time. This includes default roles, users, and permissions.
Let’s have a quick overview/guide of getting along with Blazor Hero.
Docker Support!
Not interested in Docker?
By default, Docker project build is disabled for BlazorHero. You can re-enable them by right-clicking the Solution in Visual Studio and enabling ‘docker-compose’ Build option in the Configuration Properties section!
Here are the steps:
- Install Docker on Windows via
https://docs.docker.com/docker-for-windows/install/ - Open up Powershell on Windows and run the following
cd c:\dotnet dev-certs https -ep $env:USERPROFILE\.aspnet\https\aspnetapp.pfx -p securePassword123dotnet dev-certs https --trust- Note – Make sure that you use the same password that has been configured in the
docker-compose.ymlfile. By default,securePassword123is configured.
- 5005 & 5006 are the ports set up to run blazorHero on Docker, so make sure that these ports are free. You could also change the ports in the docker-compose.yml and Server\Dockerfile files.
- Now navigate back to the root of the BlazorHero Project on your local machine and run the following via terminal – docker-compose -f ‘docker-compose.yml’ up –build
- This will start pulling MSSQL Server Image from Docker Hub if you don’t already have this image. It’s around 500+ Mbs of download.
- Once that is done, dotnet SDKs and runtimes are downloaded, if not present already. That’s almost 200+ more Mbs of download.
- PS If you find any issues while Docker installs the NuGet packages, it is most likely that your SSL certificates are not installed properly. Apart from that I also added the –disable-parallel in the Server\Dockerfileto ensure network issues don’t pop up. You can remove this option to speed up the build process.
- That’s almost everything. Once the containers are available, migrations are updated in the MSSQL DB, default data is seeded.
- Browse to https://localhost:5005/ to use your version of BlazorHero!
Login Page
Here is the login page that gave you the initial taste of Blazor Hero and MudBlazor Components! To get started quickly, I have added two buttons to fill in the credentials of the default Administrator and Basic Users.
Database Seeding
While the application starts for the first time, default data is seeded to the database.
Roles
- Administrator – Has All the permissions to access each and every resource.
- Basic
Users
Here are the default users registered to the system on startup. The below list follows the following format – email / password / role
- mukesh@blazorhero.com / 123Pa$$word! / admin
- john@blazorhero.com / 123Pa$$word! / basic
Overall UI
Once you are logged in, you will get to see the below screen.
- Navigation Menu – Top
- App Drawer – Sidebar
- Body
Blazor Hero is completely built with MudBlazor Component Library. A huge shoutout to the entire team! 😀 Mudblazor actually makes your apps look stunning by making no compromises on the features as well.
Mailing
Currently, the mailing service is enabled for sending User Registration, Reset Password Emails. I have implemented SMTP Services for sending out emails. Feel free to make separate implementations for other mail services like SendGrid. You would just have to add the implementation in the Infrastructure.Shared Project and something like a SendGridMailService under the services folder. Make sure to implement it from the IMailService interface.
By default, all the mails are configured to bounce to an Ethereal mailbox that is meant for test purposes only. You can find the ethereal configuration under the appsettings.json. This means that whoever be the recipient of the mail, it actually ends up in ethereal mailbox only. Pretty cool to have this while testing.
"MailConfiguration": {
"From": "info@codewithmukesh.com",
"Host": "smtp.ethereal.email",
"Port": 587,
"UserName": "adaline.pfannerstill49@ethereal.email",
"Password": "vAKmWQB8CyPUBg8rBQ",
"DisplayName": "Mukesh Murugan"
},
Note that you can generate your own ethereal mailbox credentials by visiting here.
User Registration
If you are logged in as an Administrator, you get permissions to add new users to the system. Let’s add one!
Navigate to /identity/users by clicking on Users in the sidebar. Here you get to see all the registered users.
From here, click on the Register New User button.
IMPORTANT – Make sure that the username you enter is 6 characters or longer.
Click Register after filling in the details. You can notice the two checkboxes.
- Activate User – This system has additional security that even after registration, the user should be approved by the administrator to access the resource. Unless the user is active, he/she will be locked out of the system. To skip this, check the Activate User box.
- Auto-Confirm Email – To register a new account with the system, the user has to confirm his/her email. BlazorHero sends an activation mail to the registered Email Id. In our case, by default, the registration mail goes to the ethereal mailbox. Again, to skip the part where the email has to confirmed, just check the Auto-Confirm Email checkbox.
Once the user is registered, an Email gets scheduled as a Background Job via Hangfire which then sends it to the Ethereal Mailbox.
Apart from this, users can also anonymously register into the application by navigating to the /register page. This is a feature added with version 2.0.
Email Confirmation
Here is the email confirmation that got delivered to Ethereal Mailbox.
On clicking the supplied link, the email id of the user gets confirmed with the system. As simple as that.
User Activation
Now that the new user’s mail id is confirmed, it’s time to activate his account. Note that only administrators can do this. Click on View Profile under the User’s Dropdown.
Here, check the Active checkbox and click Save Changes. That’s it! This is how an Administrator can activate/deactivate users.
Serilog
Here is the default provided configuration for Serilog. As of now, the logs are written to text files locally to the application. To add in Database logging with Serilog in ASP.NET Core, refer to this article.
"Serilog": {
"MinimumLevel": {
"Default": "Information",
"Override": {
"Microsoft": "Error",
"Microsoft.Hosting.Lifetime": "Information",
"System": "Information",
"Hangfire": "Warning"
}
},
"WriteTo": [
{
"Name": "Console",
"Args": {
"outputTemplate": "{Timestamp} [{Level}] {Message}{NewLine:1}"
}
},
{
"Name": "File",
"Args": {
"path": "Logs\\log.txt",
"rollingInterval": "Day"
}
}
],
"Enrich": [
"FromLogContext",
"WithMachineName",
"WithProcessId",
"WithThreadId"
],
"Properties": {
"Application": "WarehouseManger.Server"
}
}
Feel free to support the project by buying me a couple of coffees maybe? 😉
Swagger
Every API Developer’s favourite tool, Swagger! Navigate to /swagger to access Swagger.
I have not yet added Swagger Documentation for the API. If anyone is willing to help me out in this part, do make the required contribution to the project’s repository.
CRUD Operations
Let’s see some CRUD now.
Open up the Brands Page. Here you get to see a Table for listing out all the Registered brands. Since it’s empty, let’s add a new one.
Once a couple of brands are entered. Let’s add in products. Navigate to the Product Page. Here is a more advanced ADD Modal with Select Componet and an Image component. Add in some dummy data and click Save.
There you go! Similarly, you can Edit and Delete Products/Brands by clicking on the Actions dropdown against each of the entities. Pretty Self Explanatory, yeah?
Dashboard
Here is a cool-looking dashboard with an intention to give quick insights into what’s actually happening within the application. From here you get to see the total count of products, brands, registered users, and roles.
Down the roadmap, I will be implementing SignalR to the dashboard so that any new entries/deletions of entities will be notified in real-time. Probably in BlazorHero 2.0. Feel free to contribute this to code if you like 😉
UPDATE
The above-mentioned feature is implemented in Blazor Hero v2.0. The below recording demonstrates the same. Thanks to SignalR!
Realtime Chat with SignalR and Identity
Documentation for this section will added soon. This is an already available feature.
Audit Trails
Documentation for this section will added soon. This is an already available feature.
Document Store
Documentation for this section will added soon. This is an already available feature.
Export to Excel
Documentation for this section will added soon. This is an already available feature.
Roles & Permissions
Roles & Permissions are the vital part of Application Security. In this project, let’s see how these features are implemented.
The Administrator by default gets to add, modify and delete Roles. Navigate to Roles.
Note that you will not be able to delete the Standard Roles (Administrator & Basic) from the system, even with Administrator privileges.
Let’s create a new Manager Role!
I have designed the system so that Permissions are attached to User Roles, rather than Users or anything static. This gives a lot of flexibility and less complex code as well. You can Manage the Permissions of Roles by clicking the associated Actions Dropdown and selecting the Manage Permissions option.
Here you get to check the required permissions for the selected User Role. As simple as that 😉
Forgot/Reset Password
(Documentation Coming Soon)
In the Login Page, you get an option to reset the password if you forgot it by any change. Here is the flow of the Password Reset Process.
User clicks the Forgot Password Button on the Login Page. Gets redirected to the below page, where the user has to enter in his/her email address.
On Submission, an email with a link to reset the user password gets sent to the email id of the registered user. In our case, it will drop into the Ethereal Mailbox. Here is how the email would look like.
Upon Link Click, the user would have to re-enter the actual email id and set a new password for his/her account. This will immediately update the user’s password.
Password Reset Succeeded!
Profile Picture
A standard feature of the project – To upload User Profile Picture. The uploaded images will be stored as Data URLs in the database. I am planning to shift to a more file-system-based image upload mode. Any thoughts on this?
Furthermore, you can also update profile details as well as change the user password in the Security Tab of the Accounts Page.
Dark Mode
Localization
Blazor Hero, as of now supports French, English, Khmer, German and Spanish. Although few of the translations are missing, it’s growing on a regular basis, Thanks to the contributors! Feel free to add in some missing translations as well!
Hangfire
To access the Hangfire dashboard, navigate to /jobs. As of now, this dashboard does not need permissions. It will be added in the upcoming versions of the project.
Contribution Needed
- Need someone to add in the API Documentation for Swagger.
- Need someone to implement localization throughout every Razor Component of the solution under the WASM(Client) Project. You can take the Pages/Authentication/Login.razor as the point of reference. It is as simple as adding
@inject Microsoft.Extensions.Localization.IStringLocalizer<Login> localizerto every page, changing the texts to@localizer["Text Here"]and finally adding resx files to the Resources Folder as per the folder structure. - Need few contributors to add in various language translations as per the implemented Location. I got time to only add a few translations for French as of now.
- Need a UI contributor to look at the UX/UI of the entire project
- Need someone to buildup a cool Material Logo for BlazorHero (BH) 😀 Do contact me on LinkedIn (https://www.linkedin.com/in/iammukeshm/).
- And finally, Stars from everyone! 😀
Version History
Version 2.2.0– NuGet | Github Release – 27 June 2021
- UI Improvements
- Docker Support
- Better Permissions Management
- Code Cleanups
- RTL Support
- Minor Bug Fixes
- Better Project Structure
Version 2.1.0 – NuGet | Github Release – 22 May 2021
- minor bug fixes
- UI improvements
- validation messages fixed
- fluent validation support
- mud table fixes
Version 2.0.0 – NuGet | Github Release – 13 April 2021
- Play Notification Tone when a new Chat Message is received.
- Auto-Scroll to the Last Message when a new Chat Message is received.
- Registration Page for Unauthorized User (Currently only Admins can register new users)
- Realtime Notifications – Dashboard Updates Realtime
- Logout Users / Regenerate Token from Multiple Client Browsers when Permission Changes
- FIX: Token Issue Fixed from v1.0.1
- User Images in Chat Component
- Chat – Integrated with Identity to support Private Chats (Will require re-migrating the DB schemas)
- Notifications System using SignalR
- Document Management
- Export to Excel
- Audit Trails
Version 1.0.1 – NuGet | Github Release – 19 March 2021
- Added Forgot / Reset Password
- HTTP Interceptor
- Code Cleanup
- Refresh Tokens
- Auto-Logout if Refresh Tokens Fail
Version 1.0.0 – NuGet | Github Release – 19 March 2021
- Initial Release
- Mudblazor Component Library
- .NET 5.0+
- Blazor Web-Assembly: ASP.NET Core Hosted
- Onion Architecture
- Persistent Dark Mode (Local Storage)
- Service-Based Approach
- MediatR at API Level
- AutoMapper
- API Versioning
- JWT Authentication
- Serilog – Server-Side Only*
- Complete User Management
- Profile Picture
- Clean Fluid UI
- CRUD Functionalities
- Custom Error Pages
- Localization
- Role Management
- User-Role Management
- Swagger
- Middlewares
- Favicon
- Default User & Role Seeding
- Dynamic Service Registration (WASM)
- Auto DB Migrations
- Paginated API Responses
- Polly – Retry Pattern for HttpClient
- Shared Email Service
- Hangfire Implementation
- Custom API Response for 500,401,403
- Specification Pattern
- Permission-Based UI Rendering
Did you Love Blazor Hero?
Consider supporting me by buying me a coffee.
Thank you for visiting. You can buy me a coffee by clicking the button below. Cheers!
Hi Mukesh,
this is what I was waiting for
jcm
Hi, Any initial feedback regarding this project? Hope it helped 😉
Regards
Hello Mukess
very nice work , thanks ,
we still waiting for RTL layout to support arabic culture also.
thanks .
Hi Mukesh,
Hope you are good,
I am using this architeture before 1 year really its very nice work but need to implement third party authentication like microsoft azure so could you please give the suggesion for this actually I am trying to add this feature but unable to add this yet.
please assist.
Thanks
you can refer to fullstackhero, azure authentication is implemented there.
I was going to use ABP.io but this is nice and straight forward for my project needs.
Awesome work!
Thanks a lot! Any suggestions?
Regards
Hi Mukesh
I am wanting to use Blazorhero in a SAAS application. Users need to be able to register ON THEIR OWN, not through the administrator.
Should there not be a menu item at top right allowing this as is common in .net core apps ?
I would be grateful if you would shed some light on this?
Many thanks
Luke
Hi, It is not meant to be accessible for the public. I will add this to the to-do list anyways. It will be done in the next release.
Regards
Hi!
I am trying to follow your steps but update-database command does not work and shows this error:
PM> update-database
Build started…
Build succeeded.
The specified deps.json [C:\Users\saqib.khan.SDD\source\repos\BlazorHero.CleanArchitecture1\BlazorHero.CleanArchitecture1\BlazorHero.CleanArchitecture1\Client\bin\Debug\net5.0\BlazorHero.CleanArchitecture1.Client.deps.json] does not exist
Please help.
Hi, Not really very sure with issue. However, could you try to uninstall the ef cli tools and install the latest versions again? Also, clean up the solution and build again. Here is something that should help – https://stackoverflow.com/questions/42757322/scaffolding-error-deps-json-doesnt-exist
Regards.
Saqib Khan ha
I’ll answer you. If you generate your project using the command line everything is fine, if instead you use the VisualStudio wizard obviously some references are lost and the migrations no longer work correctly
Saqib Khan ha
I’ll answer you. If you generate your project using the command line everything is fine, if instead you use the VisualStudio wizard obviously some references are lost and the migrations no longer work correctly
Just set server application as startup not client then update-database on infrastructure project
I hope that help
You put a lot of work into this, nice job; very high quality. I know this is brand new off the presses and you’re still finishing things up, but maybe someday a GraphQL version of this would be great, maybe with Hot Chocolate. If your thinking of your next project that is and needed an idea. In the meantime, I’ll check this out. Thanks again.
Hi Mukesh,
I would like to ask to project structure. Im not sure if i understand it correctly.Client project is dependent on Web project and its not designed to run it separetly like Blazor webassembly or Blazor server?
Or if you can write few words about this section i would be very happy.
Thank you very much.
Hi Radim, This is a very usual WebAssembly implementation with ASP.NET Core Hosting Model. The project dependencies are what you get normally out of the box with Blazor WASM. You will have to set the Server as the startup project to fire up the entire application.
Regards.
Awesome piece of knowledge, specially for someone new to dotnet – like me.
For any others who want to run this code on mac, You have to change few things.
– install docker + mssql in it ( standard docker installer for mac )
than from terminal:
docker run -e ‘ACCEPT_EULA=Y’ -e ‘MSSQL_SA_PASSWORD=YourSTRONG!Passw0rd’ -p 1401:1433 -d microsoft/mssql-server-linux:2017-latest
– generate new sln like in this article and change like follow:
in files appsettings.Development.json appsettings.json change db configure string into: “Data Source=192.168.0.110,1401;Initial Catalog=WarehouseDb;Persist Security Info=True;User ID=SA;Password=YourSTRONG!Passw0rd;Pooling=False”
– restore solution nuget packages, set run to Warehouse.server
– go to terminal into: /WarehouseManager.Insfrastructure & launch:
dotnet tool install -g dotnet-ef
dotnet-ef database update -s ../WarehouseManager/Server
than you can successfuly run this project
for testing and education purpose you may consider changing mssql into sqlite – much simpler to work with ‘core’ dotnet in mac / linux / mobile
there is a lot of useful packages you use – according to your other excellent article (onion..) writing separate article how to embed every used tool maybe good idea ; yes – i know this is a lot of work
once again – great article, every small project should have scalable architecture from the begining
Hi Luke , Thanks for the feedback. Do you have any suggestions or feedback regarding the project.
Thanks for the instructions regarding Mac as well. Will post this to the blog shortly.
Regards
Hi
I am trying to switch to SQLite. Is it possible. Also, I am forced to use Core 5 as the template does not support 6. Any workaround this?
Thank you in advance.
I think you can upgrade to .NET 6 . 5 to 6 doesn’t have much breaking changes.
Hi Mukesh
I now tried the fullstackhero and after 3 hours i am totally lost. Is there any possibility of creating a video like with this app. I really can see the benifit but can’t even get the api working
Regards
Willie
Hi, can i know where you are stuck at? Did you refer to the docs at fullstackhero.net?
Reply to below post:
I changed to SQLite. In the docs it does not explain but in the code it does support. Got a problem on the Hangfire. Tried SQlite but gave an error. Then i switched Hangfire back to Sql but still got errors.
Personally i would like to disable Hangfire but could not see where to disable that.
Its alao the first time I ran a dot net app outside if the Visual Studio environment. Also don’t know how i would debug the api.
With help of the youtube video i manage to create a fullblown app with nearly no experience. Then core 6 cane out and i was hoping to create the same app on core 6.
Ok, started over and used the defaults set to MSSQL. All worked. The switched the database to SQLite. That worked to. Then I changed hangfire. If I run it i get this error
11:07:10 FTL] Unhandled exception
System.ArgumentException: Could not find connection string with name ‘Data Source=fullStackHeroDb.db’ in application config file
at Hangfire.SQLite.SQLiteStorage.GetConnectionString(String nameOrConnectionString)
at Hangfire.SQLite.SQLiteStorage..ctor(String nameOrConnectionString, SQLiteStorageOptions options)
at Hangfire.SQLite.SQLiteStorageExtensions.UseSQLiteStorage(IGlobalConfiguration configuration, String nameOrConnectionString, SQLiteStorageOptions options)
at FSH.WebApi.Infrastructure.BackgroundJobs.Startup.UseDatabase(IGlobalConfiguration hangfireConfig, String dbProvider, String connectionString, IConfigura
Not sure how to fix this.
Have you changed the StorageProider in hangfire.json config as well? If that’s done, maybe try to give an absolute path for the DB and check, maybe like C:\mydb.db or something?
Yes, updated Hangfire.json. Tried that too. Even tried setting it to C:\Test\fullStackHeroDb.db.
The only way I could get around this was to start with MSSQL and then it would create the SQL Database and then switch the app to SqLite and leave Hangfire.json to sql.
At least for now I can work with it.
Hi Mukesh
Ok, got the API working perfectly and now moved on to the Blazor WebAssembly. There are no documents on how one would go to add an item in the category section. It also works totally different from BlazorHero.
Any suggestions or when there will be some documentation as to how to proceed?
Mukesh Murugan you did an excellent solution.
Thank you very much for your time and efforts.
Hi, Thanks a lot 😀 Any feedback or suggestions regarding the project?
Regards
Hello!
Thanks for the excellent work! Could you maybe explain a bit more about all the different projects you use ini the solution and the reasoning behind it?
Thanks!
Hi Mike, Thanks for the feedback. As far as the Project structuring is concerned, I am using an Onion/Hexagonal Architecture with Separation Of Concerns. This is the architectural design I use in most of the production applications as well. As mentioned in the Important Links section of this article, please go through this guide to understand the reasons behind each and every projects – https://codewithmukesh.com/blog/onion-architecture-in-aspnet-core/
Regards
Hello!
Thanks, I did read through this article but the BlazorHero template seems to be an extension of this approach with additional bits. Could you maybe explain the separation of concern for the different projects in summary? e.g. Infrastructure vs InfrastructureShared vs Shared and also which project should reference them?
Thanks for your help!
Hi, Sure. I will update the documentation and try to include the architectural decisions as well. Will update you on the same.
Regards
This looks really great. I’ll have a play with it in the next week or so and give some feedback.
Thanks heaps!
Sandy
Hi Mukesh,
congratulations, great job, a perfect starting point for admin type projects, but I would ask you for a system to generate the Blazor Client project with PWA support (like –pwa option)
Thanks!
Hi Mukesh,
Really, it is great article. However, I am unable to populate all the tables in the database, it is showing only 10 tables related to users. You did not mentioned how to add migration just added update-database.
Can you please advise.
Hi, Thanks!
Since all the required migrations are already added to the application, I have not mentioned them. However, it’s the same method as you would do for any other application.
Here is what I would recommend, if you want to re-add the migrations.
1. Delete the migrations folder from the BlazorHero.CleanArchitecture.Infrastructure project.
2. run `drop-database` command to cleanup the existing database.
3. run `add-migration initial` command
4. and finally, `update-database`. This should create almost 11 new tables on to the database.
Every time you add a custom entity in code, add it to the ApplicationDbContext and re-run steps 3-4.
Regards
Hi Mukesh,
Good work. Thanks for saving lot time and digging debugging in inplementation of SignalR, MailService, Roles ,permissions and ect..
which are prerequisite now for any we apps.
I Need some help in adding new Modals to the project which will add some meaning to my project.
. If possible could you please provide the sample code or instructions to add new entities to the project.
I am really exited and looking forward for the next version of blazor hero 3.0.
Regards,
Hi there, one suggestion is to use in routes.Endpoints instead of passing parameter by parameter(currently with page size and page number) , pass the object itself.
IT´s better if we would like to filter with more properties and we do the filter query in server side instead of client side.
Possible suggestion for Products -> GetAll:
–ProductsEndpoint
public static string GetAllPaged(GetAllPagedProductsRequest request)
{
var url = $”api/v1/products?{GetQueryString(request)}”;
return url;
}
public static string GetQueryString(object obj)
{
var properties = from p in obj.GetType().GetProperties()
where p.GetValue(obj, null) != null
select p.Name + “=” + HttpUtility.UrlEncode(p.GetValue(obj, null).ToString());
return String.Join(“&”, properties.ToArray());
}
The “GetQueryString” would be a extension .
Products Controller:
public async Task GetAll([FromQuery] GetAllPagedProductsRequest request)
{
var products = await _mediator.Send(new GetAllProductsQuery(request.PageNumber, request.PageSize, request.SearchString));
return Ok(products);
}
Just a seggestion.Thanks, Excelent Work
Hi there, do you plan on implement repository cache?
Thanks
Hi Mukesh,
I’m really impressed with your projects,
Just I want to mention that after refreshing the page the hubconnection take time to connect and affect the UI, normally it runs in the background but when and if I hit refresh again an exception is raised on MainLayout.razor.cs in the line 45 => await hubConnection.StartAsync(); and it reloads normally again
I’m using BalzorHero V2.0, is there any thing I should do to fix it or it is by design?
Thank you and keep up the good work
Hi. You’ve created a great app. What’s the easiest/best way to publish this to the web?
Hi, Thanks. Azure would be great. However you can try out other hosting providers as well, like https://codewithmukesh.com/refer/smarteraspnet
Hello, when I publish V2 on smarteraspnet I get a HTTP Error 500.30.
I had no problem with V1
From dotnet new BlazorHero.CleanArchitecture -n without modification
Migration is well done: tables are created.
log20210424.txt si created but empty
Hi, is there any log on the browser console?
Failed to load resource: the server responded with a status of 500 (Internal Server Error) /favicon.ico:1
Failed to load resource: the server responded with a status of 500 (Internal Server Error) xxxxx-001-site1.itempurl.com/:1
I had a problem with my ConnectionString not modified in appsettings.json when publishing. After resolution of this problem, the log file gives me the reason :
System.IO.DirectoryNotFoundException: h:\root\home\xxxxx-001\www\site1\Files\
The directory is well included
But this directory does not exists when creating the solution from your template. The directory is only created when when add a profile picture.
I’m also getting this error. The error under Debug is to be
An exception of type ‘Microsoft.Data.SqlClient.SqlException’ occurred in System.Private.CoreLib.dll but was not handled in user code
Invalid object name ‘Identity.Roles’.
I’m not sure why it’s having issues with this, as I have run update-database the the tables all exist..
Also, the roles are not getting seeded, so the error must be happening when it’s trying to seed this table.
I would suggest to drop the entire database. Delete all the migrations files under the Infrastructure project. Regenerate the migrations using the add-migrations command and try to run the update-database command. It should work fine.
hi did you resolve this issue?
hi Mukesh,
I am trying to learn mudblazor.
I am looking for front end of this project.
I want to look at razor file / components .
in which folder i can find these files.
thanks
Hi,
The frontend of the BlazorHero application is found at the Client Project.
Here are the Razor Pages associated – https://github.com/blazorhero/CleanArchitecture/tree/master/BlazorHero.CleanArchitecture/Client/Pages
Regards
Even deploying on another dev’s subscription, fresh, same result. Any clues why I’m getting the “500.30 In-Process Startup Failure” error? I can run locally connecting to Azure db, but can’t run the same app on Azure.
According to MS
Common failure conditions:
– The app is misconfigured due to targeting a version of the ASP.NET Core shared framework that isn’t present. Check which versions of the ASP.NET Core shared framework are installed on the target machine.
– Using Azure Key Vault, lack of permissions to the Key Vault. Check the access policies in the targeted Key Vault to ensure that the correct permissions are granted.
Hi Mukesh,
It’s awesome projects, very cool.
I have problem with mail service when register new user, the mail not send to the inbox, do you have sample code for implementation IMailService?
Hi, the email feature is tested and is working as expected. Currently, we are using Ethereal mailbox for test purposes. The characteristics of the Ethereal is quite different. It doesn’t deliver the mail to the mailId of the registered user, but to the mailbox of the ethereal account itself. You can find the ethereal test credentials in the appsettings of the server project. Do let me know if this helped.
Thanks
It’s work. thanks very much..
Thanks for this.
We have a Telerik subscription. I’m wondering if it would be easier to learn/use MudBlazor or just re-engineer this for Telerik. What do you think?
You are welcome.
It depends on your preference. MudBlazor is not a very tough library to learn. Also, the MudBlazor team is quite active in the development.
Although, since the dependency to MudBlazor is just at the Client Project, you could easily switch to Telerik by Creating a similar project and moving over the controls as required.
If you are already comfortable with Telerik, re-doing the client project would be easier. If you want to explore Mudblazor, then it’s up to you 😀
Regards
Very true. Thanks for the response. I’m learning MudBlazor, see how it goes.
If you want syncfusion, method from here work correctly:
https://www.syncfusion.com/succinctly-free-ebooks/blazor-webassembly-succinctly/add-syncfusion
Hi. Awesome project!
I think prerendering support will be great for UX. It will make it snappier.
Thanks!
(I tried it myself, and it entails creating server-side versions of service dependencies like IDocumentManager, IProductManager, etc. These server-side versions will directly call mediator, like what controller does, instead of going through HTTP.)
Hi Mukesh
I would like to know how to implement blazor hero in a micro services architecture, that is, everything to the backend is in services and blazor hero would only be the frontend, what should I have to know ?, please help.
Would love to have a tutorial on deploying this to Azure .
Do we need to create an API Management service for the API, or just deploy?
did you deployed this to Azure.
Hi Mukesh,
How can I replace BH logo on loading screen?
Hi, Here is the SVG Path of the Current BlazorHero Logo – https://github.com/blazorhero/CleanArchitecture/blob/master/BlazorHero.CleanArchitecture/Client/CustomIcons.cs
You can switch it here, and it will be reflected throughout the application. Regards
Dear Mukesh,
I replaced the SVG file but the previous logo still appears on animated LOADING SCREEN???
Hello Mukesh,
can you tell me, if there is a way to disable the laoding screen when opening the web application?
Or can you tell me, how i can find out, why it takes over 10 seconds in loading screen, when i start the application for the first time?
Thanks!
The browser downloads the dlls on the first startup, which is around 30Mb.This load time will be improved in the future versions of blazor as well as blazorHero.
Did you find the way to modify the blue loading screen?
Hello and good day,
First Thanks for your excellent work Mukesh. it’s a great work and I’m going to use it in my currently starting project. but i have a small problem. in my domain layer(Sandbox.Domain.Entities as you see), i need to have a relation to the ApplicationUser model that exists in application layer(Sandbox.Application.Models.Identity). but the problem is the domain should not have any dependency to the libraries. for example i need to have something like this:
namespace Sandbox.Domain.Entities
{
public class Car : AuditableEntity
{
public virtual ApplicationUser Owner { get; set; }
public string Title { get; set; }
}
}
The error says “the type or namespace name ‘ApplicationUser’ could not be found”
Hi, in this case, you can have 2 approaches.
1. Make use of ICurrentUserService interface that can return you the UserId from Server Project. You can use this id further to query additional details that you may require, by ofcourse creating or extending the existing User Service.
2. Yes, ideally you should not have direct access to the IdentityUser Entity. One way is create a new Model similar to IdentityUser in the application / domain Layer and map the original entity to this newly created entity.
Personally, Approach 1 would be my choice.
Thanks
Hi, Mukesh
Thank you very much you are doing a great Job.
please am having a challenge creating a page like brand.razor in the Client side, the challenge is while am trying to add a page it only bring .cshtml but not .razor or may be am missing something , please help thanks.
I prefer approach 1 too. but without adding navigation properties in domain models, how do you achieve this? in my example, i need a relation between Car and ApplicationUser. The ‘Car’ is in ‘Domain’ layer and ‘ApplicationUser’ is in ‘Application’ layer.
However, without a navigation property set, if I return with Entity Framework a list of Cars, I cannot get the owner first and last names in the same query. I have to call the service N times to get each user in order to populate the car entity with the owner. Is there a… third approach?
Thanks for the great project. I especially like the user/role/permissions management built in to the project.
I’m trying to add a custom method to one repository so that I can get the object by name instead of by Id. In my ICountryRepository I added Task GetByNameAsync( string name ) and in the CountryRepository I added the implementation. I then added a GetByName query and response and modified my controller. However, I get an error in my GetByName query on the line await _unitOfWork.Repository().GetByNameAsync(query.Name). The error is ‘IRepositoryAsync’ does not contain a definition for ‘GetByNameAsync’. I’m sure I’m doing something wrong. How do I correctly add the custom method to the repository and have it accessible by the UnitOfWork?
Hello mukesh
thanks for your great concepts
when I execute ‘update-database’, it is successfully done but don’t create database , do you know about this issue?
Yes I’m getting the same issue, nothing gets added to the database.
???
Mehrdad / Mukesh,
I figured out the database problem. It isn’t finding the db specified in the appsettings.json file so it creates a new database somewhere else. I’m not that skilled in SQL Server so I can’t coment ass to what is wrong. I can tell you I discovered the missing databases via Visual Studio, SQL Server Object Explorer
Mukesh, really nice job on this, very powerful.
Craig
Hi Mukesh,
Excellent Work! I Thank you!
I just checked on my mobile and some pages seems to not be too much responsive.
i.e.:
– buttons to create / edit / delete
– Audit Trails grid
is that something that you plan to fix in a future release?
Hi,
Can you tell steps about azure hosting of blazor app
It is very good work. It helps me to learn Blazor and Clean architecture. It works for all browsers except Internet exploer. In IE it shows SCRIPT1002: SCRIPT1002: Syntax error. How can I solve the problem?
Thank you
I see you implemented a generic repository pattern with unit of work, but it’s not clear to me how to implement if I need get data from a repository like the following example TheRepository.Where(c=>c.CreatedBy==’Francesc’), is it possible ?
Thank you!
Jut to be clear I mean in the query handlers. I need to show grid data just for the user who created the data.
Thank you!
Hi again Mukesh. would you please help me how i can read a list of model that has a navigation propery? in class GetAllConnectionsQueryHandler , the handle method is like this:
var connectionList = await _unitOfWork.Repository().GetAllAsync();
var mappedConnections = _mapper.Map<List>(connectionList);
Connection class has a property name ‘Host’. for example:
public class Connection : AuditableEntity
{
public int Port { get; set; }
public int HostId { get; set; }
public Host Host { get; set; }
}
but when is try to read connection list, although the HostId has value but the Host property is empty. how can i force the query to load the entire Host properties?
Maybe in your XyzFilterSpecifiction use
Includes.Add(a => a.Host);
Thanks Mukesh for this awesome work. I am still exploring it but it is a great starting point.
A suggestion: I see that the action popup on the products and brands goes behind the table window. Not sure if I explain myself. It would not be an issue when the table has more than 3 items already.
Thanks for the feedback. Noted. I Will fix it shortly
Regards
Hello Mr.
All Thanks.
If you can add a RTL Language like Arabic I will definitely add the translation for it in all razor pages
RTL is already on my list. Will implement it shortly.
Regards.
Hello,
How can I set RTL as default direction?
Hi Mukesh, How to Publish this application .please help
i came across with this error: An error occurred while accessing the Microsoft.Extensions.Hosting services. Continuing without the application service provider. Error: Could not parse the JSON file.
hi Mukesh,
nice work, is fluent validation supported for blazor client?
Thanks, yes Fluent Validation is added.
Hi Mukesh
Thanks for great effort!
Looking at the data retrieval side of things you appear to grab content in page size blocks from the webservice and then sort that page back on the client rather than sorting on the server and then paging back the data. Is there a reason for this? There is also a dependency of EF core at the client?
What would be a great addition is to handle Guid PK types rather than just int. Different clients use different types but I must admit to always using GUID’s for many years now. I have swapped out the int for Guid, changed some of the default checking and it works OK but a bit of a kludge.
Keep up the good work.
cheers
Tim
Hi did you end up implementing server-side sorting?
Hi Mukesh,
Thank you for the template. Nice work.
I think it would be good to have a tutorial/write up upon how to create further entities and how you have wired up the components. This is kind of a big solution now, so a documentation would be better.
Thanks and Regards.
Manvendra
Hey. I have problem with update database. When type udpate-database on nuget cosole recive error:
Unable to create an object of type ‘BlazorHeroContext’. For the different patterns supported at design time, see https://go.microsoft.com/fwlink/?linkid=851728
Do you have idea how to fix it ?
may be old, but I had the same issue and the fix was adding the options c,p,s
dotnet ef database update -c BlazorHeroContext -p .\WarehouseManager.Infrastructure\WarehouseManager.Infrastructure.csproj -s .\WarehouseManager\Server\WarehouseManager.Server.csproj
may be old, but I had the same issue and the fix was adding the options c,p,s
dotnet ef database update -c BlazorHeroContext -p .\WarehouseManager.Infrastructure\WarehouseManager.Infrastructure.csproj -s .\WarehouseManager\Server\WarehouseManager.Server.csproj
Hi Mukesh & fellow readers,
This project is awesome and such a huge help for a starter like me. Can anyone please advise if there an easy way to connect to a postgresql database rather than SqlServer?
I’ve downloaded nuget packages:
Npgsql
Npgsql.EntityFrameworkCore.PostgreSQL
Npgsql.EntityFrameworkCore.PostgreSQL.Design
I’ve played around with the connection strings and put a bit of time into researching postgresql/entityframework. I attempted changing .UseSqlServerStorage in the startup to .UseNpgSql… (found on another thread)
No matter what I try, when I run:
PM> update-database
I can’t seem to load the database. I can’t remember the exact fault/log item and I’ve cleaned the solution. When I load the defaults, it works fine.
If I want to connect to a postrgesql database, will i need to change anything other than the 2x connection strings in the appsettings.json and appsettings.Development.json?
I’m not sure if I had the nuget packages installed to the right folders of the solution. My next attempt will be to ensure they are in the same locations as the nuget packages:
Microsoft.EntityFrameworkCore
Microsoft.EntityFrameworkCore.Design
Microsoft.EntityFrameworkCore.SqlServer
Is anyone on this thread able to point me in the right direction please?
Appreciate all your efforts Mukesh
Thanks
I will try to add PostgreSQL support in the upcoming release. Will post a tutorial to switch to PostgreSQL too.
Regards.
That would be great!
Thank you!
Hi Mukesh,
Once again thanks for all your efforts I am learning so much making my way through your blog.
With regards to BlazorHero I’ve been playing around trying to get Postgresql working some more and am still getting stuck.
Do you think I should be trying to get Postgresql working before running the update-database command or migrating to it after?
Have you had any progress with supporting Postgresql?
Do you know if there is there a simple way to switch to Postgresql with any the projects in your blog?
How many coffee’s would it take to expedite this feature in BlazorHero 😉
Thanks
Ben.
Hi Ben, Please check Gert’s comment on this article. He was able to set up PostgreSQL without an issue. I am currently working on fluentpos. Once that is done, I will be back to blazorhero.
Regards.
Hi Mukesh & Gert,
Thank you both for your help. I got it working, this is awesome!
Apologies, I totally missed the comment from Gert. It was 2:00am and had gone cross eyed from looking at the screen for too long.
Looking forward to seeing what you come up with next.
Cheers.
Hello everyone,
Thank you Mukesh for the awesome template it saves a lot of time from doing everything from scratch
I thought I would share to help others… I have just set it up using Postgres and it is working without a problem.
1. You would need two additional nuget packages Hangfire.PostgreSql and Npgsql.EntityFrameworkCore.PostgreSQL.
2. In startup.cs change x.UseSqlServerStorage => x.UsePostgreSqlStorage.
3. In ServiceCollectionExtensions change it to .UseNpgsql by the AddDatabase method.
Lastly dont forget to delete the migrations because it was generated for SQL. Once deleted add-migration and then update-database and you should be good to go.
Have a good one.
Hi Mukesh,
congratulations, great job. Do you have any plans to support the Multi-Tenancy?
Thanks!
Hi,
great job. Sorry if that’s a stupid question, blazor noob here, but can I also use this for blazor server apps?
This is intended to run as a Blazor WASM App. However, I am also finding ways to make it switchable to Server Mode. Probably somewhere down the road 🙂
Regards
Hi,
Thanks a lot for your excellent work!
Is it possible to use Mysql instead of Sql Server?
Yes, it’s totally possible.
You can follow the instructions from here – https://github.com/blazorhero/CleanArchitecture/issues/75
Thanks for your excellent post, when I do what it says for mysql it gives me errors in the migration, could you review it?
And thanks a lot for the feedback 🙂
Hi Mukesh,
What’s the difference between Infrastructure.Shared and Shared folders?
How can I know put my shared class in a proper shared folder?
Thank you
I would also like to know this.
Looks great!
I’m trying it now. Just started.
If this can help someone, early in the text, in the Prerequisites section:
dotnet tool install –global dotnet-ef –add-source https://api.nuget.org/v3/index.json
see https://github.com/dotnet/EntityFramework.Docs/issues/2044 for details.
Hi, what is the correct way to check that a User is in a Role (e.g. from a Razor page)?
I can see it’s done here in RoleService but I can’t seem to inject this into my page.
await _userManager.IsInRoleAsync(user, existingRole.Name)
Thanks.
Hey, love this, but in SwaggerBasicAuthMiddleware context.User.Identity.IsAuthenticated is always null even when logged in… Any ideas? Thanks
Helllo
Can you also demo how to make a crud step by step using blazor hero?
Thanks
I need the same. I tried to do something similar to “Brand” but I can’t finish, I got to the migrations but I have an error
Mukesh,
This, and basically everything else in your site are fantastic and I appreciate you putting everything down in a very easy to understand format like this. Enjoy the coffee!
That being said, I am looking to extend the system and replace the products / brands models with an architecture that has “company”, “sub company”, and various supporting data types under each sub-company. In browsing the code I am seeing a LOT of different places where these brands and products are configured, so I was wondering if you had a guide for adding new data types that I can use to help me.
Thanks again!
Don
Hi, Thanks.
Detailed documentation for adding new entities will be coming along with BlazorHero 3.0. But otherwise, the implementation is pretty straightforward to understand. You could just debug the code and understand the current flow as well.
Regards.
This looks interesting, thanks for sharing the code. Can it work with other DBs apart from MS SQL? I would like to use sql lite for a lightweight project.
Thanks! yes, it definitely will. The project supports all the DB Providers that are already supported by EntityFramework Core. By default, it works with MSSQL. But you can easily switch to SQLite –
1. Installing the EFCore.SQLite package to Infrastructure project
2. NAvigate to BlazorHero.CleanArchitecture.Server.Extensions.ServiceCollectionExtensions and change Line 178 as required for SQLite.
3. Remove and re-add migrations
However, with 3.0, I am planning to add support for other dbs as well by default. SQLite, PostgreSQL, etc.
Regards
Hi Mukesh
I cant find EFCore.SQLite. Only Microsoft.EntityFrameworkCore.SQLite but thats oly for Core 6
Hi, does anybody knows the connection strings for PostgreSQL? I tried many different strings but keep getting this error.
[Error]
Keyword not supported: data source (Parameter ‘keyword’)
[My connection string]
“Host=localhost;Port=5432;Database=HeroesDB;User=postgres;Password=123”
Someone, please help me. Thank you
Hi,
This is the string that i use for fluentpos project
“postgres”: “Host=localhost;Database=fluentpos;Username=postgres;Password=root;Include Error Detail=true”
Hope this helps
Regards
Hey Mukesh,
I’ve been using this for awhile, it’s awesome. I was wondering if you have plans to add Fluxor or a similar state management library?
If so which one would you add?
Thanks
Hi Mukesh, I had created another page exactly same as Brand, but when I open the page, the table not showing and I got error. Do I need to create another IResult.cs and Result.cs?
No, you don’t need to create IResult.cs and Result.cs.It’s supposed to be shared. Could you leave a link to your repository,maybe I can have a look.
Regards
It’s ok, I had found the problem, because of the Endpoint address.
Hi Mukesh,
Thanks for a great project.
I am having a similar issue to the one above. I have a duplicate the brand entity (which is called round). I have duplicated all of the necessary files (responses, queries, endpoints, permissions etc) and made the required name changes but when I make a call to the RoundsController I get the default index page returned instead of the data. Do I need to register the new controller or endpoints somewhere?
Hello Brian,
I run in the same issue and found a solution.
As example for your RoundsController.
1. Be sure, that you duplicted all files correct.
2. I used the TotalCommander and searched the project folder for all files “*Round*.cs” and “*Brand*.cs”. Compare the files count.
3. Search all files for “*Round*.cs” and in these files for “brand”. So I found some locations where I missed to changed from brand to round.
4. Don’t forget to add the new namespace in the _imports.razor file. It is the only file without ending *.cs to modify.
5. Start the project and use Swagger to test your new RoundsController. If you call GetAll() the breakpoint in RoundsController .GetAll() should be reached.
6. If this works, the problem can be in case sensitive api call. I don’t know why, but the route for the RoundsEndpoints didn’t work with lower case. Lower case for BrandsController is working instead. So change in RoundsEndpoints.cs the route for GetAll from “api/v1/rounds” to “api/v1/Rounds”.
Greetz,
Frank
Very Nice job, we tried to use it though and it seems tha the update-database does not create the database and tables at all. We tried also with the database created but still no luck
Hi, What is the issue that you face?
same issue when using sqlexpress in the appsetting file. update-database says Done with no errors but no db is created.
Hi !
I’m create new folder and add modal. When i build project client then error
Login.razor.g.cs(11, 18): [CS0234] The type or namespace name ‘Collections’ does not exist in the namespace ‘itphonui.Client.Pages.System’ (are you missing an assembly reference?)
How to fix it.
Thanks
Hi, Mukesh. Can I know why there are 2 connection strings in this Blazor Hero template? One at appsettings, another one is appsettings.development
Hi Mukesh. great work. no doubt about it. but i do have few questions if you don’t mind.
1 – you have another OSS protect. the Microservices based architecture. why didn’t integrate both together ? it would have made more sense.
2 – what’s the point in having the same features in both sides server and client ? moreover, why neither of them uses the API ???
3 – the login on the client does not work …. it is attempting to make a call locally instead of the server api ….
thanks for answering.
what needs to be done to support IDS4 ?
Dear Mukesh
very thanks for Good Application that share with us
i have a question,
why when i want to debug project , faced with Error.
could you please tell me one solution for debugging
regards Majid
Dear Br,
how you wrote this enterprise project without debugging?
a good new about Debug
you can’t debug in Startup and Program, in Other Pages you can debug without Problem
Hi Dear Mukesh,
At first i want to thanks for your great jobs ,
and my question is when blazor hero 3.0 will be released with modular monolithic architecture . we are waiting for this issue and this will make us grateful and happy.
Best Regards
Hi Mukesh,
Thanks for creating a wonderful project. Let me take this one for the next project and I will update you on my experience.
Can you guide how to debug on client project. I set breakpoint but only debug on server. Thanks
Hello Mukesh, Kudos. Thanks, your work is amazing and saved me a lot of time. I am curious about this code inside your AuthenticationManager:
>> ((BlazorHeroStateProvider)_authenticationStateProvider).MarkUserAsLoggedOut();
Why do you cast it like this instead of using an instance of BlazorHeroStateProvider or you could work with an Interface. I tried doing it the other way but I could only get it to work by explicitly casting just like you did. So is there any explanation why do we need to implement it this way?
Hi, Mukesh I am trying to Get data by Id, am I doing correctly with these lines of code? GetByIdAsync from the DocumentManager.
var request = new GetPersonByIdQuery { Id = id };
var response = await PersonManager.GetByIdAsync(request);
if (response.Succeeded)
{
Response = response.Data;
}
Hi Mukesh,
Its really a good work. Thanks for saving my time.
Need one help. i need to call a stored procedure. can you please provide the sample code for that.
Also, when can we expect the next version of blazor hero 3.0 ?
Hi Lavanya,
Do you get answer about call a stored procedure ?
I’m looking for that also.
Do you have any timeline for BlazorHero 3.0?
Hi Mukesh,
Good work!!.
Thanks for saving lot time and digging debugging in implementation of SignalR, MailService, Roles ,permissions and ect.. which are prerequisite now for any web apps.
I Need some help in adding new Modals to the project which will add some meaning to my project.
If possible could you please provide the sample code or instructions to add new entities to the project.
I am really exited and looking forward for the next version of blazor hero 3.0.
Regards,
Hello Damodar,
you can find the Beginners Guide on GitHub: https://github.com/blazorhero/CleanArchitecture/wiki/Beginners-Guide—How-to-Add-new-functional-Page
Yeah, it is. But its empty. Only Topics. I think that there should be some more documentation but Mukesh is focused more on other project right now and looks like no one want to contribute to expand guide 😀
Hello Mukesh,
Very excellent template and I have already published one app based on (v2.2) and I’m working on the second.
Minor problems I have faced,
As the template replace the default events for the jwt authentication, you will face a problem if you need to use lifetime validation for the token, since both access and refresh tokens are used, without the life time validation, the process to invalidate the current token for the user became harder than just clearing the refresh token in the server,
Also, for public access, the used events prevent any access without authorization.
I couldn’t reach the requested endpoint attributes from the event to work with them, so I fallen back to the default.
The second was with rtl support being related to the language, I have made a work around which works fine by adding property to the language code class
Again, this is meant as a constructive feed back and thank you very much for this template, it saved me a lot of working hours.
hi Mukesh… thanks for this great template..
i want to ask, how to implement Identity Server 4 on WASM .net core hosting??
Dear Mukesh,
It’s awesome.
Thank you sir.
There is no problem but
I have question like Radim’s question.
How does routing work in this project?
When we request “https://localhost:5001/dashboard” url, how does server route my request to dashboard page in Client project?
Hi, Routing works like any other Blazor project.
Each page’s razor file has this code on top -> `@page “/dashboard”`
The above code is from Dashboard.razor. Whenever you navigate to /dashboard, the associated razor page is invoked by default.
Regards
Yes, that’s right.
but the base address is “https://localhost:5001” that is for “Server” project not “Client” project.
Actually as you mentioned in this “Make sure that you set the YourNamespace.Server project as the startup project.”, we start “Server” project on “https://localhost:5001” address but routes like “/dashboard” belong to “Client” project.
How does this work?
hey Mukesh
this really is cool work ..
I am trying to change the template so a created app uses drawers for editing rather than dialog, any pointers as to how to accomplish
Hi Mukesh,
Really nice work.
Need sample code for Excel import. Can you please help.
hows Version 3 coming along .. any time scale ?
Hi Mukesh.
This is aboslutely awesome. Just curious if you have a guide on launching this on IIS? I keep running into HTTP Error 500.30 – ASP.NET Core app failed to start when I publish it on my test server IIS. I have installed the hosting bundle and run times for dot net core 5.0. Any help would be much appreciated.
Can we have Windows Authentication support for this project?
Login page to add one button, Windows User auto login.
Did anyone answer this question?
Hi
Is there any setup required for the Client application? When I run a new clean solution I get 404 when trying to log in.
“The input does not contain any JSON tokens. Expected the input to start with a valid JSON token, when isFinalBlock is true”. For https://localhost:5001/api/identity/token
Thanks
Hi,
Are you running the Server project as the startup projecT?
Hi Mukesh.
Which project do we publish on Visual Studio?
Hello, very nice clean code!
One question: how can we implement a proper filter, that filters multiple columns ?
You currently have that searchString that searches for that value in EVERY column/property.
But: what if i want to implement a filter like :
string nameFilter
string addressFilter
DateTime dateFilter
And then, build the query based on these multiples with some logic like :
p => p.name.Contains(nameFIlter)
then
p => p.address.Contains(adressFilter)
Etc.
?
Hi Mukesh,
This is a fantastic project, but I was wondering if we could create a Blazor server fork of it or if someone could provide some guidance on converting from WASM to server? It would be great to have both templates, but if there’s a relatively easy way to convert that’d be good to know too.
Congratulations on your brilliant work. My only problem is that I cannot upload larger documents. What is the best way to upload documents larger than 10MB? The API currently aborts the process after approx. 5MB.
How to use MYSQL insted MSSQL?
Hi, Please refer to https://github.com/blazorhero/CleanArchitecture/issues/75
When could I expect Blazor Hero 3.0 ?
I need help. Can someone explain how to combine what was built here and adding Linq or query language queries?
Using the current _unitOfWork stuff and then add something like this:
var data = await _unitOfWork.Repository().Entities
.Join(Person,
Employee => e.Id,
Person => p.Id,
(e, p) => new {
Id = e.Id,
FirstName = p.firstName,
LastName = p.lastName,
City = p.City
}
)
.Join(EmployeeSchedule,
Employee => e.Id,
EmployeeSchedule => es.DateAvailable,
(e, es) => new {
DateAvailable = es.DateAvailable,
Available = es.Available
}
)
…
Help? This isn’t my universe.
Thanks
Craig
(Also adding a discussion page to the github pages like MudBlazor has, maybe?)
Hi Mukesh,
How easy is it to use Syncfusion components (like their DataGrid component) in the client razor pages instead of using EditForm?
I can get their components running easily in a blank EF Server application, but find it difficult to integrate it in a Clean Architecture application, which is what I want to use for my projects.
Andries
Currently, blazorHero has a dependency on MudBlazor. It was designed that way. Probably with the future releases, will find a way to decouple the UI components. I will mostly include this in the Blazor variant of fullstackhero.
HeIlo mukesh,
I followed all the steps detailed on the post as well as on the YouTube video and I have the latest .Net 5 and visual studio(version 16.11) installed and I have checked if. Net 5 is installed correctly, it has and I also made WarehouseManger.server as my start up project. But after completing every step correctly when i run it shows an error that says “culturenotfoundexception: culture is not supported. (parameter ‘name’) km_kh is an invalid culture identifier. system.globalization.cultureinfo..ctor(string name, bool useuseroverride) culturenotfoundexception: culture is not supported. (parameter ‘name’) km_kh is an invalid culture identifier.” I found out this kind of errors usually are associated with the language and region of your machine. Am running windows 8.1 on my laptop does that might be the case?
I think you may need to remove the km_kh language from your version of BlazorHero. Guess your system has hard time understanding the culture keyword. Do let me know if that helps. Regards
Thanks brother, That Solved it
Hello Mukesh,
I just wanted to ask that the project only runs when i run it on kestral server and not on iis on my development machine. Can there be any problem when i deploy it on server iis? or what if i deploy it on Azure? is there any chance i face deployment problem? and lastly, why is there problem in dev environment using iis in the first place can u explain that? Thanks in advance 🙂
Hi this project is already deployed on to Azure by many developers. You may have to change launchSettings and modify the IIS Profile to make it work. You can easily find it online.
Hi Mukesh,
Can’t find anything related in online to change launch settings which works deployment in IIS , If you any online reference please provide us, Thanks
Hi,
Thank you for this amazing project!
Some other users asked already and I couldn’t find any answer: I would like to understand better if this project is a Blazor Server Side project, because, from what I learned so far, the Server is using the Client and in the browser I don’t see that the server .js is used.
I’m aiming for Server Side website that will run also in browsers not compatible with web-assembly. Is that possible with this project? The Visual Studio Blazor Server Side template allows that and I’m thinking… would be difficult to port this to a full Server Side app?
Thank you!
Hello Mukess, very nice work , thanks a lot fot that.
but I have one question about IdentityUser, I need to use it in the Domain project
How I can do that whitout broken the structure of the project ?
(I new in Asp.net)
Hi Mukash,
Again this is very awesome project. if am not mistaken the audit trails only tracks the activity of the current logged in user, but I wanted to make it track all the users especially those with basic role in order to implement a better supervisions on the system users to avoid any unnecessary changes.
Thanks
Hi Mukesh,
First of all thanks for your work, is awesome!
I have a issue that I cannot drive it. Please help me:
I need, for example, list all product for a brand. For that, I include Ienumerable attribute products on brand entity:
public virtual ICollection Products { get; set; }
Add too in responses.
But in razor I receive the Icollection attribute Products empty, null
I cannot see where to fill it with all products for that brand.
I hope u can share some knowledge with me
I’m getting a build error that I can’t seem to fix. Any help would be appreciated. Thank you.
Error AL1065 File name ‘obj\Debug\net5.0\acu_web_solution.Application.Resources.Features.ExtendedAttributes.Commands.AddEdit.AddEditExtendedAttributeCommandLocalization.en.resources’
is too long or invalid
I tried deleting the debug folders, clean & rebuild.
Also checked my registry key and it’s already set to 1.
Computer\HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\FileSystem\LongPathsEnabled (Type: REG_DWORD) must exist and be set to 1.
I’ve isolated the issue to this: Having my project on my local disc but inside of a OneDrive Sync’d folder is what’s causing the issue.
Hi Mukesh,
I am facing below issue after hosted in iis server.
Failed to find a valid digest in the ‘integrity’ attribute for resource ‘http://abc.xyz.com/_framework/AutoMapper.dll’ with computed SHA-256 integrity ‘2UwMB6TJWR7IL29DunLOHliu/B/WXftGTXcC0mXvVqg=’. The resource has been blocked.
abc.xyz.com/:1 Unknown error occurred while trying to verify integrity.
Please reply
Hi:
I faced the same issue. I solved it by deleting all the OBJ and BIN directories under the solution. Rebuild and republish.
Hope it helps.
MST
Actually, it looks like there’s an issue with HTTPS. When I’ve removed https expose and tried running it on HTTP I am getting the DLLs loaded directly into the browser. Not sure how to fix it yet
First Thanks for your excellent work Mukesh.
I am looking forward to the possibility of logging in using Google or Facebook, how can I do that?
Hi Mukesh,
Thanks for template.
Actually the blazor client app is broken. Right now always die when you change between languages.
Hi Mukesh,
I upgraded the project into .NET 6.0, it worked with no errors.
Also i tried to play around with .NET MAUI and i succefully added components and required services into .NET MAUI Blazor.
but i struggle with the http client connection between .NET MAUI Blazor and Blazor wasm.
i have this error : IPv4 address 0.0.0.0 and IPv6 address ::0 are unspecified addresses that cannot be used as a target address. (Parameter ‘hostName’) (0.0.0.0:443) (something related with hubconnection)
Thank you for the templates, as a beginner it really helped me to understand Blazor and clean architecture better and hopes you make some post about .NET MAUI Blazor too in the future.
Regards !
hi , I did try to move it to .net 6 at the beginning, and update all nugets to latest version, however I do have the following errors on the Web/Client/Client project which do not reload any more. The rest is ok.
The message is ;
C:\Structure\Learning\Blazor\BlazoreHero2-2\IoT-DashboardBH\src\Client\Client.csproj : error : The element beneath element is unrecognized. C:\Structure\Learning\Blazor\BlazoreHero2-2\IoT-DashboardBH\src\Client\Client.csproj
net6.0
true
IoT_DashboardBH.Client
IoT_DashboardBH.Client
Hello,
How can I set RTL as default direction?
Hey Mukesh, do you have an approach on securing the jwt? At the moment you could just copy the token from dev tools and trigger the api. There are several best practices but i don’t know witch fits the best for this use-case. I would be happy to implement.
Hi:
How I change the authentication method to Azure Active Directory integration (register the app under AAD and have all users as the tenant Users)
Best regards,
MST.
Hi Msouga,
Hope you are good,
have you got any solution for integration of azure active directory ? , actually I am also trying to add this feature so could you please help me. if you got any solution.
Thanks
I used Active Directory Default and that seemed to do the trick
Hello Mukess
very nice work , thanks ,
we request to please add timepicker example.
thanks .
Hi Mukesh,
I’m starting with web development and your framework, documentation and video really helped me immensely to kick start my development journey. Really impressive and inspiring.
Great effort
Thanks
I have one little query….seek your expert help.
I have this below requirement to handle an optional/nullable foreign key in a table and could not get my head around to get this working for the last couple of days…
I have defined the model with
public int? foreign_key_field {get; set;} entry,
I’m having issues in implementing the Create/Update Blazor code for the same with the <MudAutoComplete component.
Get error with the Bind and SearchFunction and parameters
Request your expert help, can you share a sample code snippet to implement the same.
Rgds,
Manju
Hi Mukesh
Thanks for your excellent work.
In the Readme file, you mention this, regarding Blazor Hero 3:
“Tutorials to add new entities, controllers”
Will this be included anytime soon?
You are great Mukesh,
thank you so much for all.
Hi Mukesh, i start using this for my learning purpose and it look so awesome. I just wonder do you plan to add 3rd Party or external authentication to the app such as Facebook, Google or even Enterprise provider such as PingId or Okta. I think i can help contribute on the code for this as well as translation to Vietnamese as well, just don’t know where to start … !
For now, not considering it for BlazorHero. But have a look at fullstackhero. Maybe we can include it there. It has a Blazor Client also.
Hello Mukesh,
I have been learning using the project, but i got one problem when the number of permissions increase for the admin user the system just freezes and doesn’t load the dashboard at all. When i delete some of the permissions from the database and make the endpoints authorization allowanonymus it works fine. Mind you if you can help me?
Thanks in Advance!!!
I believe the problem might be in the size of the JWT Token. If you insanely increase the number of permissions to a particular role, the JWT token might become too large for the browser to process.
Thank you for your fast replay, I got you, is there anyway for the permissions not to be seeded for the admin role immediately? Because every time i add a new permission it will be added to the admin role instantly. May be if there is anyway like, to add permissions selectively for the admin role?
Hello everyone, could you share some ideas to implement unit test for this project?
IIS 10 Publish Error in
await hubConnection.StartAsync();
the Error is
Failed to load resource:/signalRHub/negotiate?negotiateVersion=1:1
the server responded with a status of 405 (Method Not Allowed)
Please Help
Hello Mukess
How to change spelsh screen and ico file.
hi everyone,
i wanna make some css changes “width of the navmenu” but i can’t, it’s fixed in https://localhost:44398/_content/MudBlazor/MudBlazor.min.css?v=5.0.5, and i can’t find this file on my pc.
How can i find and change it!
thanks
Hello Mukesh,
this is awesome, really amazing work. One question: Is there any turorial or short guidance about how to properly add new features/models to blazor hero in order to leverage all the implemented functionalities?
Kind regards, Gert
Hi,
thanks for sharing. Great work.
Are you still working on this ?
What are the credentials for the api ?
We need to get the token https://localhost:5005/swagger/index.html
/api/identity/token
Then we can use postman, the swagger etc …
I love the project <3 but I need a step by step on how to implement a CRUD. If you could add this I would really appreciate it.
Hi Mukesh,
Hope you are doing well,
I am trying to integrate Microsoft Azure login feature but I am unable to add this feture yet,
I am redirecting on microsoft page for login/logout user but unable to fetch the user claims that’s why I am unable to authenticate the user on application level by azure login and also I have raised the issue on github so I need your assisment so please suggest me and do the needful.
Thanks
when you adding new Tenant you need to specify the connection string?
It should create the db for each tenant automaticlly
Hi Mukesh,
First of all. congrats!, really nice job.
I’ve been getting this error,:
[ERR] Connection ID “17870283327311714827”, Request ID “80001a13-0001-f800-b63f-84710c7967bb”: An unhandled exception was thrown by the application.
System.InvalidOperationException: The response headers cannot be modified because the response has already started.
when a user get into the app. after like 3 days, the token doesnt work and it log out your session, you must login again, and that is when this error come out
At first i thought it coulb be because signalR, i commented everything with signalR but still getting the error, can you help me??
Hi Mukesh,
first of all congrats, really nice job.
I’ve been getting this error:
[ERR] Connection ID “17005592194561611971”, Request ID “800018c7-0000-ec00-b63f-84710c7967bb”: An unhandled exception was thrown by the application.
System.InvalidOperationException: The response headers cannot be modified because the response has already started.
at first i thought was because signalR, then i commented every line about signalR, but still getting the error. can you point me in the right direction??
Hi
i dug a bit in the code and there is smth i do not understand
If I update a brand from a SQL update command outside the app it is never refresh in the app.
If I click reload nothing happen, If i refresh with F5 neither.
I need to restart the app to see the modifications !
I assume this is by design, i noticed that when saving a row that has not been modified, nothing happen on the SQL side. (which is nice)
Am I doing smth wrong ? Is there a way to change this ?
It was easy to fix !
In the getallentityquery there is
var entitylist = await _cache.GetOrAddAsync(ApplicationConstants.Cache.GetAllEntitiessCacheKey, getAllEntitys);
I dunno how the cache is really working for now but replacing this by
var entitylist = await _unitOfWork.Repository().GetAllAsync()
I replace my entity by entity but is works for brand too
Hi Mukesh,
The output looks good. However the folder structure is too confusing. Its folders within folders and folders. Can you please explain like any other tutorials in your website.
It would be nice if you explain every components in the blazor hero.
hi mukesh
I’ve been looking for how to add a new table with its entity but I can’t find anything
Could you help me or tell me how I could add a new table like the one for users but for cars?
or if there is a command to be able to add that new entity and create a table with the data that I want
I wait your answer thank you.
Hi you can filter on Brand in visual studio (or product) and copy/paste/adapt to add a new entity
It is teddious but it helps understanding how this works
Hi Mukesh
I’ve been looking for how to add a new table with its entity but I can’t find anything
Could you help me or tell me how I could add a new table like the one for users but for cars?
or if there is a command to be able to add that new entity and create a table with the data that I want
I wait your answer thank you
Hi everyone, i want to get data from an available MQTT broker and show it on dashboard. Have anyone done it before? How can i do that? Thank a lot.
Hi, Mukesh Murugan.
This project has been of great help to me.
Thank you for your contribution.
Thanks.
i need import with datetime from excel but i don’t work. please help!
Can you please explain how to publish the same in Amazon Cloud and start the API?
Hi Mukesh,
This is excellent explanation about code.
I have executed Update Database command it get executed successfully. User also created in app but I am unable to find Database in SQMS. Can you please help in this regards.
Regards,
Kishor
Please ignore my comment.
Please share tentative date for 3.0 version.
Hi,
Can you please advise on the date for the V3 release or has it been shelved??
Regards
Peter
Can I use this same template on a macOS system?
I am getting error in console when I am update the MudBlazor to 6.2.2, but it works fine one earlier version like 5.0.16.
how can i host Server project in another domain and host client in in another domain, i want use iis
using reflection for calling repo. Do you think it will not affect performance and cause some unexpected runtime errors?