Explain the concept of controlled vs uncontrolled components in React.

In React, controlled components are those whose value is controlled by React state. Uncontrolled components manage their own state internally.

In a controlled component, form data is handled by the state in React, making it easier to manipulate and validate data. In contrast, uncontrolled components rely on the DOM to manage their state.

Here's an example of a controlled component:

import React, { useState } from 'react';

const ControlledInput = () => {
  const [value, setValue] = useState('');

  return  setValue(e.target.value)} />;
};