feat(ci): add runtime target to frontend Dockerfile

Also configures docker-compose to unambiguously use this Dockerfile and gives it an explicit target that lets the Dockerfile be the authoritative source of what base image to use but skips doing production builds in dev

Author: themightychris

docker-compose.yml

@@ -1,10 +1,10 @@
 ---
 services:
   app:
-    image: node:18-slim
     build:
       context: ./src/app
       dockerfile: Dockerfile
+      target: environment
     working_dir: /usr/local/src
     environment:
       - PORT=4321

src/app/Dockerfile

@@ -1,11 +1,30 @@
-FROM node:18-slim
-ARG HOME=usr/local/src/
-WORKDIR $HOME
+## Target: environment
+#
+# This initially-empty target provides an environment for docker-compose
+# to start from the same base as the production builder environment. Common
+# dependencies could be added here
+#
+FROM node:18-slim as environment
 
-COPY entrypoint.sh /entrypoint.sh
-RUN chmod +x /entrypoint.sh
 
-ADD . .
-ENTRYPOINT [ "/entrypoint.sh" ]
-CMD ["npm", "run", "dev", "--host"]
-EXPOSE 4321
+## Target: builder
+#
+# This target builds /src/dist with layers optimized for caching dependencies
+#
+FROM environment as builder
+WORKDIR /src
+
+COPY package*.json ./
+RUN npm ci
+
+COPY * ./
+RUN npm run build
+
+
+## Target: runtime
+#
+# This target provides an nginx web server wrapped around the static
+# website build from the builder target
+#
+FROM nginx:alpine as runtime
+COPY --from=builder /src/dist /usr/share/nginx/html