Aller au contenu principal

Résumé React (https://react.dev/)

Sommaire​

Qu'est-ce que React ?​

Une bibliothèque JavaScript pour créer des interfaces utilisateur. Une interface utilisateur est composée de composants qu'on peut voir comme des briques de Lego.(Bouton, texte, image, etc...)

Mosaique​

Creation de composant​

  • function Exemple(){ } /!\ Les composants doivent commencer par une majuscule pour etre valide. /!\ Ne pas oublié les parenthéses après return sinon les lignes suivantes seront ignorées. /!\ Ne jamais créer un composant dans un composant, La séparation évite un ralentissement et de possible bug .

Exportation​

  • export default : exporte la fonction (composant) principal. /!\ Un seul export default par fichier.

    • export (nommé) : exporte d'autres fonctions secondaires /!\ Plusieurs export nommé par fichier.

Importation​

Best pratice : un import avec son extension se rapproche du fonctionnement des modules ecmaScript natif.

[[img tableau export default/nomme2]]

Les règles JSX​

  1. Un bloc unique (l'ensemble dans une div ou l'utilisation de Fragment )
  2. Les attributs HTML-like doivent être en camelCase (class => className)

Convertisseur HtML+SVG => JSX : https://transform.tools/html-to-jsx