Simple react application Docker image

docker-entrypoint.sh

#!/bin/bash

set -e

cat <<EOF >>/usr/share/nginx/html/__ENV.js
window.__ENV = {
  "REACT_APP_PUBLIC_URL":"${REACT_APP_PUBLIC_URL:-''}",
  "REACT_APP_ADMIN_URL":"${REACT_APP_ADMIN_URL:-'/admin'}",
  "REACT_APP_API_BASE_URI":"${REACT_APP_API_BASE_URI:-'/api'}",
  "REACT_APP_GRAPHQL_URI":"${REACT_APP_GRAPHQL_URI:-'/graphql'}",
  "REACT_APP_UPLOAD_URI":"${REACT_APP_UPLOAD_URI:-'/files'}",
  "REACT_APP_BROADCAST_URI":"${REACT_APP_BROADCAST_URI:-'/socket.io'}",
};
EOF

nginx -g "daemon off;"

Dockerfile

FROM node:16-alpine3.16 as build

WORKDIR /app

COPY package.json /app/package.json
COPY yarn.lock /app/yarn.lock

RUN yarn install --silent

COPY . /app
RUN cp .env.build .env \
  && yarn react-env \
  && yarn build

FROM nginx:1.17

WORKDIR /usr/share/nginx/html

COPY --from=build /app/build /usr/share/nginx/html
COPY docker/nginx.conf /etc/nginx/conf.d/default.conf

EXPOSE 80

COPY ./docker/docker-entrypoint.sh /usr/local/bin/entrypoint.sh
ENTRYPOINT ["/usr/local/bin/entrypoint.sh"]
RUN chmod +x /usr/local/bin/entrypoint.sh

nginx.conf

server_tokens off;

server {
  listen 80;

  location / {
    root   /usr/share/nginx/html;
    index  index.html index.htm;
    try_files $uri $uri/ /index.html;
  }

  error_page   500 502 503 504  /50x.html;

  location = /50x.html {
    root   /usr/share/nginx/html;
  }
}