Dockerized Angular/nginx app not talking to rest api

I have an angluar app for my frontend and I have a rest api listening on port 3001 (dockerized rails backend).

I was running my angular app with following command:

ng serve --proxy-config proxy.conf.json

And with following proxy.conf.json file:

{
   "/server": {
     "target": "http://localhost:3001",
     "secure": false,
     "pathRewrite": {"^/server" : ""}
   },
   "/api": {
      "target": "http://localhost:3001",
      "secure": false
   },
   "/base": {
      "target": "http://localhost:3001",
      "secure": false
   },
   "/users": {
      "target": "http://localhost:3001",
      "secure": false
   }
}

This works perfectly fine - my angular app runs on port 4200 and talks properly to my dockerized backend.

I now wanted to dockerize my front end too using nginx.

This is my dockerfile:

FROM node:8.9 as node

WORKDIR /app

COPY package.json /app/

RUN npm install
COPY ./ /app/

ARG env=prod

RUN npm run build -- --prod --environment $env

FROM nginx:1.13

COPY --from=node /app/dist/ /usr/share/nginx/html

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

EXPOSE 80

And my nginx-custom.conf looks like this:

server {
  listen 80;
  server_name  localhost;
  root   /usr/share/nginx/html;
  index  index.html index.htm;

  location /server {
      proxy_pass http://localhost:3001;
      proxy_next_upstream error timeout invalid_header http_500 http_502 http_503 http_504;
      proxy_buffering off;
      proxy_set_header Accept-Encoding "";
  }
  location /api {
      proxy_pass http://localhost:3001;
      proxy_next_upstream error timeout invalid_header http_500 http_502 http_503 http_504;
      proxy_buffering off;
      proxy_set_header Accept-Encoding "";
  }
  location /base {
      proxy_pass http://localhost:3001;
      proxy_next_upstream error timeout invalid_header http_500 http_502 http_503 http_504;
      proxy_buffering off;
      proxy_set_header Accept-Encoding "";
  }
  location / {
    try_files $uri $uri/ /index.html =404;
  }
}

I build by app with:

docker build -t client:prod .

And I start my app with:

docker run -p 80:80 client:prod

My Angular app is coming up on port 80 and I see my first screen as expected. But it doesnt talk to my rest api. In my browser I see my angular app sending html requests to 4200. I am not sure this is correct and the root cause? Since I am using nginx on port 80 - shouldnt the request from my angular app go to port 80 now?

I changed my nginx configuration to listen on port 4200 and started my dockerized app with port 4200:4200 but this doesnt work neither.

Any idea what could be wrong here?

Thanks, Michael