Ferme la recherche

Web apps modernes

Descriptif

Durée de la formation

Durée 28 heures
En centre 28 heures

Session

du 22 sept. 2020 au 25 sept. 2020  - Paris - 11ème (75)
+ autres sessions
du 22 sept. 2020 au 25 sept. 2020  - Paris - 11ème (75)
du 01 déc. 2020 au 04 déc. 2020  - Paris - 11ème (75)

Objectif de la formation

Apprivoiser le JavaScript moderne avec ES2015 (même sur IE9).
Internaliser ce qui constitue aujourd'hui une webapp moderne et ce qu'elle peut faire.
Appréhender un cycle de développement test
- first (TDD).
Développer de façon modulaire, découplée, facile à tester.
Préparer la montée à l'échelle en complexité de mes projets.
Mettre en place un cycle de feedback instantané pendant le développement.
Mettre l'accent sur la mobilité, ainsi que sur le bon fonctionnement hors
- connexion.
Rendre mes webapps installables et sans cesse plus proches d'un comportement natif.

Description de la formation

Mise en place
- Outillage : écriture, linting, transpiling et build, tests, débogage.
- Mise en place du Hot Module Replacement
- Présentation de l'appli qui va être développée.
- Présentation du socle technique fourni.
Découvrir React
- Philosophie et principes généraux
- Un premier rendu
- JSX ? HTML (ou même XML)
- Premiers composants
- Distinguer entre DOM réel et DOM virtuel
- React Dev Tools
Créer un composant réutilisable
Créer un composant réutilisable
- Développement en isolation avec StoryBook
- Fonctions composants
- PropTypes
- Valeurs par défaut de props
Tester des composants
- Écosystème et concepts de tests automatisés
- Tirer le meilleur parti de Jest
- Choisir ses utilitaires de test React
- Test
- first ou test
- after ?
- Utilisation raisonnée des snapshots
Listes et conditions en React
- Le recours à #0x60#.map#0x60#
- Pourquoi la prop technique #0x60#key#0x60# ?
- Utiliser #0x60#&�x60# et #0x60#?#0x60#...#0x60#:#0x60#
- Noeuds ignorés en JSX
Hooks
- Principe des hooks
- Hooks vs. classes
Redux
- État applicatif ou état local ?
- Problématiques classiques de gestion d'un état applicatif
- Philosophie et concepts de Redux
- Réducteurs de tranche vs. réducteurs de fonctionnalité
- Écriture des réducteurs de tranche en TDD / test
- first
- Assemblage des tranches et composition de réducteurs
- Connexion propre du *store* à l'application React
- Redux Dev Tools, une puissance hallucinante
- *Time
- travel debugging*
Les événements en React
- Différences avec la gestion DOM native
- Performance et DX confortable : le meilleur des deux mondes
- Les différentes manières de définir un gestionnaire d'événements
- Éviter les rendus superflus
Les formulaires en React
- Harmonisations par rapport à HTML et au DOM
- Champs contrôlés vs. non
- contrôlés
Routage côté client
- Principes
- Quel routeur choisir ?
- Mise en oeuvre pour nos besoins
- Appliquer des effets de bord au routage avec le hook #0x60#useEffect#0x60#
- Routes privées
L'état local en React
- Principes
- Bien comprendre #0x60#useState#0x60#
- Faut
- il synchroniser depuis les props, et comment le faire intelligemment ?
Offline
- first
- Être en ligne : une amélioration progressive
- Persister des données côté client et les réhydrater au chargement
- AppCache vs. ServiceWorker
- Plugins Webpack
- Résister à du hors
- ligne temporaire pour nos appels API
- Pouvoir charger l'application alors même qu'on est hors
- ligne
Déploiement statique
- Applications 100% côté client
- Hébergeurs statiques
- Exemple de déploiement sur Netlify
Progressive Web Apps
- Qu'est
- ce qu'une PWA ?
- Indicateurs techniques
- Manifeste applicatif W3C
- Plateformes cibles (mobiles, tablettes et desktop)
- Modalités de déclenchement de l'installation
- Démonstration

Conditions d'accès

Maîtrise du français écrit et oral est indispensable (niveau B2).

Validation

Attestation d'acquis ou de compétences;Attestation de suivi de présence

Donne accès au(x) métier(s) suivant(s)

Etudes et developpement informatique (voir la fiche métier)

Et après la formation ?

Retour à l'emploi des anciens stagiaires

SATISFAISANT

Conseils
Les questions à poser avant de choisir un centre de formation
  • Quels sont les profils des anciens stagiaires (niveau de formation, expérience professionnelle) ?
  • Est-il possible de visiter le centre ?
  • Quel type de public accueillez-vous en formation (salariés, demandeurs d’emploi, particuliers) ?
  • Peut-on obtenir une liste de ces anciens stagiaires pour les interroger sur cette formation ?
  • Comment aidez-vous les stagiaires à trouver un emploi ?

Delicious Insights

Lieu de formation

Delicious Insights
83 Avenue Philippe-Auguste
Paris - 11ème

Calculez votre itinéraire

Centre de formation

Delicious Insights
83 Avenue Philippe-Auguste
75011, Paris 11e

Toutes les formations et avis pour Delicious Insights