09 What is Functional Components | what is functional components in hindi

What is functional component?

How to create?

What is  Functional Component?

Its similar and write pattern like Javascript function hence its called functional component.

Functional component can be written using much less code more faster and easier to understand.

Functional component behave and act much the same way as a Class Component. 

Functional Component

Its like a function that takes in props and return JSX. 

JSX stands for JavaScript XML. It is simply a syntax extension of JavaScript. JSX allows us to write HTML in React.

Functional component is also known as a stateless component because not hold or manage state.

NOTE:

It is now suggested to use Function components along with Hooks, which were added in React 16.8.

Filename of component must start with an uppercase character.

Example: Hello.js

// Functional Component Example

import React from 'react';

function Hello(props){

   return (

      <h1>

         Welcome to Learn {props.name}

      </h1>

   )

}

export default Hello;

Example: HelloWorld.js

// Functional Component Example

import React from 'react';

const HelloWorld =()=> {

   return (

      <div>

         <p>Hello World!</p>

   <strong>ReactJS is easy to learn.</strong>

      </div>

   )

}export default HelloWorld;