WHAT IS REACTJS ?
WHAT MAKES REACTJS UNIQUE ?
ReactJS is a stronger framework because of its ability to break down the complex interface and allow users to work on individual components. ReactJS comes with the core objective is to deliver the best rendering performance possible. Its strength stems from the emphasis on individual parts. ReactJS helps a developer to break down the complicated UI into smaller components, rather than operating on the entire web framework.
For developers who were probably looking for a simple programming language beyond Angular, React JS is a viable option. Developers working with other frameworks are required to perform a lot of complex coding during the individual comment development.
- Virtual DOM
To get an even better understanding of React JS and why you should use it, letâ€™s take a look at both.
If youâ€™re not using React JS (and JSX), your website will use HTML to update its DOM (the process that makes things â€œchangeâ€ on screen without a user having to manually refresh a page). This works fine for simple, static websites, but for dynamic websites that involve heavy user interaction it can become a problem (since the entire DOM needs to reload every time the user clicks a feature calling for a page refresh).
However React creates a VIRTUAL DOM in memory. Instead of manipulating the browser’s DOM directly, React creates a virtual DOM in memory, where it does all the necessary manipulating, before making the changes in the browser DOM. React only changes what needs to be changed. React finds out what changes have been made, and changes only what needs to be changed. This kind of selective updating takes less computing power and less loading time, which might not sound like much when youâ€™re talking about a single blog comment, butâ€”when you start to think about all the dynamics and updating associated with even a slightly complex websiteâ€”youâ€™ll realize it adds up to a lot.
HOW TO CREATE A REACT APP ???
In order to learn and test React, you should set up a React Environment on your computer. This tutorial uses the create-react-app. The create-react-app is an officially supported way to create React applications. If you have NPM and Node.js installed, you can create a React application by first installing the create-react-app.
- Node.js installing:
From given url you can install node.js
url : https://nodejs.org/en/download/
1. Once the installer finishes downloading, launch it. Open the downloads link in your browser and click the file. Or, browse to the location where you have saved the file and double-click it to launch.
2. The system will ask if you want to run the software â€“ click Run.
3. You will be welcomed to the Node.js Setup Wizard â€“ click Next.
4. On the next screen, review the license agreement. Click Next if you agree to the terms and install the software.
5. The installer will prompt you for the installation location. Leave the default location, unless you have a specific need to install it somewhere else â€“ then click Next.
6. The wizard will let you select components to include or remove from the installation. Again, unless you have a specific need, accept the defaults by clicking Next.
7. Finally, click the Install button to run the installer. When it finishes, click Finish.
- NPM installing
Open a command prompt (or PowerShell), and enter the following:
The system should display the Node.js version installed on your system. You can do the same for NPM
Install create-react-app by running this command in your terminal:
npm install -g create-react-app
You are now ready to create your first React application.
Run this command to create a React application named myfirstreact:
npx create-react-app myfirstreact
The create-react-app will set up everything you need to run a React application.
To run, this command to move to the myfirstreact directory:
Run this command to execute the React application myfirstreact:
C:\Users\Your Name\myfirstreact>npm start
A new browser window will pop up with your newly created React App! If not, open your browser and type localhost:3000 in the address bar.