ReactJS Tutorial

How to Setup ReactJS Development Environment? Step by Step

Table of Contents

  • Step-by-Step Process to Set Up ReactJS Development Environment
  • How to Install React JS on Windows | Environment Setup for React JS
  • Test your knowledge with a quick quiz:

Step-by-Step Process to Set Up ReactJS Development Environment

React JS environment setup can be done by following the below-mentioned steps.

1. Install Node.js and npm

It is imperative to have NodeJS installed on your PC for setting up a React development environment. 

What are Node.js and npm? They are the runtime and command-line tools required to build React applications. While Node.js is a JS runtime environment that allows you to run js code outside of the web browser, npm is a package manager used to download javascript packages built to run on Node. You can get both of them together when you install Node.js.

You can visit the official link of NodeJS and download and install the latest version.

2. Test

Next, you need to test that Node.js and npm have been installed successfully. For this, you can run the commands: node -v and npm -v.

3. Install create-react-app using npm 

The next important step in the ReactJS installation is to download the create-node-app package using npm (node package manager).

In the command prompt, write this command and hit Enter:

npm install -g create-react-app

This will start the installation process.

To check whether it is installed properly, write the following command and hit Enter:

create-react-app --version

It will show you the version of the create-react-app.

3. Create a project using create-react-app 

Create a new folder on your desktop and rename it to React. Open command prompt through this folder and run the following command:

create-react-app myapp

It will initiate the installation of the app (myapp) in the folder you created on the desktop (React).

You can open this folder and see all the subfolders and files created for creating the ReactJS app using the create-react-app command.

4. Test the React app

Run the given command in the Command Prompt:

npm start

It will open your app in the browser, which shows that you created the app successfully. 

How to Install React JS on Windows | Environment Setup for React JS

How to Install React JS on Windows | Environment Setup for React JS

Test your knowledge with a quick quiz:

What is create-react-app?

 

Select the correct answer

Did you find this article helpful?