How to install React JS on localhost with Windows is the first step to building modern web applications. React JS is currently a leading front-end technology for building websites that work with APIs, where APIs act as the backend and React JS handles all the data on the front end using various hooks. In this guide, you will learn how to install React JS on your Windows system and create your first React app.
What is React? Why Are We Using It?
In short, React is a JavaScript library developed by Facebook in 2011. React is efficient and flexible, which makes it a popular choice for the frontend. It lets you build reusable UI components and manage application state smoothly. Once you finish the installation below, you can explore React Hooks like useState and useEffect to add interactivity to your apps.
How to Install React JS on Windows System
You can use the VS Code terminal, CMD, or PowerShell — totally your choice. Follow the steps below to install React JS on localhost with Windows.
Pre-requisite for ReactJS
- NodeJS and NPM
First install NodeJS from the Node.js official download page. Before you ask, let me tell you what is NodeJS: Node.js is a runtime environment that helps execute JavaScript code outside a browser. NPM, the Node package manager, is used for managing and sharing packages for React and Angular.
After you have installed the NodeJS package, check its version by running the commands below in the terminal. Then you are ready to create your first React app.
How to Check Node.js and NPM Version
[code]
node -v
npm -v
[/code]
How to Create React App with NPM
If you already know how to create a React app, that’s great — and if not, don’t worry, I’m here to help you. Run this command in your terminal:
[code]npx create-react-app app-name[/code]
After pressing Enter, wait for a few minutes depending on your system specifications.
From my personal experience, if you want to work with or learn React JS, your system should have a minimum of 8GB RAM and a 240GB SSD. If the RAM could be 16GB, perfect — it will compile super fast. Basically, compilation time depends on the size of the project and the modules used.
When your project is ready, check the directory of your project or change into it using the cd command, as in our case the application name is app-name:
[code]cd app-name[/code]
Now start the development server:
[code]npm start[/code]
Hurray! You have created your first ReactJS app successfully. It will open automatically in your browser at http://localhost:3000.
5 Easy Steps to Install React JS on Localhost
- Download and install NodeJS and NPM from the official website.
- Verify the installation with node -v and npm -v.
- Create a new app with npx create-react-app app-name.
- Move into the project folder with cd app-name.
- Start the app with npm start and open http://localhost:3000.
Troubleshooting Common React Installation Issues
NPX command not found? Make sure NodeJS is installed correctly and restart your terminal after installation.
Installation is very slow? A slow network or an old hard drive can slow things down. Using an SSD and at least 8GB of RAM helps a lot.
Seeing the “objects are not valid as a React child” error? This usually means you tried to render an object directly. Read our fix for the objects are not valid as a React child error.
What to Learn After Installing React JS
Once your setup is ready, keep learning with these guides:
- What are React Hooks? — learn useState and useEffect with examples.
- Form validation in jQuery — handle form inputs and validation.
- Bootstrap 5 CSS framework — style your React components faster.
- API calls in Laravel 8 — build the backend APIs your React app will consume.
FAQs: How to Install React JS
Q1. How to install React JS on Windows 10 or 11?
Install NodeJS and NPM, then run npx create-react-app app-name in the terminal, followed by npm start. The steps in this guide work on both Windows 10 and Windows 11.
Q2. Do I need NodeJS to install React JS?
Yes. NodeJS and NPM are prerequisites because the React toolchain (create-react-app) runs on Node.
Q3. How do I check if React JS is installed?
Run node -v and npm -v to verify the prerequisites, then create and start a sample app as shown above.
What to Do After You Learn How to Install React JS
Now that you know how to install React JS on localhost, start building small projects to practice. If you see the “objects are not valid as a React child” error, read our guide to fixing objects are not valid as a React child. The best way to master how to install React JS is to repeat the setup on different machines and explore the official React documentation.