Basic React JS

What is React JS?

React is a javascript library for building fast and interactive user interfaces. When we are thinking about user interfaces, we felt that react only used on web pages. But react is not only used on web pages. It is also used on other’s user interfaces building (like mobile apps).

The basic concept of React JS

Components:

React’s main concept is Component. Components are the heart of the react app. When we see a website, there are many sections in that website. We build every little section as an independent, reusable component. Each component is a piece of UI.

Components type:

In react, we have two types of components.
1.Functional Component
2.Class Component

Now we have to know when we should use which type of component and why to use that. To know about components type, we should know ES6. Cause functional component is es6 function, and class component is es6 class. Let’s see some examples:

Functional Component

const Welcome= ({name}) => <div>Welcome {name}</div>

Class Component

class Welcome extends Component{
   render(){
      return <div>Welcome {this.props.name}</div>
   }
}

Why mostly use the functional component?

Here is some reason:

• Functional components rendering is easy.
• Functional components testing is straightforward, cause there’s no hidden state.
• Functional components have better performance.
• Functional components debugging are very easy.

That’s all for today. Will see you in the next blog.