How to create a functional component in React?

To create a functional component in React, follow these steps:

Import React at the top of your file:

import React from 'react';

Define the functional component using an arrow function or a regular function. Functional components are stateless and return JSX that represents the UI:

const MyComponent = () => {
  return (
    <div>
      <h1>Hello, I am a functional component!</h1>
    </div>
  );
}

Export the component at the end of the file so it can be used in other files:

export default MyComponent;

Here's an example of a complete functional component:

import React from 'react';

const MyComponent = () => {
  return (
    <div>
      <h1>Hello, I am a functional component!</h1>
    </div>
  );
}

export default MyComponent;

You can now use this functional component in other components by importing it and including it in the JSX markup.