Sometimes, we want to add hot reloading with docker-compose
In this article, we’ll look at how to add hot reloading with docker-compose
How to use docker-compose to build multiple services?
To use docker-compose to build multiple services, we can create a Dockerfile for each service.
Then we create a docker-compose.yml to build each service with the Dockerfile for each service.
For instance, if we have the frontend and backend service in the frontend and backend folder respectively, then we create a docker-compose.yml in the root folder with
version: "3"
services:
frontend:
build: ./frontend
ports:
- "8091:8091"
backend:
build: ./backend
ports:
- "8090:8090"
volumes:
- ./backend:/usr/src/app
We set build to the folder with the Dockerfile we want to run.
ports map the port from the Docker container to the port exposed to the outside.
volumes map the folder in the project to the folder in the Docker container.
Mapping the volumes with volumes lets us add hot reloading.
In the frontend folder, we add a Dockerfile by writing
FROM node:lts-alpine
RUN npm install -g http-server
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
EXPOSE 8091
CMD [ "http-server", "dist", "-p 8091"]
to build the frontend container.
And in the backend folder, we add a Dockerfile by writing
FROM node:16
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
RUN npm i -g nodemon
COPY . .
EXPOSE 8090
CMD [ "nodemon", "-L", "server.js" ]
to build the backend container.
We use the -L option when running nodemon to let it watch for changes in mapped volumes.
And then we run docker-compose up to build both containers.
Conclusion
To use docker-compose to build multiple services, we can create a Dockerfile for each service.
Then we create a docker-compose.yml to build each service with the Dockerfile for each service.
