Nginx frontend not calling Nginx in backend

So I am using Django + react with nginx both on backend and frontend, containerized in docker. The following image will clarify how I want to serve the whole application:

enter image description here

Having been googling but couldn't make sense of the solutions. Issue is that Nginx in frontend not connecting with nginx on backend on port 8082.

Following are docker, nginx and docker-compose files.

Nginx configurations for frontend:

upstream react {
    server reactapp:3000;
}

server {
    listen 80;
    client_max_body_size 100M;
    proxy_set_header X-Forwarded-Proto $scheme;
    

    location / {
        root /usr/share/nginx/html;
    }   
    
    location /add-to-waiting/ {
        proxy_pass http://0.0.0.0:8082;
    }
}

Dockerfile for react and nginx for frontend:

# build environment
FROM node as build
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
COPY package.json ./
COPY package-lock.json ./
RUN npm i --silent
RUN npm install react-scripts@3.4.1 -g --silent
COPY . ./
RUN npm run build

# production environment
FROM nginx:stable-alpine
COPY --from=build /app/build /usr/share/nginx/html
EXPOSE 80
EXPOSE 443
CMD ["nginx", "-g", "daemon off;"]


docker-compose.yml for frontend:

services:
        frontend:
                build: .
                ports:
                        - "8090:80"
                container_name: irisfrontend

Nginx configurations for backend

upstream django {
    server website:8000;
}

server {
    listen 80;
    
    client_max_body_size 100M;
    proxy_set_header X-Forwarded-Proto $scheme;

    location / {
        proxy_pass http://django;
    }
    
    location /media/ {
        alias /app/media/;
    }

    location /static/ {
        alias /app/forex/static/admin/;
    }
}


Dockerfile for nginx in backend:

FROM nginx:1.19.0

COPY ./default.conf /etc/nginx/conf.d/default.conf

Dockerfile for gunicorn in backend:

FROM python:3


ADD requirements.txt /app/requirements.txt

ADD . /app
WORKDIR /app
EXPOSE 8000:8000

RUN pip install --upgrade pip && pip install -r /app/requirements.txt
RUN python manage.py collectstatic --no-input --settings=forex.settings.production

CMD ["gunicorn", "--bind", "0.0.0.0:8000", "--workers", "3", "forex.wsgi:application", "DJANGO_SETTINGS_MODULE=forex.settings.production"]

docker-compose.yml for backend:

services:
    db:
        build: ./db

    website:
        build:
          context: .
          dockerfile: Dockerfile.app
        env_file:
          - env
        container_name: website_container_8
        volumes:
          - static:/app/forex/static/admin/
        depends_on:
          - db  
    nginx:
        build: ./nginx
        volumes:
            - static:/app/forex/static/admin/
        ports:
            - "8082:80"
        depends_on:
            - website
volumes:
  static:

What changes do I need to make to successfully do a post request from frontend nginx to backend nginx?

Include a network for both containers so that they can communicate.

services: db: build: ./db

website:
    build:
      context: .
      dockerfile: Dockerfile.app
    env_file:
      - env
    container_name: website_container_8
    volumes:
      - 
static:/app/forex/static/admin/
    depends_on:
      - db  
networks:
  - nettest 

nginx:
    build: ./nginx
    volumes:
        - 
static:/app/forex/static/admin/
    ports:
        - "8082:80"
    depends_on:
        - website
networks:
  - nettest

volumes:
  static:


networks:
  nettest:
Back to Top