Dev environment doesn't work as expected

[shaneisrael]

Dev environment doesn't work as expected

[ShaneIsrael]

Why are you trying to navigate to it at 192.168.1.99:3000? That's why its not working, axios can't find the backend server because they run at localhost, not 192.168....

Follow the instructions, navigate to localhost:3000 which is where the FE lives and expects the BE which should be running at localhost:5000.

[AIndoria]

Follow the instructions

Please read again, especially points 1 and 3.

Why are you trying to navigate to it at 192.168.1.99:3000?

Because BOTH the backend and the frontend are hosted at that server. I'm running BOTH on my homeserver, which is 192.168.1.99. Both are running there, on the same device, on localhost, on 3000 and 5000.

because they run at localhost, not 192.168....

They're both running on localhost lol. It's not a case where the backend is running on a different device and frontend on different.

[ShaneIsrael]

Okay, what you are doing is running it in development mode. Which does not work with how you are trying to run it.

That is why the instructions specifically say to navigate to localhost:3000. It doesn't matter where you are running the BE or the FE if you are running it in development like you are. The FE and BE have to be accessed from the same machine they are running on via localhost.

If you run it on some other computer even if its on the same network, it will not work. It sounds to me like you are trying to run it in development to use it rather than develop on it since you do not have experience with Docker.

[AIndoria]

Okay, what you are doing is running it in development mode

Yes, I am aware.

It sounds to me like you are trying to run it in development to use it rather than develop on it since you do not have experience with Docker.

I have a docker instance running already, but I needed some other stuff which I was going to see if I could add. I was going to tinker with it, play around, see what I could do etc. Making assumptions about someone's ability is weird and I don't think called for.

If you run it on some other computer even if its on the same network, it will not work.

Interesting.

If I run x on :5000 that has an IP of 1.2.3.4 and y on :3000 that has an ip of 1.2.3.4 (i.e., the same machines), are they not both able to find each other using "localhost:port"? If so, if I access one of them via an outside machine, should it generally not be able to still find that other localhost instance that is on the same machine it is running on?

[ShaneIsrael]

If I run x on :5000 that has an IP of 1.2.3.4 and y on :3000 that has an ip of 1.2.3.4, are they not both unable to find each other using "localhost"?

Yes, because regardless of where the development servers are running, the web application is being loaded and run inside your browser. If you are on a different machine and accessing the web application it will generate an incorrect URL for the backend.

The web app will look at your address: 192.168.x.x:3000 and see that its not localhost and assume since its not localhost it must be running in a production environment. So it will try to access the backend at 192.168.x.x/api/ which doesn't work because it needs to know the port.

If you were running it at localhost, the web app would see that its running at localhost and try to access the backend at localhost:5000.

So the only way to use the application at an address like 192.168.x.x is if you run it in production mode where it's using nginx to proxy the traffic to the BE service running at localhost:5000.

You could try to run it with nginx, see ./run_local_nginx.sh, but that's only experimental and I can't guarantee that will work. I have it there for a very specific test I was doing.

[AIndoria]

Interesting. Thank you. I will try that.