Merge branch 'feature/update-images-to-spa'

AKS-TLS.md

@@ -60,4 +60,4 @@ Once the secret is installed you can install eShopOnContainers adding following
 
 ## Notes on TLS support
 
-TLS support can't be enabled on the local Kuberneted provided by Docker Desktop.
+TLS support can't be enabled on the local Kubernetes provided by Docker Desktop.

Explore-the-application.md

@@ -13,38 +13,48 @@ This page covers the exploration of the eShopOnContainers application and assume
 
 ## MVC Web app
 
-Open a browser and type <http://localhost:5100> and hit enter.
+Open a browser and type <http://host.docker.internal:5100> and hit enter.
 You should see the MVC application like in the following screenshot:
 
 ![](images/Explore-the-application/eshop-webmvc-app-screenshot.png)
 
 ### Authenticating and creating an order on the Web MVC app
 
-When you try the Web MVC application by using the url <http://localhost:5100>, you'll be able to test the home page which is also the catalog page. But if you want to add articles to the basket you need to login first at the login page which is handled by the STS microservice/container (Security Token Service). At this point, you could register your own user/customer or you can also use a convenient default user/customer named **demoUser@microsoft.com** so you don't need to register your own user and it'll be easier to explore.
+When you try the Web MVC application by using the url <http://host.docker.internal:5100>, you'll be able to test the home page which is also the catalog page. But if you want to add articles to the basket you need to login first at the login page which is handled by the STS microservice/container (Security Token Service). At this point, you could register your own user/customer or you can also use a convenient default user/customer named **demoUser@microsoft.com** so you don't need to register your own user and it'll be easier to explore.
 The credentials for this demo user are:
 
 - User: **demouser@microsoft.com**
 - Password: **Pass@word1**
 
-Below you can see the login page when providing those credentials.
+Below you can see the login page to provide those credentials from the MVC application.
 
 ![](images/Explore-the-application/login-demo-user.png)
 
 ## SPA Web app
 
-While having the containers running, open a browser and type `http://localhost:5104/` and hit enter.
+While having the containers running, open a browser and type `http://host.docker.internal:5104/` and hit enter.
 You should see the SPA application like in the following screenshot:
 
 ![](images/Explore-the-application/eshop-webspa-app-screenshot.png)
 
+When logging in from the SPA application the view has a different "branding" but the credentials are just the same as before.
+
+![](images/Explore-the-application/login-demo-user-spa.png)
+
 ## Swagger UI - REST API microservices - Catalog
 
-While having the containers running, open a browser and type `http://localhost:5101` and hit enter.
+While having the containers running, open a browser and type `http://host.docker.internal:5101` and hit enter.
 You should see the Swagger UI page for that microservice that allows you to test the Web API, like in the following screenshot:
 
 ![](images/Explore-the-application/swagger-catalog-1.png)
 
-Then, after providing the size (i.e. 10) and the current page (i.e. 1) for the data of the catalog, you can run the service hitting the "Try it out!" button and see the returned JSON Data:
+To explore the Swagger UI:
+
+1. Click on the `/api/v1/Catalog/items` endpoint
+2. Click on the `Try it out` button
+3. Click on the blue `Execute` button
+
+The you should see a view similar to the following, where you can see the JSON returned from the API:
 
 ![](images/Explore-the-application/swagger-catalog-2.png)
 

Explore-the-code.md

@@ -4,11 +4,11 @@ This page covers the exploration of eShopOnContainers' code base assumes you've
 
 > **CONTENT**
 
