- ftt.programania.net basada en web components estandar
- proyecto para aprender web components
- todo puede estar mal. Feedback welcome
- código base para el curso Exprime Javascript
- Empezando a seguir las recomendaciones de Open Wc
- basado en create-lit-app-advanced
- project Evergreen
- https://pwa-starter-kit.polymer-project.org/
- https://github.com/PolymerLabs/start-lit-element
-
minicharlas
-
https://developers.google.com/web/fundamentals/web-components/
-
https://www.dannymoerkerke.com/blog/web-components-will-replace-your-frontend-framework
Ejercicio concreto | Conceptos a entender (temario) |
---|---|
Content Cell | Content Cell |
Content Cell | Content Cell |
- tecnologías y por qué cada una
- flash cards, SQ3R (test), y group mindmapping
- clave invertida
- https://developer.mozilla.org/en-US/docs/Web/Web_Components
- ...
-
greenfield browsers (postcss + babel) : verlo funcionar en iexplorer 11
-
web component
-
custom element
-
shadow dom, light dom
-
selector.attachShadow <-- shadow a cosas que no sean un componente
-
mode = open, mode =...
-
html template (no solo html, también puede tener script y style)
-
document.importNode(
-
html modules <-- por ahora pasando
-
<#shadow-root>
-
<-- es algo propio del shadowdom, no tiene por qué ser un custom element -- extends HTMLElement, connectedCallback(), disconnectedCallback(), attributeChangedCallback() <-- lifecycle
-
customElements.define
- [Novedades del lenguaje] (https://medium.freecodecamp.org/es5-to-esnext-heres-every-feature-added-to-javascript-since-2015-d0c255e13c6e)
-
CSS ::slotted()
-
CSS custom properties
-
:host, :host-context
- ? :-(
-
Constructible stylesheets
-
css modules
-
::part, ::theme
-
tagged template literals
- lit-element, connected callback
- https://github.com/open-wc/lit-demos
- https://open-wc.org/developing/#examples
- ...