Schaunotizen

[00:00:00] Komponentenbibliotheken und Design Systeme

Bevor ins Detail eingestiegen wird, erklärt Fabian erst einmal was eine Komponentenbibliothek überhaupt ist. Ein Hauptziel von Komponentenbibliotheken ist es, Konsistenz zwischen mehreren Applikation herzustellen. Darüberhinaus können sie allerdings auch Mehraufwand deutlich minimieren. So muss beispielsweise bei einem Redesign oder bei einer Erweiterung nicht jedes Featureteam die Änderung umsetzen. Stattdessen kommen Änderungen vom Team der Komponentenbibliothek. Die Basis von Komponentenbibliotheken sind Design Systeme. Als i-Tüpfelchen können Designer:innen und Entwickler:innen Design Tokens verwenden. Design Tokens geben atomic Styles an, die für verschiedene Plattformen, wie iOS, Android oder als Custom Properties für Web, exportiert werden können. Selbstverständlich kann es auch Nachteile geben. Doch diese lassen sich durch Organisation umgehen. Fabians Team arbeitet eng mit dem Designteam zusammen, eigentlich sind sie eher ein Team. Es gibt wöchentliche Designreviews, die für einen frühen Austausch sorgen. Eine wichtige Frage, die sich dann beim Entwickeln stellt ist: Wer ist der Konsument? Ist es ein komplettes Open Source Projekt, wie viele Feature Teams greifen auf die Bibliothek zu? Unabhängig davon, jeder Konsument der Bibliothek wird eine gute Dokumentation benötigen. Noch besser sind sogar Copy & Paste Snippets zum Ausprobieren. Je besser die Dokumentation ist, desto mehr erspart man sich Nachrichten über Chatsysteme mit immer den gleiche Fragen. Weiteres Material in den Links

Links

Angular CDK

Stilfreier Grundbaukasten für barrierefreie Angular Komponenten

Calender Kit

Schon mal ein Kalender-Widget gebaut? Hier gibt’s kopflose Unterstützung.

React-aria

React Hooks von Adobe zur Erstellung barrierefreier Komponenten. Sehr qualitativ!

Headless UI

Headless Components von den Tailwind Machern in React und Vue

Reach

Stilfreie, barrierefreie React Komponenten

Polaris

Das Shopify Design System

Barista

Das Dynatrace Design System

Learnings from building a component Library

Fabians Vortrag auf der NG-DE