-- [Overview of the application code](#Overview-of-the-application-code)
-- [MVC Application (ASP.NET Core)](#MVC-Application-ASPNET-Core)
-- [SPA (Single Page Application)](#SPA-Single-Page-Application)
-- [Xamarin Mobile App (For iOS, Android and Windows/UWP)](#Xamarin-Mobile-App-For-iOS-Android-and-WindowsUWP)
-- [Additional resources](#Additional-resources)
+- [Overview of the application code](#overview-of-the-application-code)
+- [MVC Application (ASP.NET Core)](#mvc-application-aspnet-core)
+- [SPA (Single Page Application)](#spa-single-page-application)
+- [Xamarin Mobile App (For iOS, Android and Windows/UWP)](#xamarin-mobile-app-for-ios-android-and-windowsuwp)
+- [Additional resources](#additional-resources)
 
 ## Overview of the application code
 
@@ -23,7 +23,25 @@ The screenshot below shows the VS Solution structure for those microservices/con
 
 ![](images/Explore-the-code/vs-solution-structure.png)
 
-Finally, those microservices are consumed by multiple client web and mobile apps, as described below.
+In the image above you can see:
+
+1. The `src/ApiGateways/Envoy` folder, that contains the configuration `.yaml` file for the Envoy-implemented gateway.
+2. The `src/ApiGateways/Mobile.Bff.Shopping` and `src/ApiGateways/Web.Bff.Shopping` folders, with the HTTP aggregators.
+3. The `src/BuildingBlocks/EventBus` folder, that contains a simplified messaging abstraction, and implementations for **RabbitMQ** and for **Azure Service Bus**.
+4. The `src/Services/Basket` folder, with the Basket microservice. A simple CRUD data-driven microservice that uses Redis for persistence.
+5. The `src/Services/Catalog` folder, with the Catalog microservice. A simple CRUD data-driven microservice, that uses EF Core and SQL Server.
+6. The `src/Services/Identity` folder, with the Identity microservice. A Security Token Service (STS), based on [Identity Server 4](https://github.com/IdentityServer/IdentityServer4), that also uses SQL Server for persistence.
+7. The `src/Services/Ordering` folder, that's the home for several microservices:
+
+   - The core Ordering microservice, an advanced Domain Driven Design (DDD) microservice, that uses several DDD patterns and SQL Server for persistence.
+   - The Ordering Background Tasks microservice, that uses a `BackgroundService` for processing asynchronous tasks.
+   - The SignalR hub microservice, that works a as centralized hub, based on SignalR, to enable real-time notifications about the order process.
+
+8. The `src/Services/Payment` folder, with the Payment microservice, that simulates a simple payment gateway.
+9. The `src/Services/WebMVC` folder, with the MVC UI microservice, a traditional MVC web application.
+10. The `src/Services/WebSPA` folder, with the SPA UI microservice, an Angular-based SPA application.
+11. The `src/Services/WebStatus` folder, with the Web Status microservice, a health monitoring application, based on the open source [Xabaril/AspNetCore.DiagnosticsHealthChecks](https://github.com/Xabaril/AspNetCore.Diagnostics.HealthChecks) project.
+12. The `tests/ServiceTests` folder, with some inter-services integration tests.
 
 ## MVC Application (ASP.NET Core)
 

Windows-setup.md

@@ -3,7 +3,7 @@ This page covers the setup of your Windows development computer.
 > **CONTENT**
 
 - [Install Docker Desktop](#install-docker-desktop)
-- [Configure Docker](#configure-docker-desktop)
+- [Configure Docker Desktop](#configure-docker-desktop)
   - [Memory and CPU](#memory-and-cpu)
   - [Shared drives](#shared-drives)
 - [Configure local networking](#configure-local-networking)
@@ -135,14 +135,18 @@ After a few more seconds you should see something like this:
 
 ![](images/Windows-setup/running-2-eshoponcontainers.png)
 
-At this point you should be able to navigate to <http://localhost:5107/> and see the WebStatus microservice:
+At this point you should be able to navigate to <http://host.docker.internal:5107/> and see the WebStatus microservice:
 
 ![](images/Windows-setup/webstatus-eshoponcontainers.png)
 
-When all microservices are up (green checks) you should be able to navigate to <http://localhost:5100/> and see the Home Page of eShopOnContainers:
+When all microservices are up (green checks) you should be able to navigate to <http://host.docker.internal:5100/> and see the Home Page of eShopOnContainers:
 
 ![](images/Windows-setup/eshoponcontainers-homepage.png)
 
+You should also be able to navigate to <http://host.docker.internal:5104/> and see the Home Page of eShopOnContainers on the SPA application:
+
+![](images/Windows-setup/eshoponcontainers-spa-homepage.png)
+
 ## Explore the application
 
 You can now [explore the application](Explore-the-application) or continue with the optional Visual Studio setup.
@@ -215,6 +219,8 @@ Note that the first time you hit F5 it'll take more time, a few minutes at least
 
 Finally, because the docker-compose configuration project is configured to open the MVC application, it should open your by default browser and show the MVC application with data coming from the microservices/containers:
 
+**NOTE: Depending on your system configuration, starting up all containers and applying database migrations might take some time. If you get a 503 error (service unavailable) in the browser, just give it some more time and refresh, after little while you should get to see the home page.**
+
 ![](images/Windows-setup/vs2017-f5-with-eshoponcontainers-web-mvc-in-browser.png)
 
 Here's how the docker-compose configuration project is configured to open the MVC application: