Issue about installation of New React App

Question

I want to learn React. so I installed Nodejs(v 10.16.0 LTS) and then using Windows Powershell I run following commands

npx create-react-app my-app
cd my-app
npm start

After installing, When I try to make a change in any code (like changing page title name), after saving code file. The Tab in Browser does not reload automatically and when I reload tab manually the error occurs which say

This site can’t be reached

localhost refused to connect.

Try:

Checking the connection

Checking the proxy and the firewall.

If I start this using PowerShell using npm start* command, then it run successfully. but I have to do this every time even when I edit my code. Browser tab did not reload and apply changes automatically.

Kindly guide me about this issue. Thanks

Just to check, after `npm start`, can you see the app running properly the first time? — rdarioduarte, Jul 29 '19 at 11:05
@rdarioduarte Yes, after 'npm start, app run properly the first time only. — Umair Janjua, Jul 29 '19 at 11:08
@DennisVash Can you guide me how to check and change privileges? — Umair Janjua, Jul 29 '19 at 11:10
I'm not a windows user so you can google it, it should be in folder properties (right-click on the folder) — Dennis Vash, Jul 29 '19 at 11:11
Do one thing. Create `.env` file in your project's root folder with `PORT=3001`. And restart your app. — ravibagul91, Jul 29 '19 at 11:17
Hope this one be helpful. **Try this** https://stackoverflow.com/a/43281575/7363136 — Ujjawal Raj, Jul 29 '19 at 11:26

score 0 · Answer 1 · answered Jul 29 '19 at 11:27

0

you need to add react-hot-loader in your project react doesn't come with hot reload you need to include it in your project below is the link to npm please go through the documentation they provide once, and add it in your project.

answered Jul 29 '19 at 11:27

techipank

432
4
17

Saad Rashid · Answer 2 · 2019-07-30T06:06:40.433

You shouldn't need react-hot-loader or anything else if you've created your react app through create-react-app - just make sure you're using the latest stable version of create-react-app

In your react app, when you run npm start, it uses react-scripts start script which behind the scenes uses webpack which actually takes care of hot module replacement

The problem you're facing seems most likely related to your local setup. Can you try running your app on a different port 8080 maybe?

Secondly, hot module replacement uses a websocket connection, can you check in your console if there is any error related to ws connection?

Issue about installation of New React App

2 Answers2