Setup React Development Environment

In this blog your will learn how to setup react development environment.

Introduction 

 

In this blog your will learn how to setup a React development environment.

 

What is React?

 

React is a JavaScript library for building user interfaces. It is used to build web user interfaces. It is mostly used to develop single page web applications. We can also develop mobile applications using library ReactJS. To develop mobile applications we use library ReactNative.

 

What is the different between Angular and React?

 

Angular	React
Angular is a JavaScript framework for front end.	React is a JavaScript library for building user interfaces.
Angular is developed and maintained by Google	React is developed and maintained by Facebook
Architecture of Angular  is a bit complex as it follows MVVM models- Model View View Model.	React js is more simplified as it follows MVC- Model View Control.
Angular is  a mere subset of html.	React.js holds JSX, hence the usage of html codes and syntax is enabled.
Written in Microsoft’s TypeScript language, which is a superset of Javascript ECMAScript 6 (ES6)	Reacj.js is written in JavaScript.

 

Step 1

 

Install NodeJS and NPM,

 

https://nodejs.org/en/

 

Step 2

 

After successfully installing NodeJS, we can start installing React upon it using npm. You can install ReactJS in two ways

• Using webpack and babel.
• Using the create-react-app command.

Install create-react-app using the below command:

npx create-react-app my-app or npm install create-react-app

Use the below command to check installed version:

npm view react version

Step 3

 

Install typescript

npm install -g typescript

Step 4

 

Download visual studio code

 

https://code.visualstudio.com/

 

Step 5 - Create and Run your first project

 

Finally, run the project using the start command. 

npm create-react-app NameOfProject
npm start