Skip to content

04. Setting eShopOnContainer solution up in a Mac, VS for Mac or with CLI environment (dotnet CLI, Docker CLI and VS Code)

Cesar De la Torre edited this page Aug 29, 2018 · 44 revisions

Global prerequisites

Docker for Mac

Install Docker for Mac. The stable channel is fine.

.NET Core SDK

Make sure you have the latest '.NET Core 2.1 SDK' installed from: https://www.microsoft.com/net/download

Configure Docker for Mac

Docker for Mac (Linux VM) memory assigned

The SQL Server image for Docker requires more memory to run. You will need to update your Docker settings to allocate at least 4 GB of memory:

image

Depending on how many apps you are running in your Mac you might need to assign more memory to Docker in the Mac. Usually, 4GB should suffice, but we got feedback from devs who needed to assign up to 8GB of ram to Docker in the Mac.

Folder shares in Docker for Mac

If your projects are placed within the /Users folder, you don't need to configure anything additional, as that is a pre-shared folder. However, if you place your projects under a different path, like /MyRootProjects, then you'd need to add that shared folder to Docker's configuration.

If using Visual Studio for Mac, it is also important that you share the folder /usr/local/share/dotnet, like here:

image

Docker Multi-stage support

Since December 2017, eShopOnContainers supports Docker Multi-stage, therefore, the steps in order to compile the .NET apps/projects before creating the Docker images can now be performed with a single command based on "docker-compose build" or "docker build".

Option A: Use a CLI environment (dotnet CLI, Docker CLI with the bash shell) and VS Code as plain editor

As a summary, with the following simple CLI commands in a bash window you'll be able to build the Docker images and deploy the containers into your local Docker host:

$ git clone https://github.com/dotnet-architecture/eShopOnContainers.git
$ cd eShopOnContainers
$ docker-compose build
$ docker-compose up

The docker-compose build is in reality optional because if you run the docker-compose up command and you don't have the Docker images built, Docker will run the docker-compose build under the covers. But splitting the commands in two makes it clearer for you to know what it is doing.

The following explanations show you in detail how you should set it up, build and deploy.

Prerequisites

  1. Docker for Mac. You should already have this.
  2. A Git client. The git-scm site maintains a great list of clients.
  3. (OPTIONAL) NPM installed with Node.js. The stable channel is fine as well.
  4. (OPTIONAL) Bower ($ sudo npm install -g bower) needed by the MVC web app.
  5. .NET Core and SDK. Install the SDK and runtime.

(OPTIONAL) Installation of NPM/Node, Bower and .NET Core SDK on the local Mac is not required when using Docker Multi-Stage

The SDKs and dependencies like NPM, Bower and even .NET Core SDK are optional because when building through Docker Multi-Stage it will be using the dependencies available within the ASP.NET Core build image container instead of the installed software on the local machine/Mac. However, if you will be developing .NET apps in the Mac or customizing eShopOnContainers, it is recommended to install all the dependencies locally, as well.

Compile the application's projects and build the Docker images with a single command thanks to Docker Multi-Stage

The recommended approach is to build the .NET application/microservices bits and Docker images with a single command based on Docker Multi-Stage by simply running the following commands within the solution's root folder:

Move to the root folder of the solution:

cd YourPath\eShopOnContainers\

Then, run the following docker command:

docker-compose build

image

The first time you run this command it'll take some more additional time as it needs to pull/download the aspnet-build image with the SDKs, so it'll take its time.

It should take a few minutes to compile all the .NET Core projects plus the SPA application (Angular/TypeScript/JavaScript) which has additional processes and dependencies using NPM.

  • When the docker-compose build command finishes, you can check out with Docker CLI the images created by typing in Bash the following Docker command:

docker images

image

Those Docker images you see are the ones you have available in your local image repository in your machine. You might have additional images, but at least, you should see the the custom images starting with the prefix "eshop" which is the name of the image repo. The rest of the images that are not starting with "eshop" will probably be official base-images like the microsoft/aspnetcore or the SQL Server for Linux images, etc.

Deploy the containers into the local Docker host

With a single command you can deploy the whole solution into your local Docker host by just executing the following:

docker-compose up

image

Ignore the warnings about environment variables for Azure, as that is only needed if you were using infrastructure services in Azure (Azure SQL Database, Redis as a service, Azure Service Bus, etc.) which is the "next step" when using eShopOncontainers.

Note that the first time you try to run the application (with docker run or docker-compose) it detects that it needs a few related infrastructure images, like the SQL Server image, Redis image, RabbitMQ image, etc. so it will pull or download those base images from the Internet, from the public repo at the Docker registry named DOCKER HUB, by pulling the "microsoft/mssql-server-linux" which is the base image for the SQL Server for Linux on containers, and the "library/redis" which is the base Redis image, and so on. Therefore, the first time you run "docker-compose up" it might take a few minutes pulling those images before it spins up your custom containers.

