Accueil / ReactJS avancé

ReactJS avancé

Durée : 3 jours
Tarif Inter : 1800 €
Tarif sur mesure : Nous consulter
Référence : 3AAV

  • Partagez sur
  • Téléchargez en
  • Inscrivez vous
Programme Public & Pré-requis Organisation

Présentation

Alors que les géants des médias sociaux tels que Facebook comptent sur ReactJS pour garantir d’excellentes interfaces utilisateur, la popularité de ce framework augmente de manière exponentielle parmi les développeurs front.

Cette formation ReactJS vise à fournir des conseils essentiels pour maîtriser ReactJS, et enseigne aux participants comment appliquer les techniques de codage avancées React and Redux pour développer des applications de hautement performantes.

Objectifs

  • Maîtriser les principes de React, tels que la programmation déclarative et le modèle de composition React
  • Construire les applications React de la bonne manière.
  • Comprendre les différentes approches de gestion de l’état/state dans l’écosystème React.
  • Être capable d’utiliser des modèles avancés et de la programmation fonctionnelle pour améliorer la qualité du code.
  • Comprendre les performances absolues et perçues, et comment les améliorer
  • Comprendre les concepts théoriques de base de React
  • Apprendre à styliser les applications React de manière idiomatique et encourager la cohérence de la conception en utilisant des systèmes de conception.
  • Comprendre comment construire des composants faciles à réutiliser et à entretenir.
  • Savoir charger ses applications React côté serveur pour le référencement

Programme

  1. React, JavaScript moderne, Routing et Data Fetching.

    • Penser en React
      • De l’impératif au déclaratif
      • L’UI comme une fonction du state et des props
      • Component tree de ReactJS, host et virtual tree
      • Mise en place du state
      • Flux de données unidirectionnel descendant
      • Modèle de composition React
      • Outils de développement React
    • JavaScript moderne
      • Décomposition, opérateurs spread et rest
      • Modules, let, const et var
      • Itérateurs et introduction à la programmation fonctionnelle en JS
      • Fonctions Arrow et littéraux de gabarit
      • Promises et async
      • JavaScript moderne pour React- Babel, ES6 et au-delà
    • Routage et data fetching
      • Routeur React
      • Routage déclaratif
      • Mise en œuvre d’une page maître
      • Cycle de vie des composants avec les effets
      • Recherche de données
  2. Formulaires, authentification et hooks

    • Formulaires et authentification
      • Gestion des formulaires dans React
      • Composants contrôlés
      • Composants non contrôlés
    • Authentification
      • JWT
      • Autorisation, pages publiques et privées
    • Hooks React
      • Gérer le state et les side effects avec les hooks
    • Récapitulatif des fondamentaux React
      • Consolidez vos nouvelles compétences React en créant une application React à partir de zéro, en utilisant:
      • React
      • Routeur React
      • Recherche de données ou data fetching
  3. Fondamentaux Redux , du déploiement à la production.

    • Principes fondamentaux de Redux
      • Introduction à la programmation fonctionnelle (FP)
      • Données et comportements
      • Données entrantes, données sortantes
      • Mutations
      • Fonctions pures
      • Principes de Redux
      • Store, Reducers et Actions
      • Une source unique de vérité
      • React-Redux : fournisseur et connexion
      • Construisez votre propre version de Redux avec le TDD
      • Récupération des données du serveur vers Redux
      • Configurer Redux à partir de zéro dans une application React
    • Consolidez vos nouvelles compétences en React en ajoutant des Redux et des formulaires à l’application que vous avez construite.
    • Déployez une application React sur le cloud Google avec Firebase
  4. Patterns et performances avancés de React.

      • Programmation fonctionnelle (FP) appliquée à JavaScript
        • Closure
        • Memoization
        • Composition
      • Hooks
        • Comment remplacer Redux par les hooks
        • Modèle de composition des hooks et personnalisation
        • useReducer
        • useContext
        • useMemo
      • Patterns précédents
        • Higher-Order Components (HOC)
        • Refactoring des patterns antérieurs en hooks
      • Profilage
        • Éviter les restitutions
        • State encapsulé
        • React.memo et immuabilité
      • Windowing
  5. Le Server Side Rendering : Chargement côté serveur

    • Les limites du rendu côté client
    • Allier rendu côté serveur et rendu côté client
  6. Le style dans ReactJS et les systèmes de conception

    • Styliser en React
      • CSS-in-JS par rapport à d’autres approches
      • Comparaison des bibliothèques des composants UI: SemanticUI, MaterialUI, Rebass, et React-Bootstrap
      • Composants stylisés
      • Storybook
    • UI patterns avancés
      • Thèmes
      • Composition de composants
    • Systèmes de conception
      • Constantes pour le design : espacements, polices et couleurs
      • Système de style
      • Limiter la portée style
      • Système de conception basé sur les props: props array et variantes
      • Responsive design
      • Utiliser des props au lieu d’écrire des requêtes de médias à la main
      • Adaptation selon le support d’affichage
Formations à distance
En inter et en intra entreprise

Contactez-nous :
training@softeam.fr
+33 (0)6 07 78 24 18
Prochaines dates

Paris

Du 24 au 26 août 2020

Rennes

Du 24 au 26 août 2020

Nantes

Du 24 au 26 août 2020

Sophia Antipolis

Du 24 au 26 août 2020

Aix en provence

Du 24 au 26 août 2020

Demande de renseignement