Web Component

Vodeclic MasterClass

Plan


  • Qui ?
  • Quoi ?
  • Pourquoi ?
  • Comment ?

Qui ?


W3C

Supporté par : 
Google / Polymer
Firefox / Polyfill x-tag + Brick

Quoi ?


  • Template
  • Element
  • Shadow DOM

Template





HTML Clonable

Element




  • Custom HTML tags
  • Custom API

Shadow DOM





Building encapsulation

Iframe ???



  • Permet l'encapsulation
  • Très restictif & très lourd

Pourquoi ?



  • Réutilisation
  • Autonomie
    • Naming Scope
    • CSS Scope
    • JS Scope
  • Web OO

Comment ?





Démo !
Made with Slides.com