Dockerized Create React App and Proxied Backend

client\.env.development

HOST=0.0.0.0
PROXY=http://localhost:3001

client\.env.development.local

DANGEROUSLY_DISABLE_HOST_CHECK=true

client\.eslintrc.json

{
  "extends": "react-app"
}

client\setupProxy.js

const proxy = require('http-proxy-middleware')
const target = process.env.PROXY

module.exports = app => target && app.use(proxy('/api/', { target }))
// app.use((req, res, next) =>
//   req.accepts('text/html') ? next() : proxy({ target })(req, res, next)
// )

client\tsconfig.json

{
  "compilerOptions": {
    "baseUrl": "src",
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "checkJs": false,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "lib": ["dom", "dom.iterable", "esnext"],
    "module": "esnext",
    "moduleResolution": "node",
    "noEmit": true,
    "noImplicitAny": false,
    "resolveJsonModule": true,
    "skipLibCheck": true,
    "strict": false,
    "target": "es5",
    "typeRoots": ["src/types", "node_modules/@types"]
  },
  "include": ["src"]
}

docker-compose.yml

version: '3.4'

services:
  backend:
    build:
      context: .
      dockerfile: ./docker/Dockerfile
      args:
        RUBY_VERSION: '2.6.3'
        BUNDLER_VERSION: '2.0.2'
    stdin_open: true
    tty: true
    command: bundle exec rails server -b 0.0.0.0 --port 3001
    volumes:
      - .:/app:cached
    ports:
      - '3001:3001'
    tmpfs:
      - /tmp

  client:
    image: node:12.7.0-alpine
    command: yarn start
    working_dir: /app
    ports:
      - '3000:3000'
    volumes:
      - ./client:/app:cached
      - node_modules:/app/node_modules
    environment:
      - NODE_ENV=${NODE_ENV:-development}
      - CHOKIDAR_USEPOLLING=true
    depends_on:
      - backend

volumes:
  node_modules: