How to Install ReactJS on Windows?

React is the most popular JavaScript library for front-end development, and to build a React app, you first need to install React on your machine. This guide will walk you through the steps to install ReactJS on Windows, covering each part of the installation process in detail.

How to Install React

To get started with React, begin by installing Node.js. Once Node is set up, use the command line to create a React app with the `create-react-app` command. Afterward, navigate to your new app’s directory and start the development server.

Steps to Install React on Windows

Follow the below steps from installing node to run the application to successfully create a react app.

Step 1: Install NodeJS

Install Node.js installer for Windows. Click on this link. Here, install the LTS version (the one present on the left). Once downloaded, open NodeJS without disturbing other settings, and click on the Next button until it’s completely installed.

Step 2: Verify NodeJS Installation

Open the command prompt to check whether it is completely installed or not type the command –>

node -v




If the installation went well it will give you the version you have installed 

Step 3: Install the CRA ackage

Now in the terminal run the below command to install create-react-app




It will globally install react app for you. To check everything  went well run the command  

create-react-app --version
Screenshot-2024-09-10-110003

If everything went well it will give you the installed version of react app

Step 4: Create Directory for React Projects

Now Create a new folder where you want to make your react app using the below command: 

mkdir newfolder

Note: The newfolder in the above command is the name of the folder and can be anything.

Screenshot-2024-09-10-110140

Move inside the same folder using the below command:

cd newfolder (your folder name)
creating folder

Step 5: Create the React App using CRA Command

Now inside this folder run the command –>

npx create-react-app reactfirst
create-react-app

It will take some time to install the required dependencies

NOTE: Due to npm naming restrictions, names can no longer contain capital letters, thus type your app’s name in lowercase.

install-required-dependencies

Step 6: Open the Project in Code editor

Now open the IDE of your choice for eg.  Visual studio code and open the folder where you have installed the react app newfolder (in the above example)  inside the folder you will see your app’s name reactapp (In our example). Use the terminal and move inside your app name folder.Use command  cd reactapp (your app name)

React Project in VSCode

Step 7: Run the React App

To start your app run the below command :

npm start  
npm start

Once you run the above command a new tab will open in your browser showing React logo as shown below :

open-browser

Congratulation you have successfully installed the react-app and are ready to build awesome websites and app. 

Also Read:

Conclusion

By following the straightforward steps outlined in the article, You can easily install React JS on your Windows. With features like reusable components and easy debugging, React JS simplifies the development process making it a popular choice among developers worldwide.

Install ReactJS on Windows: FAQs

How to install React JS in Ubuntu?

  • Install Node.js: sudo apt install nodejs.
  • Verify Node.js installation: node -v.
  • Install npm: sudo apt install npm.
  • Install create-react-app globally: sudo npm install -g create-react-app.
  • Create a new React app: create-react-app your_app_name.
  • Navigate into the created app directory: cd your_app_name.
  • Start the development server: npm start.


Comments