Monday, May 11, 2020

React setting up development environment

React Set up the development environment


Install node.js and npm


We need to install Node.js(Download and install Node.js) and npm first to install setup the environment for the ReactJS apps.


Install React boilerplate 


Start Node.js command prompt and install ReactJS boilerplate globally using the following command.

npm install -g create-react-app

Create your first React App


Create a new directory or navigate to the directory in which you want to create your application and run the following command to create a new project.

create-react-app testreactapp

testreactapp is the name of the ReactJS project. All characters in the project name must be small letters. This folder will be containing the following content now,



Several files are installed in this directory, but the main files on which we will be focusing on are index.html and index.js. 
 Once the installation is complete, the server must be running and the following message will appear.
 on the screen,


Run the app


Open your browser to view the app at  http://localhost:3000/. The following web page will be served,


 


To stop the server press ctrl+C. 

To run the app use command,

npm start
 
This is how we can set up the environment for ReactJS app development. Now, we can start editing the files using any of our favorite code editors and start the development.