Votre partenaire formation 100% digital

Polymer JS V.3

Créez et combinez des « Web Components » avec Polymer JS 3 pour réaliser des applications web de nouvelle génération

  • Formateur(s)

    Formateur Cedric LE GALLO
    Cédric LE GALLO
  • Référence

    PJS03

  • Durée

    3 jours (21h)

  • Prix unitaire HT

    1650 €

pictogramme calendrier Prochaines sessions

Prochaines sessions - Polymer JS V.3
Date de début Ville Prix unitaire HT
Sur demande

pictogramme information Description

Polymer JS est un Framework JavaScript créé par Google. Composé d’un ensemble d’éléments découplés (séparation du code HTML, CSS et JavaScript) et réutilisables de façon autonome, il répond aux nouveaux standards du développement Web. Polymer JS permet de créer des applications Web ou Mobile qui offrant les même possibilités qu’un client riche, et de réutiliser les composants développés pour d’autres applications.

Cette formation pratique donne une vision complète du Framework dans sa version 3, depuis son architecture jusqu’à sa mise en œuvre complète dans le cadre d’une application Web.

pictogramme progamme Objectifs pédagogiques

  • Comprendre le standard Web Components
  • Utiliser Polymer 3 pour réaliser des application Single Page
  • Comprendre les outils associés à Polymer 3
  • Utiliser lit-html comme langage de Templating
  • Maîtriser les concepts de Polymer 3

pictogramme cible Public cible

Architectes techniques, Chefs de projet Web, Développeurs, Experts front-end, Intégrateurs

pictogramme check liste Pré-requis

Connaissance de base en HTML, CSS, JavaScript et concepts objet

Modalités d’évaluation

L’évaluation des acquis se fait tout au long de la session au travers d’ateliers de mise en pratique des notions et concepts abordés pendant la formation.

Dernière mise à jour : février 2022

pictogramme information Programme de la formation

Introduction et généralités

  • Rôle d’un framework
  • Les Composants
  • Spécification `Web Components`
  • Histoire de Polymer

EcmaScript 2017

  • Nouvelles Syntaxes du langage JavaScript
  • Développement avec les modules
  • Nouvelles API utiles
  • Async/Await

Environnement de travail Polymer

  • node, npm & yarn
  • webpack
  • Web Component en 2018
  • Polymer CLI

Utilisation d’un `Web Component`

  • Import d’un élément
  • Invocation d’un élément
  • Passage de paramètre
  • Appel de méthode
  • Cycle de vie V3

Langage de Templating

  • Templating Polymer
  • Bindings
  • Propriétés
  • Méthodes
  • Directives Polymer

Concepts Polymer

  • Built-in Méthodes
  • Mixins
  • Bonnes pratiques

Création d’un élément Polymer

  • Les différents extends
  • Les propriétés en détails
  • Les événements
  • L’apparence
  • Tester le composant

L’alternative Lit-html

  • Utiliser lit-html dans un projet Web
  • Utiliser LitElemenent
  • Les différences avec PolymerElement

Polymer Data System

  • Concepts
  • Objets et Tableaux
  • Complex observer & Computed Properties
  • Data Binding
  • Mediator Pattern
  • Gestion uni-directionnelle / bi-directionnelle
  • Exemple concrêt

Polymer et application

  • Routing avec Page.js
  • Requêter un Web Service

Conclusion

  • Aller plus loin avec Redux, RxJS
  • Synthèse de la formation
  • Remise des documents
  • Quelques ressources utiles