Docker compose - build property and volumes - docker

I created this docker-compose file based on my two images (front and back-end), both are running ok when I run docker-compose up.
The problem is that I want to make hot reload work properly for my frontend which is built upon react.
I tried many things but the properties volumes and build do not seem to be able to find my directories.
So, the directory for both projects are:
C:\Users\pwdie\Downloads\projects\typescript-api (api)
C:\Users\pwdie\Downloads\projects\frontend-api-consumer (front)
being "projects" for the root for both of them, and frontend-api-consumer containing the docker-compose.yml as the image shows.
Didn't understand that part of the docker-compose system, explanations will be well received.
Front Dockerfile
FROM node:17
WORKDIR /app
COPY package.json ./
RUN yarn
COPY ./ ./
EXPOSE 3000:3000
CMD ["yarn", "dev"]
Api Dockerfile
FROM node:17
WORKDIR /app
COPY package.json ./
RUN yarn
COPY . .
ENV DB_HOST=host.docker.internal
EXPOSE 5000:5000
CMD ["yarn", "dev"]
Docker-compose.yml
version: "3.8"
services:
api:
image: api
build: ../typescript_api
volumes:
- ../typescript_api:/var/app
environment:
DB_USER: postgres
DB_PASSWORD: postgres
DB_HOST: host.docker.internal
DB_PORT: 5432
DB_NAME: typescript_api
ACCESS_TOKEN_SECRET: 1c6c3296f699e051220674d329e040dee0abae986f62d62eb89f55dfa95bff1ac9b52731177e664e25bff9b6ce0eba6ec7a9b6cf7d03e94487dc03179dc31c7e
ports:
- "5000:5000"
front:
image: front
build: .
volumes:
- ./:/var/app
environment:
REACT_APP_MAPBOX_TOKEN: pk.eyJ1Ijoic291c2FkaWVnbzExIiwiYSI6ImNrdHEwbDRrdTBycTEycXBtbXZ5eXEzMm4ifQ.U58H7S1um_WcRC2rBoEuNw
REACT_APP_API_URL: http://localhost:5000
depends_on:
- api
ports:
- "3000:3000"

Related

Docker-compose with multi stage dockerfile is not creating images

I want to use single Dockerfile for my multiple services
I have docker file like below
FROM node:alpine as ui
WORKDIR /app/ui
COPY ./ui/package.json .
RUN npm install
COPY ./ui/ .
RUN npm run start
FROM node:alpine as server
WORKDIR /app/server
COPY ./server/package.json .
RUN npm install
COPY ./server/ .
RUN npm run start
FROM nginx as engine
EXPOSE 3000 5000 80
CMD ["nginx", "-g", "daemon off;"]
And yaml file looks like
version: "3.4"
services:
api:
build:
context: ./
target: server
volumes:
- /app/node_modules
- ./server:/app/server
environment:
- PGUSER=postgres
- PGHOST=postgres
- PGDATABASE=postgres
- PGPASSWORD=postgres_password
- PGPORT=5432
ui:
stdin_open: true
environment:
- CHOKIDAR_USEPOLLING=true
build:
context: ./
target: ui
volumes:
- /app/node_modules
- ./ui:/app/ui
postgres:
image: "postgres:latest"
environment:
- POSTGRES_PASSWORD=postgres_password
nginx:
depends_on:
- api
- ui
restart: always
volumes:
- ./nginx/dev.conf:/etc/nginx/conf.d/default.conf
build:
context: ./
target: engine
ports:
- "80:80"
Here , When I run docker-compose -f dev.yml up , nothing happens its not creating all the images, when i use seperate dockerfile for ui and api , its working fine , but for single dockerfile like i mentioned , its not creating any images.Can some one explain correct way to use multistage with dockercompose.
I trie to put nginx at top and it got struck at Building 0.0s (0/6)

How to run docker-compose in production

I have built a MEAN stack application with nginx front end.
I have 2 docker files - one for front end and one for back end
And I have a docker-compose file that pulls them together along with the database
This works great on my development machine
I then push the images to my dockerhub site
On my production ubuntu machine I pull the images that I want from my dockerhub repository
But how should I run them?
I transfer my docker-compose file to the server and try to run it:
docker-compose -f docker-compose.prod.yml up
but it complains that the folder structure isnt what I have on my dev machine:
ERROR: build path /home/demo/api either does not exist, is not accessible, or is not a valid URL.
I dont want to put all the code on the server and rebuild it.. surely that defeats the purpose of using dockerhub images?
I also need the docker compose file to pull in the .prod.env file for database credentials etc.
I know Im missing something here.
How do I run my images without rebuilding them from scratch?
Do I need another service for this?
Thanks in advance
docker-compose.prod.yml:
version: '3'
services:
# Database
database:
env_file:
- .prod.env
image: mongo
restart: always
environment:
# MONGO_INITDB_ROOT_USERNAME: root
# MONGO_INITDB_ROOT_PASSWORD: $DB_ADMIN_PASSWORD
# Create a new database. Please note, the
# /docker-entrypoint-initdb.d/init.js has to be executed
# in order for the database to be created
MONGO_INITDB_ROOT_USERNAME: root
MONGO_INITDB_ROOT_PASSWORD: $MONGO_INITDB_ROOT_PASSWORD
DB_NAME: $DB_NAME
DB_USER: $DB_USER
DB_PASSWORD: $DB_PASSWORD
MONGO_INITDB_DATABASE: $DB_NAME
volumes:
# Add the db-init.js file to the Mongo DB container
- ./mongo-init.sh:/docker-entrypoint-initdb.d/mongo-init.sh:ro
- /data/db
ports:
- '27017-27019:27017-27019'
networks:
- backend-net
# Database management
mongo-express:
image: mongo-express
restart: always
ports:
- 8081:8081
environment:
ME_CONFIG_MONGODB_ADMINUSERNAME: root
ME_CONFIG_MONGODB_ADMINPASSWORD: $MONGO_INITDB_ROOT_PASSWORD
ME_CONFIG_MONGODB_SERVER: database
depends_on:
- database
networks:
- backend-net
# Nodejs API
backend:
depends_on:
- database
env_file:
- .prod.env
build:
context: ./api
dockerfile: Dockerfile-PROD-API
# Note: put this container name into proxy.conf.json for local angular CLI development instead of localhost
container_name: node-api-prod
networks:
- backend-net
# Nginx and compiled angular app
frontend:
build:
context: ./ui
dockerfile: Dockerfile-PROD-UI
ports:
- "8180:80"
container_name: nginx-ui-prod
networks:
- backend-net
networks:
backend-net:
driver: bridge
DOCKERFILE-PROD-API:
#SERVER ========================================
FROM node:10-alpine as server
WORKDIR /app
# Install dependencies
COPY package*.json ./
RUN npm install
# Bundle app source
COPY . .
#RUN ls -lha
EXPOSE 3000
CMD ["npm", "run", "start"]
DOCKERFILE-PROD-UI:
#APP ========================================
FROM node:10-alpine as build
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install #angular/cli && npm install
COPY . .
RUN npm run build
#RUN ls -lha
#FINAL ========================================
FROM nginx:1.18.0-alpine
COPY --from=build /usr/src/app/dist /usr/share/nginx/html
COPY ./nginx.conf /etc/nginx/conf.d/default.conf
Using full image names including dockerhub path resolved the issue for me.
Working solution shown below:
Dockerfile-PROD-UI
#GET ANGULAR ========================================
FROM node:10-alpine as base
WORKDIR /usr/src/app
COPY ui/package*.json ./
RUN npm install #angular/cli && npm install
COPY ui/. .
#BUILD ANGULAR ========================================
FROM base as build
RUN npm run build
#RUN ls -lha
#NGINX ========================================
FROM nginx:1.18.0-alpine
COPY --from=build /usr/src/app/dist /usr/share/nginx/html
COPY ./nginx.conf /etc/nginx/conf.d/default.conf
Dockerfile-PROD-API
#SERVER ========================================
FROM node:10-alpine as server
WORKDIR /app
# Install dependencies
COPY package*.json ./
RUN npm install
# Bundle app source
COPY . .
#RUN ls -lha
EXPOSE 3000
CMD ["npm", "run", "start"]
docker-compose.yml
version: '3.5'
services:
# Database
database:
image: mongo
restart: always
env_file:
- .prod.env
environment:
# MONGO_INITDB_ROOT_USERNAME: root
# MONGO_INITDB_ROOT_PASSWORD: $DB_ADMIN_PASSWORD
# Create a new database. Please note, the
# /docker-entrypoint-initdb.d/init.js has to be executed
# in order for the database to be created
MONGO_INITDB_ROOT_USERNAME: root
MONGO_INITDB_ROOT_PASSWORD: $MONGO_INITDB_ROOT_PASSWORD
DB_NAME: $DB_NAME
DB_USER: $DB_USER
DB_PASSWORD: $DB_PASSWORD
MONGO_INITDB_DATABASE: $DB_NAME
volumes:
# Add the db-init.js file to the Mongo DB container
- ./mongo-init.sh:/docker-entrypoint-initdb.d/mongo-init.sh:ro
- db-data:/data/db
ports:
- '27017-27019:27017-27019'
networks:
- backend-net
# Nodejs API
backend:
image: DOCKERHUBHUSER/DOCKERHUB_REPO:prod-backend
restart: always
depends_on:
- database
env_file:
- .prod.env
build:
context: ./api
dockerfile: Dockerfile-PROD-API
container_name: backend
networks:
- backend-net
# Nginx and compiled angular app
frontend:
image: DOCKERHUBHUSER/DOCKERHUB_REPO:prod-frontend
restart: always
depends_on:
- backend
build:
context: .
dockerfile: Dockerfile-PROD-UI
ports:
- "8180:80"
container_name: frontend
networks:
- backend-net
networks:
backend-net:
driver: bridge
volumes:
db-data:
name: db-data
external: true

docker-compose doesn't refresh volumes on file changes

I am using Docker Toolbox on Windows 10 Home. I am not able to see the changes in my code on the docker-container.
My docker-compose.yml file looks like this
version: "3.7"
services:
flask:
build: ./flask
container_name: flask
restart: always
environment:
- APP_NAME=MyFlaskApp
expose:
- 8080
volumes:
- ./flask:/app
nginx:
build: ./nginx
container_name: nginx
restart: always
ports:
- "80:80"
And my Dockerfile looks like this
FROM python:3.7.2-stretch
# Set the working directory to /app
WORKDIR /app
# Copy the current directory contents into the container at /app
ADD . /app
# Install the dependencies
RUN pip install -r requirements.txt
# run the command to start uWSGI
CMD ["uwsgi", "app.ini"]
My folder structure is like this
-project
- flask
- app.ini
- Dockerfile
- requirements.txt
- run.py
-nginx
- Dockerfile
- nginx.conf
I'm pretty sure everything is in order here but I still can't make live changes to the server

Problem with img reference in docker-compose

Hello i tried to build docker-compose in my project with these structure file:
app/
-front-end/src/Components
-back-end/images
but when i run build i have these error with img relative url:
frontend_1 | Module not found: Can't resolve '../../../../../back-end/images'
And these is my docker-compose file:
version: '2'
services:
backend:
network_mode: host
build: ./back-end/
ports:
- "6200:6200"
volumes:
- ./back-end:/usr/src/app
frontend:
build: ./front-end/
ports:
- "3000:3000"
volumes:
- ./front-end:/usr/src/app
depends_on:
- backend
My frontend Dockerfile:
FROM node:10.15.3
RUN mkdir -p /usr/src/app
WORKDIR /TuKanasta
EXPOSE 3000
CMD ["npm", "start"]
the backend Dockerfile:
FROM node:10.15.3
RUN mkdir -p /usr/src/app
WORKDIR /TuKanasta
RUN npm install -g nodemon
EXPOSE 4000
CMD [ "npm", "start" ]
Note: My project run 100 % without docker.
volumes:
- ./back-end:/usr/src/app
...
volumes:
- ./front-end:/usr/src/app
If set in the same image, the second bind mount volume would overwrite the first /usr/src/app content, as illustrated in gladiusio/gladius-archive-node issue 4.
If set in two different images, /usr/src/app in frontend1 would not be able to see back-end, copied in /usr/src/app separate volume of backend service.
Declaring the volume as external might help, as illustrated in this thread.
Or copying into an existing volume (shown here)

How to include volumes in my docker configuration?

I have a docker-compose configuration for an MEAN app that's working fine.
I would like my angular (ng serve) and express servers (nodemon) to rerun automaticaly when I hit ctrl + s as if I was running my app in local.
For that, my containers need to be aware that the files changed.
How can I do that ?
Angular's Dockerfile :
FROM node:10
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY . ./
EXPOSE 4200
CMD ["npm", "start"]
Express's Dockerfile :
FROM node:6
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY . ./
EXPOSE 3000
CMD ["npm", "start"]
docker-compose.yml :
version: '3'
services:
angular: # name of the first service
build: client # specify the directory of the Dockerfile
ports:
- "4200:4200"
express: #name of the second service
build: server # specify the directory of the Dockerfile
ports:
- "3000:3000"
links:
- database
database: # name of the third service
image: mongo
ports:
- "27017:27017"
Both Angular and Express have an .dockerignore for node_modules
If you are in dev environment, you can add the volumes section in your docker-compose.yml as below :
services:
angular: # name of the first service
build: client # specify the directory of the Dockerfile
ports:
- "4200:4200"
volumes:
- /path/in/host/machine:/path/in/container
express: #name of the second service
build: server # specify the directory of the Dockerfile
ports:
- "3000:3000"
links:
- database
volumes:
- /path/in/host/machine:/path/in/container
database: # name of the third service
image: mongo
ports:
- "27017:27017"
Reference:
volumes in docker-compose

Resources