Margarete

Schütte-Lihotzky 

Separation of responsibilities 

Maintainability

Use of standards

Manufacturer specialization

Components

Ter

 

@tercosmicqueen

HTML Templates

Custom Elements

Shadow DOM

ES Modules

HTML Imports Modules 

Declaration
Composability
Reusability
Maintainability
Extensibility
Scoping
Interoperability
Productivity
Accessibility

Carlos Angulo

@carlos_acns

ng new kitchen

npm i @angular/elements

npm i @webcomponents/custom-elements

import '@webcomponents/custom-elements/src/native-shim';

import '@webcomponents/custom-elements/custom-elements.min';

pollyfills.ts

ng generate component kitchen-picture

--inline-style  --inline-template  --skip-tests

--view-encapsulation Native

ng build --prod --output-hashing=none && cat dist/{runtime,polyfills,scripts,main}.js | gzip > elements.js.gz

Compile:

Web Components + Angular

By Carlos Alberto Angulo Mendoza