Parlez-moi des composants dans React.

Dans React, les composants sont des éléments indépendants et réutilisables de l'interface utilisateur qui peuvent accepter des données d'entrée (props) et gérer leur propre état.

Il existe deux principaux types de composants :

1. Composants fonctionnels : Fonctions JavaScript simples qui renvoient du JSX.

   // Exemple de composant fonctionnel
   function Welcome(props) {
     return <h1>Bonjour, {props.name}!</h1>;
   }
   

2. Composants de classe : Classes JavaScript qui étendent React.Component et possèdent une méthode render(), qui retourne du JSX. Ils peuvent avoir un état local (state) et des méthodes du cycle de vie.

   // Exemple de composant de classe
   class Counter extends React.Component {
     constructor(props) {
       super(props);
       this.state = { count: 0 };
     }
   
     render() {
       return (
         <div>
           <p>Compteur : {this.state.count}</p>
           <button onClick={() => this.setState({ count: this.state.count + 1 })}>
             Augmenter
           </button>
         </div>
       );
     }
   }
   

Les composants peuvent être imbriqués pour créer des interfaces plus complexes. Les données sont transmises du composant parent au composant enfant via props.

L'utilisation de composants assure la modularité, la réutilisation du code et facilite la gestion de l'état de l'application.