What is React JS ?

What is React?

React is a JavaScript library to build User Interface website or Application. React can be use to build SPA(Single Page Application), which are web applications that dynamically update the content on a Single web page rather than loading multiple pages.

Why React?

• More fast and light
• provides state-of-the-art functionality
• More Popular
• Use JSX Syntax
• An easy-to-use and highly productive JavaScript framework
• Use virtual DOM (Document Object Oriented)
• Can build complex UI interactions that communicate with the server in record time with JavaScript-driven pages

Introducing Hooks

Hooks are a new addition in React 16.8. They let you use state and other React features without writing a class.

• Hooks let you split one component into smaller functions based on what pieces are related (such as setting up a subscription or fetching data)
• Hooks allow you to reuse stateful logic without changing your component hierarchy
• Hooks let you use more of React’s features without classes

Rules of Hooks

• Hooks are a new addition in React 16.8
• Only call Hook at the Top level, so Don’t call Hooks inside loops, conditions, or nested functions
• Only Call Hooks from React Functions, so Don’t call Hooks from regular JavaScript functions. Instead, you can Call Hooks from React function components and Call Hooks from custom Hooks

Create React App

You’ll need to have Node >= 14.0.0 and npm >= 5.6 on your machine. If you don’t have it, you can install it to your machine https://nodejs.org/en/. Make sure that you have install it and check it at your command prompt or terminal by type node -v to check Node version and npm -v to check npm version.

check node version and npm version

And then you can create project by run :

npx create-react-app my-app
cd my-app
npm start

You can use Sublime text, Visual Studio Code or other as the code Editor. I preferred to use Visual Studio Code to build it

• Visual Studio Code supports macOS, Linux, and Windows
• Support for hundreds of languages
• Includes great tooling for web technologies such as JSX/React, HTML, CSS, SCSS, Less, and JSON
• Visual Studio Code includes a public extensibility model that lets developers build and use extensions, and richly customize their edit-build-debug experience

You can get it at https://code.visualstudio.com

Thanks for Reading!