How to run Unicorn and Webpack Dev Server together?

Question

Web development

Good day!
There is a project in Ruby. Works in docker on Unicorn. I would like to attach hot reload to the frontend of the project, for which you need to run the webpack dev server. I do it with Foreman.

# Procfile
frontend: yarn server # запускает dev server на 3000 порту
backend: bundle exec unicorn -c /app/config/unicorn/development.rb -E development

Actually, the dev server seems to start, but the pages do not open. This is logical, because the site is launched from under Unicorn + Nginx. And here's the problem: how to make them friends? If I make frontend and backend on the same port there will be a conflict and nothing will work. If on different ports (as it is now), then it does not work either. In addition, there is a port that is forwarded from the container to docker-compose (now this is also port 3000).

version: '3.4'
services:
  app:
    build:
      context: .
      dockerfile: Dockerfile.development
    ports:
      - 3000:8080
    links:
      - postgres
      - redis
      - elastic
    command: foreman start -e .env.development
    # все остальное, тома, окружение, т.п.

In general, how to be? How to run Foreman Unicorn + Nginx + Webpack Dev Server from under docker compose?
Thanks in advance.

Answer 1

Once you have such a sandwich. could have a location in nginx proxying to the dev server.