Hi a newbie here… wanting to put my app to test production.
I have dockerize my app both react for front-end and Node/Express back-end… all my api’s are working but it seems that i cant reach my static folder to display images in the front-end via ("/", express.static(patch.join(__dirname, “/public”))). How can I tell caddy and route this static path. Thanks…
FRONT END:
caddyfile.production:
dev.xyz.com:443 {
root * /srv
route {
reverse_proxy /api* api-server:5000
try_files {path} {path}/ /index.html
file_server
}
}
}
Dockerfile.production #build file
First Stage
FROM node:latest AS builder
WORKDIR /usr/src/app
copy package.json to WORKDIR “.”
COPY ./package.json ./
RUN npm install
COPY . .
RUN npm run build
#Second Stage
Copy into Secondary Caddy Stage → webserver
FROM caddy:2.1.1-alpine
ARG CADDYFILE
COPY ${CADDYFILE} /etc/caddy/Caddyfile
COPY --from=builder /usr/src/app/build/ /srv
EXPOSE 80
EXPOSE 443
Docker:
docker build -t react-app-production --build-arg CADDYFILE=Caddyfile.production --build-arg BASE_URL=https://dev.xyx.com/api -f Dockerfile.production .
Backend:
Build File
ROM node:latest
WORKDIR /usr/src/app
coppy package.json to WORKDIR “.”
COPY ./package.json ./
RUN npm install
COPY . .
EXPOSE 5000
CMD [“npm”, “start”]
docker-compose.yml
version: “3”
services:
api-server:
image: api-server
restart: unless-stopped
ports:
- “5000:5000”
networks:
- prod
volumes:
- caddy-data:/data
- caddy-config:/config
react-app:
image: react-app-production
restart: unless-stopped
ports:
- “80:80”
- “443:443”
volumes:
- caddy-data:/data
- caddy-config:/config
networks:
- prod
networks:
prod:
driver: bridge
volumes:
caddy-data:
driver: local
caddy-config:
driver: local