How to Setup React.js Development Environment Using create-react-app

The create-react-app can help you have a local development environment from React.js using single command and you will be done within few minutes. You don’t need to learn any new API and maintain new configurations.

It is great to have an environment up and running within a few minutes. But now, not going through all the needed steps, you are not learning what elements are in play. So, this is why we will also create react development environment without using create-react-app in upcoming articles.

But for now, let’s jump into the steps for creating a local development environment using create-react-app.

Step 1: Install Node.js to Your Local Computer.

Follow the guidelines given in this article to install node.js on windows (Follow only Step 1 from the given link) and then come again to start from Step 2 here.

Step 2: Open Command Prompt

1] Press Windows+R to open “Run” box. Type “cmd” and then click “OK” to open a regular Command Prompt.

2] Type npx create-react-app myreactapp

Note: myreactapp would be your react application name. You can give any name as per your convenience.

3] Hit Enter and NPX will start downloading and setup your react environment.

Note: NPX will be downloading temp create-react-app, it will not install create-react-app. Just for the testing purpose it will great to use NPX command because it will set up and directly make your application runnable. You don’t need to worry about the new version, next time when you will run the same command it will load the latest version of create-react-app. Needless to say, in the actual project, you should go with NPM instead of NPX.

After the installation has been completed, you will get the following guidelines at the end. Type cd myreactapp to change directory and then type npm start to run the application. It will open react application in the browser.

How to Setup React.js Development Environment Using create-react-app



Note: Instead of sra-test type myreactapp, which is your application name or any name given by you.

To close running application press ctrl+c and then type Y and hit enter.

We hope you got an idea of how to use create-react-app to the setup of a development environment and start working on react application.

Admin

Tutorial Funda will keep you updated with the latest Programming Languages, Software Tools and related technologies used in Software Development.

Leave a Reply

Your email address will not be published. Required fields are marked *