How to copy some data from one container to another container by docker-compose.yml

Question

Now I am developing a React application. For the deployment I want to use nginx as the web server. I have written a docker-compose file with two services (One for React app and another for nginx webserver). Usually nginx service needs only the 'build' folder from the react project.

Now my question is how can I copy the 'build' folder from the react container to the nginx container directory when the react container is running.

Please take a look on the Dockerfiles and the yaml file.

docker-compose.yaml

version: "3"
services:
  nginx-server:    
    image: nginx_server:dev
    container_name: nginx
    build:
      context: ./nginx
      dockerfile: Dockerfile
    restart: always   

    command: >
      sh -c "cp -R /build/ /var/www/html/"   // I want to do something like that


    volumes:
      - .:/react_app_server/nginx

    ports:
      - 80:80
    depends_on:
      - react-app
    networks:
      - server_network


  react-app:
    container_name: my_react_app
    build:
      context: .
      dockerfile: ./Dockerfile
    image: my_react_app:dev 
    tty: true
    volumes:
      - .:/react_app
    ports:
      - "1109:1109"
    networks:
      - frontend_network
    command: >
      bash -c "npm run-script build"

networks:
  frontend_network:
    driver: bridge
  server_network:
    driver: bridge


volumes:
  static-volume:

Dockerfile for React app

FROM node:10.16.3
RUN mkdir /app
WORKDIR /app
COPY . /app
ENV PATH /app/node_modules/.bin:$PATH
RUN npm install --silent
RUN npm install [email protected] -g --silent
RUN npm run-script build

Dockerfile for Nginx

FROM nginx:1.16.1-alpine
RUN rm /etc/nginx/conf.d/default.conf
COPY /prod.conf /etc/nginx/conf.d

Project Directory

My_React_App
    build
    nginx
        Dockerfile
        prod.conf
    node_modules
    public
    src
    .dockerignore
    docker-compose.yaml
    Dockerfile
    package-lock.json
    package.json
    README.md

Answer 1

You don't actually need to copy the data, rather making use of same volume should work.

You need to share a named volume between the two containers.

Your docker-compose.yaml should be:

version: "3"
services:
  nginx-server:    
    image: nginx_server:dev
    container_name: nginx
    |
    |
    volumes:
      - .:/react_app_server/nginx
      - app-volume:/var/www/html/
    |
    |
  react-app:
    container_name: my_react_app
    build:
      context: .
    |
    |
    volumes:
      - .:/react_app
      - app-volume:/path/to/build/folder/
    |
    |

NOTE: Here app-volume is a named volume which we are mounting at directory inside react-app container where the build folder is expected to get created. The same app-volume named volume is also mounted inside nginx container at /var/www/html/ where you want the build folder to get copied.

Also instead of named volume you can also mount same host directory in both the containers and share the data. -v /samepath/on/host:/path/to/build/folder and -v /samepath/on/host:/var/www/html.