build(docker): Improve Docker image build (#37)

Changes:
- Use dockerize for templating environment variables in build assets
- Upgrade nodejs base image to 10
- Create docker-compose.yml
- Improve DX by optimizing build layers (faster local builds on changes)
- Use docker cache on travis (generally faster builds)

.dockerignore

@@ -1,4 +1,5 @@
-deploy/
-node_modules/
-tests/
-build/
+*
+!/src
+!/public
+!package.json
+!yarn.lock

Dockerfile

@@ -1,16 +1,38 @@
-FROM node:9-alpine
+FROM node:10-alpine
 
-ARG PUBLIC_URL=/admin
-ARG REACT_APP_API_URL=http://api.knit.pk.edu.pl
+ENV DOCKERIZE_VERSION v0.6.1
+RUN wget https://github.com/jwilder/dockerize/releases/download/${DOCKERIZE_VERSION}/dockerize-alpine-linux-amd64-${DOCKERIZE_VERSION}.tar.gz \
+    && tar -C /usr/local/bin -xzvf dockerize-alpine-linux-amd64-${DOCKERIZE_VERSION}.tar.gz \
+    && rm dockerize-alpine-linux-amd64-${DOCKERIZE_VERSION}.tar.gz
 
-ENV NODE_ENV production
-ENV PUBLIC_URL ${PUBLIC_URL}
-ENV REACT_APP_API_URL ${REACT_APP_API_URL}
+ENV NODE_ENV='production' \
+    PUBLIC_URL='{{{ .Env.PUBLIC_URL }}}' \
+    REACT_APP_API_URL='{{{ .Env.REACT_APP_API_URL }}}'
 
 WORKDIR /usr/src/app
+COPY package.json yarn.lock ./
+RUN yarn install
+
 COPY . /usr/src/app
 
-RUN yarn install
-RUN yarn build
+# Build and create template files for dockerize
+RUN yarn build && \
+    ASSETS_VERSION=$(cat build/asset-manifest.json | grep "\"main.js\"" | sed -E "s/\s+\"main.js\": \"static\/js\/main\.(.*)\.js\",/\1/") && \
+    cp build/index.html build/index.html.tmpl && \
+    cp build/service-worker.js build/service-worker.js.tmpl && \
+    cp build/static/js/main.$ASSETS_VERSION.js build/static/js/main.$ASSETS_VERSION.js.tmpl && \
+    cp build/static/js/main.$ASSETS_VERSION.js.map build/static/js/main.$ASSETS_VERSION.js.map.tmpl
+
+# Set environment variables in build files provided via --build-args using dockerize
+# Remarks: You can also use bellow code in your derrived Dockerfile to change app's environment variables
+ARG ADMIN_PUBLIC_URL='/admin'
+ARG ADMIN_API_URL='http://api.knit.pk.edu.pl'
+ENV PUBLIC_URL=${ADMIN_PUBLIC_URL} \
+    REACT_APP_API_URL=${ADMIN_API_URL}
 
-# Note: Image is used only for building
+RUN ASSETS_VERSION=$(cat build/asset-manifest.json | grep "\"main.js\"" | sed -E "s/\s+\"main.js\": \"static\/js\/main\.(.*)\.js\",/\1/") && \
+    dockerize -delims "{{{:}}}" \
+      -template build/index.html.tmpl:build/index.html \
+      -template build/service-worker.js.tmpl:build/service-worker.js \
+      -template build/static/js/main.$ASSETS_VERSION.js.tmpl:build/static/js/main.$ASSETS_VERSION.js \
+      -template build/static/js/main.$ASSETS_VERSION.js.map.tmpl:build/static/js/main.$ASSETS_VERSION.js.map

deploy/docker-app-push.sh

@@ -5,7 +5,10 @@ DOCKER_TAG=$(echo ${TRAVIS_TAG} | sed -E 's~^v(.*)~\1~')
 # Docker Hub
 echo "${DOCKER_PASSWORD}" | docker login -u "${DOCKER_USERNAME}" --password-stdin
 
+docker pull knitpk/api-admin:latest
+
 docker build . \
+    --cache-from knitpk/api-admin:latest \
     --tag knitpk/api-admin:${DOCKER_TAG} \
     --tag knitpk/api-admin:latest
 

docker-compose.yml

@@ -0,0 +1,11 @@
+version: '3.6'
+services:
+    api-admin:
+        image: knitpk/api-admin:latest
+        build:
+            context: .
+            cache_from:
+                - knitpk/api-admin:latest
+            args:
+                - APP_PUBLIC_URL='/admin'
+                - APP_API_URL='localhost'

package.json

@@ -1,7 +1,7 @@
 {
   "name": "knit-api-admin",
   "description": "ApiPlatform Admin Client for KNIT Rest API",
-  "version": "0.4.1-dev",
+  "version": "0.4.2-dev",
   "homepage": "http://api.knit.pk.edu.pl/admin",
   "private": true,
   "dependencies": {