In this article, we are going to see How to Install ReactJS in Windows or How to Install React in Our System. So without wasting any time let's start our article:
Features of React Js:
- Reusable Components:
- Debugging
- JSX
- One-way Data Binding
- Virtual DOM
- Simplicity
- Performance
Installation of Reactjs on Windows:
Step.1 Download Node.js Installer
You can download the Node.js installer from google by searching "nodejs" on google. Click on the first official website "nodejs.org" and you will see the LTS version and the current version of Node.js. The LTS version is the best and it is a recommended version because it has been created not in process. So you can simply click on the LTS version to download Node.js. Or you can CLICK HERE to go on the download page. When you click on the LTS version to download, it will automatically start downloading.
Step.2 Install Node.js Installer
Once the Node.js download is completed, Now find the downloaded installer file and double click on that to install it on your system.
Accept the Terms and Conditions, and click on the ok button. After installing Node.js on your system, it will show you a congratulation message.
Now We have successfully installed Node.js Installer in our system.
Step.3 Open CMD & Check Node.js Version
After installing Node.js on your system, you will have to first confirm whether Node.js has been installed or not. So type the below command in Command Prompt(CMD) and hit the enter
button:
node -v
Now you can see that we have successfully installed node version "v16.14.2" on my system. The version of NodeJS might be different in your system because when I am writing In this article, the Node "v16.14.2" LTS version is available. NPM is automatically installed on your system after installing NodeJS on your system.
Step.4 Install ReactJS Globally
Once Node has been installed on your system, Just copy the below code and paste it into CMD and hit the enter button. This command will install ReactJS on your system.
npm install -g create-react-app
Remember one thing: You can run this command in any folder or drive. It is the environment of ReactJS. So we have successfully installed ReactJS in our system.
Step.5 Check ReactJS Version
Once reactjs globally installed in your system, now first check the version of Installed ReactJS on your system. To do so, run the below code in your CMD(Command Prompt).
create-react-app --version
Now you can see that we have successfully installed the latest LTS version of ReactJS on your system.
Step.6 Create ReactJS First App
We have simply installed Nodejs and Reactjs in our system. Now it's time to create reactjs first app, to do so run the below command in your CMD where you want to create reactjs folder or app. Make sure have to change the directory where you want to create your reactjs first app.
create-react-app <projectname>
Step.7 Start NPM Development Server
After creating reactjs app, it's time to start the NPM server. So first you will have to change the directory of CMD or cursor, move to your project folder with the help of
"cd <projectname>". Now you are in the "project name" folder which we created earlier.
To run the NPM server, run the below code in your CMD:
npm start
We have successfully started the NPM server version.
Step.8 Check your App on Browser
Once your npm starts for your project, now you can see your project in your web browser. You can use any kind of browser like Chrome, Edge, Opera, etc.
To see your project, visit here http://localhost:3000/ or type in your browser "localhost:3000" and hit the enter button.
Now you can see that we have successfully installed ReactJS in your system. And our first app also opened in the browser successfully.
Conclusion:
In this article, we have successfully installed Node.js, and React.js and Created our React First App also. So we have successfully learned How to Download ReactJs or How to Install Node.js on windows.
You should also check out, Django Developer Roadmap, Python Developer Roadmap, C++ Complete Roadmap, Machine Learning Complete Roadmap, Data Scientist Learning Roadmap, R Developer Roadmap, DevOps Learning Roadmap, and Laravel Developer Roadmap.
Thank you for reading this blog. I wish you the best in your journey to learning and mastering React JS.
Follow me to receive more useful content:
Instagram | Twitter | Linkedin | Youtube
Thank you