Cuéntame sobre los componentes en React.

En React, los componentes son elementos independientes y reutilizables de la interfaz de usuario que pueden aceptar datos de entrada (props) y gestionar su propio estado.

Existen dos tipos principales de componentes:

1. Componentes funcionales: Funciones JavaScript simples que devuelven JSX.

   // Ejemplo de componente funcional
   function Welcome(props) {
     return <h1>¡Hola, {props.name}!</h1>;
   }
   

2. Componentes de clase: Clases JavaScript que extienden React.Component y tienen un método render(), que devuelve JSX. Pueden tener estado local (state) y métodos del ciclo de vida.

   // Ejemplo de componente de clase
   class Counter extends React.Component {
     constructor(props) {
       super(props);
       this.state = { count: 0 };
     }
   
     render() {
       return (
         <div>
           <p>Contador: {this.state.count}</p>
           <button onClick={() => this.setState({ count: this.state.count + 1 })}>
             Incrementar
           </button>
         </div>
       );
     }
   }
   

Los componentes pueden anidarse unos dentro de otros para crear interfaces más complejas. Los datos se transmiten del componente padre al hijo a través de props.

El uso de componentes garantiza modularidad, reutilización de código y facilita la gestión del estado de la aplicación.