React.JS Overview | For Absolute Beginners

What is React? | How it Works?

Basically React is a JavaScript Library. React helps you to create user-interface by component. If you like to code MVC pattern you can replace the view selection with react. React is used to build single-page applications & React allows us to create reusable UI components.

Whenever you changed something inside your component react understand (using Diff Algorithm) exactly where should be minimum changed, Work specifically with that location (using virtual DOM) Then (minimum render) that Component.

Setting Up React Environment | Run React Application.

Start working with react you must need npm environment and for npm environment, you need to install node.js application.

If you already installed the node.js application that you can install react application boilerplate on you pc by the command given bellow:

The create-react-app command will setup everything you need now it’s time to run the application. Run the application by the command given bellow:

Should Learn Basic ES6

React Uses ES6 Pattern, you should be familiar with most commonly used es6 elements like.

Export | Import

To make objects, functions, classes or variables in any file & export them. When you need those objects, function, or classes importing them where needed in other files.

Arrow Function

Arrow function makes our regular function shorter & smarter.

What is JSX?

JSX stands for JavaScript XML, JSX allows you to write HTML in react.

ReactDOM.Rander()

JSX JavaScript XML helps to write HTML code in JavaScript & ReactDOM.Rander() makes JSX HTML inside the specified HTML element.

React Component

React Component moto is: Similar in look Different in data

Components are reusable by a block of code. React divides UI into a number of small components. There are two types of component Functional Component & Class Component.

Functional Component:

Class Component:

Props in React

Props is a reserved keyword in react. Props used to pass data from one component to another component ( parent to child Component). Receive Props value like function parameter.

Hi, I'm Nazmul Huda. A full stack Web Application Developer. I love new challenges and working with new technologies.