diff --git a/docs/en/solution-templates/application-module/images/new-solution-v2.png b/docs/en/solution-templates/application-module/images/new-solution-v2.png index 28e7b3e687..ee87d719c8 100644 Binary files a/docs/en/solution-templates/application-module/images/new-solution-v2.png and b/docs/en/solution-templates/application-module/images/new-solution-v2.png differ diff --git a/docs/en/tutorials/modular-crm/images/abp-studio-catalog-module-expanded-in-solution-explorer.png b/docs/en/tutorials/modular-crm/images/abp-studio-catalog-module-expanded-in-solution-explorer.png new file mode 100644 index 0000000000..b3720bb3fb Binary files /dev/null and b/docs/en/tutorials/modular-crm/images/abp-studio-catalog-module-expanded-in-solution-explorer.png differ diff --git a/docs/en/tutorials/modular-crm/images/solution-explorer-modular-crm-initial-with-modules-v2.png b/docs/en/tutorials/modular-crm/images/solution-explorer-modular-crm-initial-with-modules-v2.png new file mode 100644 index 0000000000..ea29349339 Binary files /dev/null and b/docs/en/tutorials/modular-crm/images/solution-explorer-modular-crm-initial-with-modules-v2.png differ diff --git a/docs/en/tutorials/modular-crm/images/solution-explorer-modular-crm-initial-with-modules.png b/docs/en/tutorials/modular-crm/images/solution-explorer-modular-crm-initial-with-modules.png deleted file mode 100644 index f664910c58..0000000000 Binary files a/docs/en/tutorials/modular-crm/images/solution-explorer-modular-crm-initial-with-modules.png and /dev/null differ diff --git a/docs/en/tutorials/modular-crm/part-01.md b/docs/en/tutorials/modular-crm/part-01.md index 7b2a650f58..c3dfb50f22 100644 --- a/docs/en/tutorials/modular-crm/part-01.md +++ b/docs/en/tutorials/modular-crm/part-01.md @@ -42,23 +42,26 @@ The *Standard Module* template is suggested for building modular monolith applic The initial solution structure should be like the following in ABP Studio's *[Solution Explorer](../../studio/solution-explorer.md)*: -![solution-explorer-modular-crm-initial-with-modules](images/solution-explorer-modular-crm-initial-with-modules.png) +![solution-explorer-modular-crm-initial-with-modules](images/solution-explorer-modular-crm-initial-with-modules-v2.png) -Initially, you see a `ModularCrm` solution, a `ModularCrm` module under that solution (our main single layer application), and a `modules` folder that contains the `ModularCrm.Catalog` module and its sub .NET projects. +Initially, you see a `ModularCrm` solution with two solution folders: -> An ABP Studio module is typically a .NET solution and an ABP Studio solution is an umbrella concept for multiple .NET Solutions (see the [concepts](../../studio/concepts.md) document for more). +* `main`: That folder contains the `ModularCrm` ABP Studio Module, which is the main executable web application of the solution. +* `modules`: A folder to place your modules. It contains the `ModularCrm.Catalog` module initially. -The `ModularCrm` module is the core of your application, built as a single-layer ASP.NET Core Web application. On the other hand, the `ModularCrm.Catalog` module consist of four packages (.NET projects) and used to implement the catalog module's functionality. +> An **ABP Studio Module** is typically a separate .NET solution. On the other hand, an **ABP Studio Solution** is an umbrella concept for multiple .NET Solutions (see the [concepts](../../studio/concepts.md) document for details). ## Catalog Module's Packages -Here are the .NET projects (ABP Studio packages) of the Catalog module: +If you expand it, you can see the .NET projects (ABP Studio Packages) of the `ModularCrm.Catalog` module: + +![abp-studio-catalog-module-expanded-in-solution-explorer](images/abp-studio-catalog-module-expanded-in-solution-explorer.png) - `ModularCrm.Catalog`: The main module project that contains your [entities](../../framework/architecture/domain-driven-design/entities.md), [application service](../../framework/architecture/domain-driven-design/application-services.md) implementations and other business objects -- `ModularCrm.Catalog.Contracts`: Basically contains [application service](../../framework/architecture/domain-driven-design/application-services.md) interfaces and [DTOs](../../framework/architecture/domain-driven-design/data-transfer-objects.md) -- `ModularCrm.Catalog.Tests`: Unit and integration tests (if you selected the _Include Tests_ option) -- `ModularCrm.Catalog.UI`: Contains user interface pages components for the module +- `ModularCrm.Catalog.Contracts`: Basically contains [application service](../../framework/architecture/domain-driven-design/application-services.md) interfaces and [DTOs](../../framework/architecture/domain-driven-design/data-transfer-objects.md). These interfaces then can be used by client modules for integration purposes or by the user interface to perform use cases related to that module +- `ModularCrm.Catalog.Tests`: Unit and integration tests (if you selected the _Include Tests_ option) for that module +- `ModularCrm.Catalog.UI`: Contains user interface pages and components for the module ## Summary -You've created the initial single layer monolith modular solution with a Catalog module included. In the next part, you will learn how install the Catalog module to the main application. +You've created the initial single layer monolith modular solution with a Catalog module included. In the [next part](part-02.md), you will learn how install the Catalog module to the main application. diff --git a/docs/en/tutorials/modular-crm/part-02.md b/docs/en/tutorials/modular-crm/part-02.md index e175823350..383f5bd2a9 100644 --- a/docs/en/tutorials/modular-crm/part-02.md +++ b/docs/en/tutorials/modular-crm/part-02.md @@ -16,20 +16,6 @@ In this part, you will install the `ModularCrm.Catalog` module to the main application, which was created in the [previous part](part-01.md). -## Creating an ABP Studio Solution Folder - -Before installing the `ModularCrm.Catalog` module to the main application, let's create a "main" folder and move the `ModularCrm` module (the main application) to it to tidy up the solution structure. Right-click to the solution root on the *Solution Explorer* panel, and select *Add* -> *New Folder* command: - -![abp-studio-add-new-folder-command-2](images/abp-studio-add-new-folder-command-2.png) - -That command opens a dialog where you can set the *Folder name*: - -![abp-studio-new-folder-dialog](images/abp-studio-new-folder-dialog.png) - -After the folder is created, now you can move the `ModularCrm` module to the `main` folder (simply by drag & drop). The _Solution Explorer_ panel should look like the following figure now: - -![abp-studio-solution-explorer-with-folders](images/abp-studio-solution-explorer-with-folders-v2.png) - ## Installing the Catalog Module to the Main Application A module does not contain an executable application inside. The `ModularCrm.Catalog.UI` project is just a class library project, not an executable web application. A module should be installed in an executable application to run it. @@ -62,7 +48,7 @@ Graph Build is a dotnet CLI command that recursively builds all the referenced d > While developing multi-module solutions with ABP Studio, you may need to perform *Graph Build* on the root/main module if you change the depending modules. -### Run the Main Application +## Running the Main Application Open the *Solution Runner* panel, click the *Play* button (near to the solution root), right-click the `ModularCrm` application and select the *Browse* command. It will open the web application in the built-in browser. Then you can navigate to the *Catalog* page on the main menu of the application to see the Catalog page that is coming from the `ModularCrm.Catalog` module: diff --git a/docs/en/tutorials/modular-crm/part-03.md b/docs/en/tutorials/modular-crm/part-03.md index b9862afd4b..eef2539c9b 100644 --- a/docs/en/tutorials/modular-crm/part-03.md +++ b/docs/en/tutorials/modular-crm/part-03.md @@ -353,9 +353,9 @@ We've added the `CreateMap();` line to define the mapping. To create HTTP API endpoints for the catalog module, you have two options: * You can create a regular ASP.NET Core Controller class in the `ModularCrm.Catalog` project, inject `IProductAppService` and create wrapper methods for each public method of the product application service. You will do this later while you create the Ordering module. (Also, you can check the `SampleController` class under the **Samples** folder in the `ModularCrm.Catalog` project for an example) -* Alternatively, you can use the ABP's [Auto API Controllers](../../framework/api-development/auto-controllers.md) feature to expose your application services as API controllers by conventions. We will do it here. +* Alternatively, you can use the ABP's [Auto API Controllers](../../framework/api-development/auto-controllers.md) feature to expose your application services as API controllers by conventions. -Open the `CatalogModule` class in the Catalog module's .NET solution (the `ModularCrm.Catalog` .NET solution, the `ModularCrm.Catalog` .NET project) in your IDE, find the `ConfigureServices` method and add the following code block into that method: +We will use the second approach here. Open the `CatalogModule` class in the Catalog module's .NET solution (the `ModularCrm.Catalog` .NET solution, the `ModularCrm.Catalog` .NET project) in your IDE, find the `ConfigureServices` method and add the following code block into that method: ````csharp Configure(options => @@ -375,15 +375,13 @@ Now, ABP will automatically expose the application services defined in the `Modu This section will create a few example products using the [Swagger UI](../../framework/api-development/swagger.md). Thus, you will have some sample products to show on the UI. -Now, right-click the `ModularCrm` under the `main` folder in the Solution Explorer panel and select the *Dotnet CLI* -> *Graph Build* command. This will ensure that the catalog module and the main application are built and ready to run. - -After the build process completes, open the Solution Runner panel and click the *Play* button near the solution root. Once the `ModularCrm` application runs, you can right-click it and select the *Browse* command to open the user interface. +Open the Solution Runner panel and click the *Play* button near the solution root. Once the `ModularCrm` application runs, you can right-click it and select the *Browse* command to open the user interface. Once you see the user interface of the web application, type `/swagger` at the end of the URL to open the Swagger UI. If you scroll down, you should see the `Catalog` API: ![abp-studio-swagger-ui-in-browser](images/abp-studio-swagger-ui-in-browser.png) -> **Note:** If you have a swagger error on the UI, then you can open the `SampleAppService` class in the `ModularCrm.Catalog` project and add `[RemoteService(false)]` attribute to the `SampleAppService` class. With this attribute, the `SampleAppService` class will not be exposed as a remote service automatically but since there is a `SampleController` class in the `ModularCrm.Catalog` project, the `Catalog` API will be exposed as a remote service. +> If you don't see the Product API, you may need to re-build the entire solution. Right-click the `ModularCrm` under the `main` folder in the ABP Studio Solution Explorer panel and select the *Dotnet CLI* -> *Graph Build* command. This will ensure that the catalog module and the main application are completely built. Expand the `POST /api/catalog/product` API and click the *Try it out* button as shown in the following figure: diff --git a/docs/en/tutorials/modular-crm/part-05.md b/docs/en/tutorials/modular-crm/part-05.md index af47fadf29..4b40dedd0a 100644 --- a/docs/en/tutorials/modular-crm/part-05.md +++ b/docs/en/tutorials/modular-crm/part-05.md @@ -360,15 +360,13 @@ This will tell the ABP framework to create API controllers for the application s This section will create a few example orders using the [Swagger UI](../../framework/api-development/swagger.md). Thus, you will have some sample orders to show on the UI. -Now, right-click the `ModularCrm` under the `main` folder in the Solution Explorer panel and select the *Dotnet CLI* -> *Graph Build* command. This will ensure that the order module and the main application are built and ready to run. - -After the build process completes, open the Solution Runner panel and click the *Play* button near the solution root. Once the `ModularCrm` application runs, you can right-click it and select the *Browse* command to open the user interface. +Open the Solution Runner panel and click the *Play* button near the solution root. Once the `ModularCrm` application runs, you can right-click it and select the *Browse* command to open the user interface. Once you see the user interface of the web application, type `/swagger` at the end of the URL to open the Swagger UI. If you scroll down, you should see the `Order` API: ![abp-studio-ordering-swagger-ui-in-browser](images/abp-studio-ordering-swagger-ui-in-browser-v2.png) -> **Note:** If you have a swagger error on the UI, then you can open the `SampleAppService` class in the `ModularCrm.Ordering` project and add `[RemoteService(false)]` attribute to the `SampleAppService` class. With this attribute, the `SampleAppService` class will not be exposed as a remote service automatically but since there is a `SampleController` class in the `ModularCrm.Catalog` project, the `Catalog` API will be exposed as a remote service. +> If you don't see the Order API, you may need to re-build the entire solution. Right-click the `ModularCrm` under the `main` folder in the ABP Studio Solution Explorer panel and select the *Dotnet CLI* -> *Graph Build* command. This will ensure that all the modules and the main application are completely built. Expand the `POST /api/ordering/order` API and click the *Try it out* button. Then, create a few orders by filling in the request body and clicking the *Execute* button: