Sync is one of the three available action of Docker's hot container replacement feature deciding what to happen with the container. It synchronizes the files with the host without stopping the container.
Prerequisites
- Installed Docker Compose version 2.22.0 or greater
If you already have Docker on your machine, please verify it's version:
docker compose version
Otherwise follow the official installation instructions.
Practical example
We have a containerized webserver that serves static content. We locally develop our static HTML/CSS webpage and want to see it getting served from the container. One solution could be the bind mount, but after Docker Compose 2.22 we have a more elegant way to do it.
The project looks like this (and available in GitHub):
.
├── docker-compose.yml
└── nginx
├── default.conf
├── Dockerfile
└── www
├── favicon.ico
├── index.css
├── index.html
└── index.js
The Dockerfile:
FROM nginx:1.27.2-alpine ADD ./www /etc/nginx/html COPY ./default.conf /etc/nginx/conf.d/default.conf
And finally the docker-compose.yml:
services:
nginx:
build: ./nginx
container_name: nginx
restart: always
ports:
- 80:80
- 443:443
develop:
watch:
- path: ./nginx/www
action: sync
target: /etc/nginx/html
Then run docker in develop mode:
docker compose watch
The next step is to edit the index.html file under nginx/www. I'm using nano for this purpose, because my project is already moved into my server machine:
nano nginx/www/index.html
After that you can see in the terminal the following:
Syncing "nginx" service after 1 changes were detected
You may also check the effect via your browser by entering the following URL:
http://<ip-of-your-server>
After you are done with developing, stop the process with Ctrl+C and run the following to remove the unused containers:
docker compose down
Thank you for reading! Keep coding!