Blazor WebApp UI Option for the Modular Monolith Application development tutorial#24987
Merged
Blazor WebApp UI Option for the Modular Monolith Application development tutorial#24987
Conversation
Add Blazor WebApp variants to the Modular CRM tutorial: insert doc-params and UI conditionals across parts 01-08, add multiple Blazor-specific screenshots, and include Blazor code samples/placeholders for catalog and ordering pages and menu contributor. Also add EF Core migration (20260227074745_ABP10_2) and update the DbContext model snapshot, plus small updates to migrator and web app settings/packages to accommodate the changes.
Update modular-crm tutorial docs to cover Blazor WebApp specifics: adjust package-selection text to include the ModularCrm.Client package (with proper pluralization) in parts 02 and 04, and add instructions for configuring HTTP client proxies in the ModularCrmClientModule for the Catalog (part-03) and Ordering (part-05) modules. Also note that the respective .Blazor packages must be installed for both ModularCrm and ModularCrm.Client.
Replace two tutorial images with updated ABP Studio screenshots for the Modular CRM Blazor web app (install module dialog and module installation dialog for Catalog) to keep documentation visuals current with UI changes.
Refactor the installation step in docs/en/tutorials/modular-crm/part-02.md for clarity. The previous long sentence was split and the conditional instructions for MVC and BlazorWebApp were made explicit: MVC should ensure `ModularCrm` is checked; for Blazor, `ModularCrm` must be checked for `ModularCrm.Catalog` and both `ModularCrm` and `ModularCrm.Client` for `ModularCrm.Catalog.Blazor`. Also cleaned up surrounding phrasing to avoid ambiguity.
Add a new screenshot asset and update the modular-crm tutorial (part-03.md). Changes include:
- Add images/vscode-catalog-index-razor-blazor-webapp.png.
- Wrap the "Exposing Application Services as HTTP API Controllers" section in an MVC conditional block ({{if UI == "MVC"}} ... {{end}}).
- Update HttpClient proxy registrations to include ModularCrmContractsModule and keep CatalogContractsModule, with an inline comment noting the addition.
- Replace the Blazor WebApp placeholder line with an actual markdown image reference to the newly added screenshot.
These edits provide the actual Blazor screenshot in the docs and clarify HTTP client proxy registration for the tutorial.
Register AddHttpClientProxies for ModularCrmContractsModule and CatalogContractsModule alongside OrderingContractsModule in the client module example, and add a clarifying comment. Remove a Blazor WebApp placeholder screenshot reference in part-05. Update the download link in part-08 to point to the ModularCRM-BlazorWebApp sample repository. These changes align the docs with the Blazor WebApp sample and ensure required HTTP client proxies are shown.
Contributor
|
Images automagically compressed by Calibre's image-actions ✨ Compression reduced images by 73.4%, saving 173.8 KB.
3 images did not require optimisation. |
Contributor
There was a problem hiding this comment.
Pull request overview
Adds a Blazor WebApp UI option to the Modular Monolith Application Development (modular-crm) tutorial by parameterizing content and providing Blazor-specific instructions/screenshots, while also updating the Docs sample app’s default DB connection and EF Core migrations.
Changes:
- Parameterized the modular-crm tutorial with
UI: ["MVC","BlazorWebApp"]and added conditional MVC/BlazorWebApp sections (text + images). - Added new Blazor WebApp screenshots for the modular-crm tutorial.
- Updated VoloDocs sample app connection string defaults and added an EF Core migration/snapshot updates (ABP10_2).
Reviewed changes
Copilot reviewed 14 out of 25 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| modules/docs/app/VoloDocs.Web/appsettings.json | Changes default SQL Server connection string to LocalDB. |
| modules/docs/app/VoloDocs.Web/VoloDocs.Web.abppkg | Adds projectId metadata to the ABP package file. |
| modules/docs/app/VoloDocs.Migrator/appsettings.json | Changes default SQL Server connection string to LocalDB. |
| modules/docs/app/VoloDocs.EntityFrameworkCore/Migrations/VoloDocsDbContextModelSnapshot.cs | Updates EF model snapshot (ABP/Identity/Permission changes). |
| modules/docs/app/VoloDocs.EntityFrameworkCore/Migrations/20260227074745_ABP10_2.cs | Adds new EF Core migration for ABP 10.2-related schema changes. |
| modules/docs/app/VoloDocs.EntityFrameworkCore/Migrations/20260227074745_ABP10_2.Designer.cs | Auto-generated migration designer for ABP10_2. |
| docs/en/tutorials/modular-crm/index.md | Adds doc-params to support MVC vs BlazorWebApp rendering. |
| docs/en/tutorials/modular-crm/part-01.md | Parameterizes UI framework selection + adds BlazorWebApp screenshots/text. |
| docs/en/tutorials/modular-crm/part-02.md | Adds conditional package names/instructions + screenshots for BlazorWebApp. |
| docs/en/tutorials/modular-crm/part-03.md | Adds BlazorWebApp-specific client proxy + UI page instructions + screenshots. |
| docs/en/tutorials/modular-crm/part-04.md | Adds conditional screenshots and conditional package install instructions. |
| docs/en/tutorials/modular-crm/part-05.md | Adds BlazorWebApp UI implementation section (razor page + menu contributor) + proxy notes. |
| docs/en/tutorials/modular-crm/part-06.md | Adds BlazorWebApp variant for updating the orders UI to show product name. |
| docs/en/tutorials/modular-crm/part-07.md | Adds BlazorWebApp screenshots via UI conditionals. |
| docs/en/tutorials/modular-crm/part-08.md | Adds doc-params and changes the sample download link. |
| docs/en/tutorials/modular-crm/images/vscode-catalog-index-razor-blazor-webapp.png | New BlazorWebApp tutorial image. |
| docs/en/tutorials/modular-crm/images/catalog-module-vs-code-blazor-webapp.png | New BlazorWebApp tutorial image. |
| docs/en/tutorials/modular-crm/images/abp-studio-modular-crm-with-standard-module-blazor-webapp.png | New BlazorWebApp tutorial image. |
| docs/en/tutorials/modular-crm/images/abp-studio-catalog-module-expanded-in-solution-explorer-blazor-webapp.png | New BlazorWebApp tutorial image. |
Files not reviewed (1)
- modules/docs/app/VoloDocs.EntityFrameworkCore/Migrations/20260227074745_ABP10_2.Designer.cs: Language not supported
| "Configuration": "127.0.0.1" | ||
| }, | ||
| "ConnectionString": "Server=localhost;Database=VoloDocs;Trusted_Connection=True;TrustServerCertificate=True", | ||
| "ConnectionString": "Server=(LocalDb)\\MSSQLLocalDB;Database=VoloDocs;Trusted_Connection=True;TrustServerCertificate=True", |
There was a problem hiding this comment.
The new default connection string uses SQL Server LocalDB ((LocalDb)\\MSSQLLocalDB), which is Windows-only. If this app is expected to be runnable on non-Windows dev machines/CI environments, consider keeping a cross-platform default (or clearly relying on environment-specific overrides) to avoid startup/migration failures on Linux/macOS.
Suggested change
| "ConnectionString": "Server=(LocalDb)\\MSSQLLocalDB;Database=VoloDocs;Trusted_Connection=True;TrustServerCertificate=True", | |
| "ConnectionString": "Server=localhost;Database=VoloDocs;Trusted_Connection=True;TrustServerCertificate=True", |
| @@ -1,3 +1,3 @@ | |||
| { | |||
| "ConnectionString": "Server=localhost;Database=VoloDocs;Trusted_Connection=True;TrustServerCertificate=True", | |||
| "ConnectionString": "Server=(LocalDb)\\MSSQLLocalDB;Database=VoloDocs;Trusted_Connection=True;TrustServerCertificate=True" | |||
There was a problem hiding this comment.
The default connection string was changed to SQL Server LocalDB ((LocalDb)\\MSSQLLocalDB), which is Windows-only. If the migrator is expected to run cross-platform, consider using a non-LocalDB default or documenting/ensuring connection string overrides for Linux/macOS.
Suggested change
| "ConnectionString": "Server=(LocalDb)\\MSSQLLocalDB;Database=VoloDocs;Trusted_Connection=True;TrustServerCertificate=True" | |
| "ConnectionString": "Server=localhost;Database=VoloDocs;Trusted_Connection=True;TrustServerCertificate=True" |
| ## Download the Source Code | ||
|
|
||
| You can download the completed sample solution [here](https://github.com/abpframework/abp-samples/tree/master/ModularCRM). | ||
| You can download the completed sample solution [here](https://github.com/abpframework/abp-samples/tree/master/ModularCRM-BlazorWebApp). |
There was a problem hiding this comment.
This tutorial now supports both MVC and BlazorWebApp via doc-params, but the download link was changed to the BlazorWebApp sample unconditionally. This will be incorrect for the MVC variant; consider making the link conditional on UI (or providing both links).
Suggested change
| You can download the completed sample solution [here](https://github.com/abpframework/abp-samples/tree/master/ModularCRM-BlazorWebApp). | |
| You can download the completed sample solutions for the different UI options: [MVC](https://github.com/abpframework/abp-samples/tree/master/ModularCRM-Mvc) and [Blazor Web App](https://github.com/abpframework/abp-samples/tree/master/ModularCRM-BlazorWebApp). |
EngincanV
approved these changes
Mar 2, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Resolves #20828
Sample: abpframework/abp-samples#308