3. 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.
4. •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.
Functional Component
5. •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.
NOTE:
6. • Example: Hello.js
// Functional Component Example
import React from 'react';
function Hello(props){
return (
<h1>
Welcome to Learn {props.name}
</h1>
)
}
export default Hello;
Functional Component
7. • 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;
Functional Component