To create a functional component in React, you define a JavaScript function that returns JSX. These components are stateless and rely on props for data input. Functional components are concise, easy to read, and can utilize React Hooks for managing state and side effects, making them a fundamental building block for React applications.

Prerequisites:

• NodeJS or NPM
• React
• JSX

Steps to Create React Application And Installing Module:

Step 1: Create a React application using the following command:

npx create-react-app my-app

Step 2: After creating your project folder i.e. folder name, move to it using the following command:

cd my-app

Project Structure:

The updated dependencies in package.json file will look like:

"dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4",
}

Example: Implementation to create a functional component.

Output:

Example 2: Implemenattion to show how to add a functional component in our application with a custom input by changing the contents of the header in the App.js file.

Javascript

Output:

Step to run the application: Now to run the above code open the terminal and type the following command.

npm start