restructure repo, separate sample app from docker configs

06-building-container-images/client-react/Dockerfile

@@ -0,0 +1,14 @@
+# DEV Dockerfile
+
+FROM node:19.4-alpine
+
+WORKDIR /usr/src/app
+
+COPY package*.json ./
+
+RUN npm install
+
+COPY . .
+EXPOSE 5173
+
+CMD ["npm", "run", "dev"]

06-building-container-images/client-react/Dockerfile.0

@@ -0,0 +1,7 @@
+FROM node
+
+COPY . .
+
+RUN npm install
+
+CMD ["npm", "run", "dev"]

06-building-container-images/client-react/Dockerfile.1

@@ -0,0 +1,7 @@
+FROM node:19.4-bullseye
+
+COPY . .
+
+RUN npm install
+
+CMD ["npm", "run", "dev"]

06-building-container-images/client-react/Dockerfile.2

@@ -0,0 +1,14 @@
+FROM node:19.4-bullseye AS build
+
+# Specify working directory other than /
+WORKDIR /usr/src/app
+
+# Copy only files required to install
+# dependencies (better layer caching)
+COPY package*.json ./
+
+RUN npm install
+
+COPY . .
+
+CMD ["npm", "run", "dev"]

06-building-container-images/client-react/Dockerfile.3

@@ -0,0 +1,28 @@
+FROM node:19.4-bullseye AS build
+
+# Specify working directory other than /
+WORKDIR /usr/src/app
+
+# Copy only files required to install
+# dependencies (better layer caching)
+COPY package*.json ./
+
+# Use cache mount to speed up install of existing dependencies
+RUN --mount=type=cache,target=/usr/src/app/.npm \
+  npm set cache /usr/src/app/.npm && \
+  npm install
+
+COPY . .
+
+RUN npm run build
+
+# Use separate stage for deployable image
+FROM nginx:1.23-alpine
+
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+COPY --from=build usr/src/app/dist/ /usr/share/nginx/html
+
+EXPOSE 80
+
+# No CMD specified... will uses CMD/ENTRYPOINT from base image (nginx:1.23-alpine)

06-building-container-images/client-react/Makefile

@@ -0,0 +1,12 @@
+API_NODE_PATH:=../../05-example-web-application/api-node/
+
+N?=0
+.PHONY: build-N
+build-N:
+	docker build --file ./Dockerfile.$(N) -t api-node:$(N) ${API_NODE_PATH}
+
+.PHONY: build-all
+build-all:
+	for number in 0 1 2 3 ; do \
+			N=$$number $(MAKE) build-N; \
+	done

06-building-container-images/client-react/vite.config.js

@@ -0,0 +1,28 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react-swc';
+import dns from 'dns';
+
+dns.setDefaultResultOrder('verbatim');
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [react()],
+  server: {
+    proxy: {
+      '/api/golang': {
+        // TODO: Make this inside and outside of docker (e.g. localhost vs api-golang)
+        target: 'http://api-golang:8080',
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api\/golang/, ''),
+        secure: false,
+      },
+      '/api/node': {
+        // TODO: Make this inside and outside of docker (e.g. localhost vs api-node)
+        target: 'http://api-node:3000',
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api\/node/, ''),
+        secure: false,
+      },
+    },
+  },
+});