Finally, you can see how the scripts waits after deploying all the containers:

image

  • The next time you run "docker-compose up" again, because you already have all the base images downloaded and registered in your local repo and your custom images built and ready to go, it'll be much faster since it just needs to deploy the containers.

  • Check out the containers running in your Docker host: Once docker-compose up finishes, you will have the original bash window busy and showing the execution's output in a "wait state", so in order to ask to Docker about "how it went" and see what containers are running, you need to open a second bash window and type "docker ps" so you'll see all the running containers, as shown in the following screenshot.

Type docker ps

image

How to run/test the application

Basically, at this point you can test the app with a browser at http://localhost:5100.

For further apps and tests, check the last section of this post named "Running/testing the application" so you see how to run the multiple apps and services in the browser.

Option B: Use Visual Studio for Mac

The quickest path to get eShopOnContainers running on your Mac is by using VS for Mac which will install most of the pre-requisites you need.

Prerequisites

  1. Docker for Mac. (You should already have this installed)
  2. Visual Studio for Mac.

Install Visual Studio for Mac

When installing Visual Studio for Mac, you can select between multiple workloads or platforms.

Make sure you select the .NET Core platform:

image

Before completing the VS for Mac installation, it will demand you to install XCode, that is needed for multiple dependencies.

If you install Android as a target platform, Java will also be installed as a dependency for building mobile apps for Android.

For running just the Docker containers and web apps, you'd just need the .NET Core platform.

But if you want to try the eShopOnContainers mobile app, that requires Xamarin and therefore, the iOS and Android platforms, too. Those mobile platforms are optional for this Wiki walkthrough, though.

Clone the eShopOnContainers repo

Open a bash shell and run the following command:

$ mkdir MyGitRepos
$ cd MyGitRepos
$ git clone https://github.com/dotnet-architecture/eShopOnContainers.git
$ cd eShopOnContainers

With that, you'll have the code at /Users/yourUser/MyGitRepos/eShopOnContainers folder.

Open the 'eShopOnContainers-ServicesAndWebApps.sln' solution with VS for Mac

Run Visual Studio for Mac and open the solution eShopOnContainers-ServicesAndWebApps.sln.

If you just want to run the containers/microservices and web apps, do NOT open the other solutions, like eShopOnContainers.sln as those solutions will also open the Xamarin projects and that might slow you down when testing due to additional dependencies in VS.

After opening the eShopOnContainers-ServicesAndWebApps.sln solution for the first time, it is recommended to wait for a few minutes as VS will be restoring many NuGet packages and the solution won't be able to compile or run until it gets all the nuGet packages dependencies, in the first place (this time is only needed the first time you open the solution. Next times it is a lot faster).

This is VS for Mac with the eShopOnContainers-ServicesAndWebApps.sln solution.

image

Run eShopOnContainers from VS for Mac (F5 or Ctrl+F5)

Make sure that the by default start-up project is the Docker project named docker-compose.

Hit Ctrl+F5 or press the "play" button in VS for Mac.

IMPORTANT: The first time you run eShopOnContainers, it will take longer than the next time you launch it. Under the covers, Docker is pulling quite a few "heavy" images from Docker Hub (the public image registry), like the SQL Server image, Redis image, RabbitMQ image and the base ASP.NET Core images. That pull/download process will take a few minutes. Then, VS will launch the application custom containers plus the infrastructure containers (SQL, Redis, RabbitMQ and MongoDB), populate sample data in the databases and finally run the microservices and web apps on custom containers.

Note that you will see normal/controlled Http exceptions caused by our retries with exponential backoff, as the web apps have to wait until the microservices are ready for the first time which need first to run SQL sentences populating sample data, etc.

Once the solution is up and running, you should be able to see it in the browser at:

http://localhost:5100

image

If you open a bash window, you can type docker images and see the pulled/downloaded images plus the custom images created by VS for Mac:

image

And by typing docker ps you can see the containers running in Docker. The infrastructure containers like SQL, Redis, RabbitMQ plus the custom containers running Web API microservices and the web apps.

image

IMPORTANT: In order to have the full app working, like being able to login with a user and add items to the basket and create orders, or being able to consume the services from a remote Xamarin or web SPA, you need to configure additional steps for the app, like the IP to be used by the Identity Service because it needs to be redirected, etc. - Check the additional configuration at the end of this post.

Running/testing the application

Once the containers have launched, open a browser and navigate to http://localhost:5100 to visit the MVC application:

image

You can also try/test the SPA (Single Page Application), which is based on Angular, by running this URL in a browser: http://localhost:5104

image

Here you can see all the URLs for the multiple apps and services:

