Menu
I have been developing a small app with create-react-app and a few other libraries i added. Given the planned architecture and some tests i'd like to run with react-router, i would like to be able to run my app locally using a domain mame in the url, so that instead of
localhost:3000/
it would be
somedomain.com
I have tried a few things like ejecting ceate-react-app but im not sure how to modify the webpack config to change the public path, or how to set up some sort of proxy on my machine so somedomain.com would be equivalent to typing localhost:3000
I'm not sure what the correct approach is and i cant seem to find any reliable information yet.
207
In ReactJS, the easiest way to alter the port number is by setting an environment variable named PORT to the desired number via the terminal. As an example, here we change the port number to 5000. your local server will run on port 5000.
localhost is the address which denotes to 0.0. 0.0 or 127.0. 0 and it chose the port 3000 you can configure it to other ports too. So, when you type http://localhost:3000 in the addressbar of the browser you can see the first page hosted from your app.
localhost is a top-level domain reserved for documentation and testing purposes. While accessing the domain, a loopback is triggered. If you access “http://localhost” in the browser, the request will not be forwarded to the internet through the router. It will instead remain in your own system.
As well as changing your /etc/hosts as advised above, if you want CRA to know about the new host name, the HOST env var should give you what you want.
E.g. (this can go into your package.json under scripts/start)
HOST=somedomain.com react-scripts start
That should start your CRA-based dev server, listening at that domain name, and it should open/refresh a browser tab pointing there.
Edit: docs on this and other env vars that CRA uses.
181
Combining some of the other answers:
Step 1: on your local machine add this line to your etc/hosts file:
127.0.0.1 somedomain.com
Step 2: in your react app directory .env file, add:
HTTPS=true
HOST='somedomain.com'
Step 3: (Depending on whether you're running a backend) you may need to add somedomain.com as an allowed domain
37
You can do it by updating your hosts file with the following entry
127.0.0.1 somedomain.com
and then use somedomain.com to access your site
But if somedomain.com happens to be your actual host address then you will have to revert it back when you want to connect to the actual hosted somedomain.com
You can find more info about how to edit your host file here: https://www.siteground.com/kb/how_to_use_the_hosts_file/
There a similar answer which you can find here: Assigning a domain name to localhost for development environment
26
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
