Progressive Web Applications (PWA). Web Components

x

Programme

  • Web Components
  • Introduction aux WebComponents
    - Qu’est-ce un WebComponent et à quoi il sert?
    - Caractéristiques des WebComponents
    - Comment trouver des WebComponents?
  • Utiliser les WebComponents
    - Installer et utiliser un WebComponent dans un environnement Angular
    - Importer les WebComponents dans un module Angular
    -  Importer le Polyfill du WebComponent
    - Configurer le fichier tsconfig.json pour activer la reconnaissance des fichiers JS
    - Activer la reconnaissance des WebComponent avec CUSTOM_ELEMENTS_SCHEMA
    - Utiliser le WebComponent dans un template Angular
  • Comment créer ses propres WebComponents
  • Présentation de Stencil
    - Stencil, le compilateur de WebComponents
    - Utiliser des WebComponents de Stencil
    - Importer le Polyfill du WebComponent    
    - Utiliser le WebComponent dans un template Angular
    - Créer des PWA avec Stencil
  • Progressives web Applications
  • La méthode de développement propre aux PWA
    - Caractéristiques des PWA
    - Framework pour développer des PWA (Stencil)
  • Angular et les PWA
    - Créer et configurer une PWA avec Angular CLI
    - Configuration du BrowserModule
    - Architecture d’une PWA Angular
    - Rendre Linkable une application Angular
  • Service Worker
    - Enregistrer un Service Worker
    - Mécanisme de cache / Cycle de vie d’un Service Worker
    - Debuger les Service Worker dans la console Google Chrome
    - Compatibilité des Navigateurs
  • NGSW / ngsw-masnifest.json
    - Ajout de la balise link dans le fichier index.html
    - Mettre en cache du contenu « Static »
  • Outils de test pour les PWA
    - Google Lighthouse
  • Rendre une application installable sur un téléphone portable
    -  Server HTTPS
    - Icon (logo de l’application)
    - manifest.json

Ecolage Sf 1200.-

Pré-inscription