Thématique du numérique : React

  • Erreur 404 personnalisée

    Dans React Router v6, la gestion robuste d’une page d’erreur 404 personnalisée s’effectue en déclarant une route avec path= »* » placée en dernière position dans le composant <Routes>. Ce joker universel capture toutes les URLs non correspondantes aux routes définies précédemment, permettant d’afficher un composant dédié (ex: <NotFound />). Cette approche est explicite, conforme aux bonnes…

  • ES Modules

    Norme introduite avec ES6 (2015) dans l’idée de standardiser le fonctionnement des modules JS et d’implémenter ces fonctionnalités dans les navigateurs. ES Modules intègre chaque module par une fonction d’import et d’export.

  • Événements (React)

    Un événement React, c’est ce qui se passe quand l’utilisateur interagit avec une page (clique, tape, survole, soumet…). React permet de réagir à ces interactions en exécutant du code JavaScript. En pratique Exemple Ce qui se passe : Les 2 pièges à connaître

  • Float UI

    Float UI est une collection de composants d’interface utilisateur modernes et de modèles de sites web, construits pour React/Nextjs avec Tailwind CSS. Float UI

  • Fragment React

    Un Fragment React est un outil qui permet de regrouper plusieurs éléments enfants (comme des balises HTML ou d’autres composants) sans ajouter de nœud supplémentaire au DOM. En temps normal, React exige un élément parent unique pour retourner du JSX (souvent une <div>). Le Fragment permet de respecter cette règle technique sans polluer la structure…

  • Framework JavaScript

    Cadre de travail aidant à la création d’une application Web avec des fonctionnalités avancées, des méthodes déjà fournies. L’application est découpée en composants, des éléments réutilisables ( des boutons, une barre de navigation etc.). Les composants communiquent entre eux par des flux de données (databinding), où il est possible d’ajouter, supprimer un élément, changer son…

  • Gestion des événements -Event Handling en React

    La gestion des événements en React permet de réagir aux interactions utilisateur (clics, saisies, soumissions, etc.). Elle suit une syntaxe proche du HTML mais avec des spécificités JSX pour s’intégrer au système de rendu de React. Les 3 Règles d’Or (Différences HTML vs React) Exemple click bouton Submission Formulaire (Avec prévention) Événement avec Argument Pièges…

  • Gestion des formulaires en React

    La gestion des formulaires en React englobe l’ensemble des techniques pour capturer, valider, stocker et soumettre les données saisies par un utilisateur. Elle repose principalement sur deux approches : les composants contrôlés (recommandé) et les composants non-contrôlés. Les 2 approches principales Exemple de formulaire contrôlé Bibliothèques spécialisées Pour les formulaires complexes, des librairies externes simplifient…

  • Hook React

    Un Hook est une fonction spéciale introduite dans React 16.8 (2019) qui permet à un composant fonctionnel d’« accéder » (hook into) aux fonctionnalités internes de React :→ gestion de l’état local (useState),→ effets de bord (cycle de vie) (useEffect),→ contexte (useContext),→ références (useRef), etc. Caractéristiques fondamentales Exemple Écosystème des Hooks Pourquoi c’est révolutionnaire ?…

  • Joker universel – Wilcard

    Un joker universel (ou wildcard en anglais) est un caractère spécial (*) utilisé dans la définition de routes pour capturer n’importe quelle suite de caractères dans une URL. Il agit comme un « attrape-tout » qui correspond à tous les chemins non explicitement définis par d’autres routes plus spécifiques. Fonctionnement dans React Router v6 Règle critique :React…