In this tutorial I am going to show you how you can create React JS application in Windows environment. Before reading this tutorial please make sure you have installed the node.js in your system. Please have a look at this here for node.js installation.
If you want to update the existing React version then you can use command
npm update react or
npm install --save react@<react version>. The first command will upgrade your existing React to the latest minor version. For example, if your existing React version is 16.1, so it will update to 16.6. Therefore it will not update to the major version. So if the React latest version is currently 17.0, it won’t update from 16.1 to 17.0. In this case you to use the second command with the version you want to upgrade.
Please follow the below steps one by one in order to create React application.
1. Open command prompt and navigate to the desired directory where you want to create React application. In this example I am going to create React application under
2. Type the below command in order to create the React application. The below command will run required configurations
npm install -g create-react-app
wait till it finishes its execution. It configures React application command to be used to create React JS application as used in below step.
3. Now type command
create-react-app react-rest in the command prompt and wait till it finishes its execution. It creates
react-rest folder and all required modules inside the
react-rest folder for the application.
4. Finally we will test the application using command
npm start. A browser with URL
http://localhost:3000 gets opened automatically. The browser title is displayed as “React App”.
First move to the directory react-rest by using below command on cmd prompt:
Next type command
npm start on cmd prompt
Now if you see popup opens to allow as shown below, then allow it
Once you allow you would be able to see below texts on cmd prompt and a browser automatically opens with react app URL. The URL is displayed on the cmd prompt. If browser does not open then you need to open it and hit the URL you get to see on cmd prompt.
Final result on browser
3000 is the default port of node.js server. If you want to change the default port then you can update the line “start”: “react-scripts start” in package.json file as below:
Linux and MacOS: “start”: “export PORT=3006 react-scripts start”
Windows: “start”: “set PORT=3006 && react-scripts start”
Alternatively in Windows OS, you can create .env file under the project’s root directory and specify the port in this file:
On every update to the js file or any file you don’t need to stop start the application. It automatically reflects the changes on the browser. So you can continue updating to your files.
That’s all about creating new React application or project in Windows system.