My shiny wall by https://padlet.com/gabrielad0828/yyi5r9jq9623 Made with a curious mind en-us 2018-05-17 12:18:51 UTC 2018-05-24 12:33:56 UTC hello@padlet.com Nombre: Gabriela Davis gabrielad0828 https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/261546151 Grado: X°A
Fecha: 17-5-18
Web Component]]> 2018-05-17 12:20:46 UTC https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/261546151 ¿Qué es Web Component? gabrielad0828 https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/261547917 Son un conjunto de características que actualmente están siendo añadidas por el W3C a las especificaciones HTML y DOM de forma que permite la creación de widgets o componentes reutilizables en documentos y aplicaciones web.]]> 2018-05-17 12:25:04 UTC https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/261547917 Características gabrielad0828 https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/261554225 Elementos personalizados
Hay dos tipos de elementos personalizados: autónomos e integrados.
Shadow DOM
Shadow DOM es una funcionalidad que permite al navegador web renderizar elementos DOM sin necesidad de insertarlos en el árbol principal DOM del documento.
Importar HTML
HTML import es una herramienta para incluir documentos HTML y componentes web de fuentes externas sin necesidad de utilizar peticiones AJAX y métodos similares.
Plantillas HTML
La plantilla HTML es una forma de crear fragmentos de inserción de HTML que se usan a voluntad. 
]]> 2018-05-17 12:41:15 UTC https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/261554225 Usos de Web Component gabrielad0828 https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/261557496 Web Component puede ser usado sin escribir código, simplemente añadiendo una sentencia para importarlo en una página HTML. Web Components usa capacidades estándar, nuevas o aún en desarrollo, del navegador.
Con Web Components, puedes hacer casi cualquier cosa que pueda ser hecha con HTML, CSS y JavaScript, y puede ser un componente portable que puede ser reutilizado fácilmente.]]> 2018-05-17 12:49:21 UTC https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/261557496 Tecnologías que usan gabrielad0828 https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/263317222
  • Custom Elements: permite definir nuevos tipos de elementos.
  • HTML Imports: permite importar archivos HTML dentro de otro HTML .
  • Templates: las plantillas permiten crear trozos de HTML que pueden ser replicados tantas veces como sea necesario.
  • Shadow DOM: Es la tecnología que nos permite encapsular trozos de HTML, aislando consigo código CSS y JavaScript para que no le afecte el código de la página. 
    • ]]>     2018-05-24 12:11:07 UTC https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/263317222     ¿Cómo se usa? gabrielad0828 https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/263321117 Para poder empezar a usar un Web Component, sólo tenemos que importarlo desde la cabecera o etiqueta head de la página que lo vaya a usar mediante la siguiente etiqueta:

    <link rel="import" href="ejemplo-componente.html">

    Dentro de ese HTML tendremos todo el código HTML, JavaScript y CSS necesario para su funcionamiento.

     

    ]]>     2018-05-24 12:25:12 UTC https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/263321117     ¿En qué consiste? gabrielad0828 https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/263322332 La especificación de los Web Components empezó a desarrollarse hace aproximadamente un par de años, aunque algunas de las tecnologías que utiliza empezaron antes. Suponen una revolución en el mundo del desarrollo Web en términos de reutilización y encapsulación de código cliente, ya que permiten encapsular código HTML, CSS y JavaScript, de forma que no puede ser afectado por el código de la página que lo incluye. Si queremos modificar el estilo de un Web Component desde fuera de su código, podemos hacerlo, pero tendría que ser a propósito.]]> 2018-05-24 12:29:41 UTC https://padlet.com/gabrielad0828/yyi5r9jq9623/wish/263322332