net::ERR_NAME_NOT_RESOLVED when calling dockerized backend and frontend from browser

Thank you for the explanation.

So you are basically using Docker to avoid having to pull the code on the server. This is not what Docker is for. You still have to configure your application for the environment. With Docker, you will push the Docker image to a registry and pull the image on the server from the registry, but the image has to support parameters so you can use different parameters in development mode and in production.

You would need a CI/CD process (Continues Intergation / Continues Deployment) that works like this:

  • Push your code to Git
  • Configure a hook on the Git server or configure CI/CD service to periodically check new code so the CI/CD server can build your image, push it to a Docker registry and start the deployment process on the server, which means replacing the image with the new one and if necessary, changing some parameters
  • Wait some seconds / minutes and see your app deployed on the remote server.

This would not be very different without Docker.

Since you are using Docker Compose, instead of the above process, you could have two different compose files. You would need to create those only once as long as the parameters don’t change andjust change the image on the remote when you feel it is ready to publish. Then run docker compose up -d so it downloads the new image and recreates the containers.

I show why I was confused

So I bsically ignored your nginx proxy config as it seemed you didn’t use it, instead of telling you you should. Your proxy listens on port 80 and port 443. so you don’t have to use port 3000 anymore and you don’t need the ports section in the compose file for the backend and the frontend.

Your frontend should be on http://localhost and your backend on http://localhost/api. So your frontend just has to send the request from the browser to the api path whihc means /api regardless of what the domain is. But you can also parse the URL in the frontend JS and gt the protocol and domain from it if you want to.