ReactJs for beginners

React JS is one of the most popular JavaScript library for building fast and interactive user interface.

Components:

Components is essentially a piece of user interface When building applications with react we build a bunch of independent and reusable components.

**What exactly reusable components are ? **

React uses component based architecture. If we take web page every part of that web page is a component. We will build a complex web page using components and we use these components any where in the same or any other project.

For example:

In every project Header, footer, and navigation bar is common so we can create components of header, footer and nav bar components and we can use this anywhere in the project.

What exactly means library?

A library in a programming language is nothing but collection of functions. We can write code much easier using these libraries. JQuery is a library for example.

We can write JavaScript code much easier if we import JQuery library to our project.

**Let's look at a basic react component **

class Counters extends React.component{
   state = {};
   render() {
    return  (
      <h1> Increment counter <h1>
    )
  }
}

Let me explain the above code

• The state here is the data we want to display when the component is rendered

• Render method is responsible for describing how the UI should look like.

• The output of this render method is the react element which is the simple javascript object mapped to the DOM element which is nothing but virtual DOM.