docker compose overlay file for editable frontend container (#1092)

Makefile

@@ -0,0 +1,26 @@
+FRONTEND_CONTAINER ?= spiffworkflow-frontend
+FRONTEND_DEV_OVERLAY ?= spiffworkflow-frontend/dev.docker-compose.yml
+
+dev-env:
+	docker compose -f docker-compose.yml \
+		-f $(FRONTEND_DEV_OVERLAY) \
+		build
+
+start-dev:
+	docker compose -f docker-compose.yml \
+		-f $(FRONTEND_DEV_OVERLAY) \
+		up -d
+
+stop-dev:
+	docker compose -f docker-compose.yml \
+		-f $(FRONTEND_DEV_OVERLAY) \
+		down
+
+fe-lint-fix:
+	docker exec -it $(FRONTEND_CONTAINER) npm run lint:fix
+
+fe-sh:
+	docker exec -it $(FRONTEND_CONTAINER) /bin/bash
+
+.PHONY: dev-env start-dev stop-dev \
+	fe-lint-fix fe-sh

spiffworkflow-frontend/dev.Dockerfile

@@ -0,0 +1,9 @@
+FROM node:20.8.1-bookworm-slim AS base
+
+WORKDIR /app
+
+COPY package.json package-lock.json .
+
+RUN npm i
+
+CMD ["npm", "run", "docker:start"]

spiffworkflow-frontend/dev.docker-compose.yml

@@ -0,0 +1,10 @@
+services:
+  spiffworkflow-frontend:
+    build:
+      context: spiffworkflow-frontend
+      dockerfile: dev.Dockerfile
+    environment:
+      HOST: "0.0.0.0"
+      PORT: "${SPIFFWORKFLOW_FRONTEND_PORT:-8001}"
+    volumes:
+      - ./spiffworkflow-frontend:/app

spiffworkflow-frontend/package.json

@@ -66,6 +66,7 @@
   },
   "scripts": {
     "start": "ESLINT_NO_DEV_ERRORS=true PORT=7001 craco start",
+    "docker:start": "ESLINT_NO_DEV_ERRORS=true craco start",
     "build": "craco build",
     "test": "react-scripts test --coverage",
     "t": "npm test -- --watchAll=false",