8

I have a react app running on localhost port 3000 but instead of using localhost:3000 I would like to set a custom domain name to mydomain.com. I did already the change in the windows host file to

127.0.0.1 mydomain.com

but I guess I have to specify in my react app to look into this domain instead of localhost. How can I do this?

I tried : "start": "set HOST=videowall.com && set PORT=3006 && react-scripts start",

but it is returning Error: getaddrinfo ENOTFOUND videowall.com

Ernesto
  • 173
  • 1
  • 2
  • 11
  • duplicate of https://stackoverflow.com/questions/51146086/how-can-i-develop-locally-using-a-domain-name-instead-of-localhost3000-in-the – Rachel Nicolas Apr 28 '20 at 17:05

5 Answers5

17

You need add this line to your hosts file:

  • Unix/Linux : /etc/hosts
  • Windows: C:\Windows\System32\Drivers\etc\hosts
127.0.0.1 videowall.com

NOTE: If you need access this out of your development machine like me change 127.0.0.1 to 0.0.0.0.

Use .env file in root of your React project instead of export/set envs, with this content:

HOST='videowall.com'
PORT=3006

That's it.

Mamrezo
  • 1,309
  • 16
  • 20
  • 1
    This worked for me, but I had to delete the single quotes around the host name. So: HOST=videowall.com – majorobot Apr 01 '21 at 14:34
  • Is there a way to do just videowall.com and not videowall.com:3000? I also do not want to run on default server root 80 on which apache runs. – Arvind K. May 26 '22 at 12:43
  • 1
    @ArvindK. For production, you can set your env's in the `.env.production` file with `PORT=80` just for the `npm run build` but in development, by the `npm run start` you cannot bind port numbers below `1024` – Mamrezo May 26 '22 at 13:23
5

Make the following change in your package.json file

"start": "HTTPS=true HOST=mycompany.com PORT=3001 react-scripts start",

Abe Zafar
  • 51
  • 1
  • 2
2

In general create-react-app does assume it is hosted at the server root. If you would like to modify this behaviour, please refer to the create react app documentation for relative paths. You can specify it in your package.json under homepage.

"homepage": "http://mywebsite.com/relativepath",

As of your description of the error I suggest that modifying your host file should be fine. You should check that the domain locally resolves to the correct IP.

On mac/unix try traceroute mydomain.com On windows try tracert mydomain.com

Julian Kleine
  • 1,539
  • 6
  • 14
1

Add following link in your host file

Windows: C:\Windows\System32\Drivers\etc\hosts

Linux: /etc/hosts

127.0.0.1 mydomain.local
127.0.0.1 subdomain.mydomain.local

Add HOST in .env file

// ..
HOST=mydomain.local
// ..

Run React App

npm run start

Visit: mydomain.local

GMKHussain
  • 3,342
  • 1
  • 21
  • 19
0

If you are using webpack there is a property in devServer that is called host, you can change the hostname of the app there.

Ricardo Gonzalez
  • 1,827
  • 1
  • 14
  • 25