Docker compose for development splitting web and api service containers - recommendation needed

Docker Engine Compose
1

I’ve been looking for a good way to spin up a development environment with docker compose that allows for separate web and api service containers so that the web application can call into the api service over http.

Requirements:

  1. I would like the set up to be dead simple so that developers just run compose ‘build’ and then ‘up’ without having to muck about with their local machine configuration on mac and linux.

  2. all configuration is passed through environment variables both on the api server and in the web application (eg. we are transferring a subset of the the environment variables verbatim into the web application’s javascript). In production, the environment variables would be set to actual services instead of references to services from the docker compose file.

Here’s our current docker-compose.yml:

version: "2"
services:
  admin_web:
    image: app/admin-web:development
    build:
      context: ./admin-web
      dockerfile: Dockerfile.development
    volumes:
        - ./admin-web:/home/nodejs/app
    ports:
      - "3000:3000"
    links:
      - admin_api
    environment:
      - ADMIN_API_URL=http://admin_api:3001

  admin_api:
    image: app/admin-api:development
    build:
      context: ./admin-api
      dockerfile: Dockerfile.development
    volumes:
        - ./admin-api:/home/nodejs/app
    ports:
      - "3001:3000"

Using ADMIN_API_URL from the web app, the problem is that because the http calls from the web application are being made from the browser, the network aliasing to admin_api doesn’t resolve using the networking aliases set up by docker.

Any recommendations for our development environment given the requirements of 1) zero additional developer machine configuration 2) using environment variables?

Thank you in advance!