- MVC web app: `http://localhost:5100`
- SPA web app: `http://localhost:5105`
- Health Status web app: `http://localhost:5107`
- Catalog Microservice API: `http://localhost:5101`
- Ordering Microservice API: `http://localhost:5102`
- Basket Microservice API: `http://localhost:5103`
- Identity Microservice API: `http://localhost:5105`
- Payment API: `http://localhost:5108`
- Marketing API: `http://localhost:5110`
- Locations API: `http://localhost:5109`

To add items to the shopping cart or check out, you'll need to login to the site. The credentials for a demo user are:

Configuring the app for Authentication and access from remote client apps (Remote access through the network)

If you don't configure these further settings, you should get the following error when trying to login in the MVC web app.

image

That is because the by default IP used to redirect to the Identity service/app used by the application (based on IdentityServer4) is the IP 10.0.75.1. That IP is always set up when installing Docker for Windows in a Windows 10 machine. It is also used by Windows Server 2016 when using Windows Containers.

eShopOnContainers uses that IP as the "by default choice" so anyone testing the app don't need to configure further settings. However, that IP is not used by "Docker for Mac", so you need to change the config.

If you were to access the Docker containers from remote machines or mobile phones, like when using the Xamarin app or the web apps in remote PCs, then you would also need to change that IP and use a real IP from the network adapter.

Setting up the docker-compose file environment variables and settings

As explained here by Docker, the Mac has a changing IP address (or none if you have no network access). From June 2017 onwards our recommendation is to connect to the special Mac-only DNS name docker.for.mac.localhost which will resolve to the internal IP address used by the host.

In the docker-compose.override.yml file, replace the IdentityUrl environment variable (or any place where the IP 10.0.75.1 is used) with:

   IdentityUrl=http://docker.for.mac.localhost:5105

You could also set your real IP at the Mac's network adapter. But that would be a worse solution as it'll depend on the network you are connecting your Mac development machine..

Therefore, the WebMVC service definition at the docker-compose.override.yml should finally be configured as shown bellow:

 webmvc:
   environment:
     - ASPNETCORE_ENVIRONMENT=Development
     - ASPNETCORE_URLS=http://0.0.0.0:80
     - CatalogUrl=http://catalog.api
     - OrderingUrl=http://ordering.api
     - BasketUrl=http://basket.api
     - LocationsUrl=http://locations.api
     - IdentityUrl=http://docker.for.mac.localhost:5105
     - MarketingUrl=http://marketing.api                
     - CatalogUrlHC=http://catalog.api/hc
     - OrderingUrlHC=http://ordering.api/hc
     - IdentityUrlHC=http://identity.api/hc               
     - BasketUrlHC=http://basket.api/hc
     - MarketingUrlHC=http://marketing.api/hc
     - PaymentUrlHC=http://payment.api/hc
     - UseCustomizationData=True
     - ApplicationInsights__InstrumentationKey=${INSTRUMENTATION_KEY}
     - OrchestratorType=${ORCHESTRATOR_TYPE}
     - UseLoadTest=${USE_LOADTEST:-False}
   ports:
     - "5100:80"

If you re-deploy with docker-compose up, now the login page should work properly, as in the screenshot below.

NOTE: For some reason, if using SAFARI browser, it cannot reach docker.for.mac.localhost but using Chrome in Mac, it works with no issues. Since the usage of docker.for.mac.localhost is just for development purposes, just use Chrome for tests.

image

Configuring the app for external access from remote client apps

If using the services from remote apps, like the a phone with the Xamarin mobile app in the same Wifi network, or the web apps accessing remotely to the Docker Host, you need to change a few by-default URLs.

eShopOnContainers app uses the .env file to set certain by-default environment variables used by the multiple docker-compose.override you can have.

Therefore, the following change must be done in the .env file at the root of the eShopOnContainers folder. If you don't see the .env file, run the following command and re-start the Finder:

   $ defaults write com.apple.finder AppleShowAllFiles TRUE

   $ killall Finder

Then, edit the .env file (with VS code, for instance) and change the ESHOP_EXTERNAL_DNS_NAME_OR_IP variable, and instead of using "localhost" as value, set a real IP or a real DNS name:

 `
    ESHOP_EXTERNAL_DNS_NAME_OR_IP=192.168.0.25
 `

or ESHOP_EXTERNAL_DNS_NAME_OR_IP=myserver.mydomain.com This is something you'll want to do if deploying to a real Docker Host, like in a VM in Azure, where you can use a DNS name for that.

Sending feedback and pull requests

We'd appreciate to your feedback, improvements and ideas. You can create new issues at the issues section, do pull requests and/or send emails to eshop_feedback@service.microsoft.com

Questions

[QUESTION] Answer +1 if the solution is working for you on the Mac: https://github.com/dotnet/eShopOnContainers/issues/107

You can’t perform that action at this time.