- Wie wir Web Components bei GitHub verwenden — Kristján Oddsson spricht darüber, wie GitHub Web Components einsetzt. Ich erinnere mich, dass sie sehr frühe Anwender waren, und hier steht, dass sie 2014 eine
<relative-time>Komponente veröffentlicht haben! Jetzt haben sie eine ganze Reihe von Open-Source-Komponenten. So einfach zu verwenden! Großartig! Ich wollte mir ihren HTML-Code ansehen und sie in Aktion erleben, also habe ich die Quelltextansicht geöffnet und den RegEx(<\w+-[\w|-|]+.*>)(danke, Andrew) verwendet, um danach zu suchen. Sieben auf der eingeloggten Startseite, also blasen sie keinen Rauch. - Verwendung von Web Components zur Kapselung von CSS und zur Lösung von Designsystem-Konflikten — Tyler Williams sagt, dass die Kapselung (Shadow DOM) von Web Components die Vermeidung von Styling-Konflikten mit einem älteren CSS-System bedeutete. Er beweist auch, dass Unternehmen, die Websites für Git-Repositories erstellen, Web Components lieben.
- Container Queries in Web Components — Max Böck teilt mit, dass der
:hosteiner Web Component die@containersein kann, was extrem großartig ist und absolut die Art und Weise, wie alle Web Components geschrieben werden sollten. - Schnellere Integration mit Web Components — Jason Grigsby erledigt Kundenarbeit und sagt, dass Web Components die Integration nicht schnell oder einfach machen, sondern die Integration schnell und einfach machen.
- FicusJS — Ich erinnere mich, dass mir einmal gesagt wurde, dass native Web Components nicht wirklich dafür gedacht waren, "roh" verwendet zu werden, sondern auf niedriger Ebene, sodass darauf Werkzeuge aufgebaut werden könnten. Das sehen wir im Wettbewerb zwischen Renderern, wie lit-html vs htm. Dann, in Schichten von Werkzeugen darüber, wie Ficus hier, das eine Menge schicker Sachen wie Zustand, Methoden und Ereignisse hinzufügt.
- Shadow DOM und seine Auswirkung auf die inoffizielle Styling-API — Jim Nielsen erweitert die Idee, die ich bei ShopTalk angeschnitten habe, dass das DOM die Styling-API ist. Es ist gewissermaßen selbstdokumentierend. „Als Autor müssen Sie Zeit und Mühe darauf verwenden, über eine Styling-API für Ihre Komponente nachzudenken, sie zu entwerfen und dann zu dokumentieren. Und als Verbraucher müssen Sie diese API lesen, verstehen und implementieren.“ Ja. Deshalb erscheint es mir eine gute Idee zu sein, eine Option zu haben, um "auf unkomplizierte Weise in das Shadow DOM von außerhalb von CSS hineinzugreifen".
- Awesome Standalones — Ich denke, Davids Liste hier ist genau das, was Entwickler zum Einstieg bewegt und sie dazu bringt, Web Components als tatsächlich nützlich zu betrachten.
Vor zwei Jahren, stimmt immer noch
Web Component Custom Element Stolpersteine
Web Components haben einige zusätzliche Stolpersteine, die ziemlich knifflig sein können. Ich habe diesen Beitrag geschrieben, um sie zu umgehen.
Eine High-Level-Einführung in Web Components: https://devopedia.org/web-components
Ich liebe die Arbeit mit ihnen, es macht das Leben viel einfacher. War überrascht, dass StencilJS nicht erwähnt wurde. Das ist ein ausgereiftes Werkzeug zum Erstellen davon.
Hallo!
Vielen Dank für das Teilen dieser fantastischen Liste von Ressourcen. Ich glaube, Web Components haben eine solide Zukunft in der Webentwicklung.
Ich schreibe auch regelmäßig über Web Components auf meinem Blog und hoffe, dass meine Web Components 101-Serie für die Web-Community nützlich ist
Warum Web Components verwenden?
Was sind Web Components?
Wie erstelle ich eine Web Component?