This one was a pain. So your react app is hosted on localhost:3000 and your node backend is on localhost:3001. This isn’t a problem if you a developing locally. You open up your browser and everything connects perfectly. But if you are developing on a cloud ide or vps, you are probably connecting to something like someweirdname.cloudidename.com.
By itself, running npm start will give you your project nicely. But once you have a backend that your browser isnt accessing locally, you might get the dreaded “Invalid Host Header”
Here is how I fixed my problem:
File: package.json add the following: where the value is your ide host name
.env.development.local <- thats DOT ENV DOT DEVELOPMENT DOT LOCAL , I spent a good while troubleshooting because of the missing DOT, add the following:
The above is not recommended if you are developing locally, but its a cloud ide.