01.10.2024 - By Vanessa Otto, Peter Kröner, Hans Christian Reinl, Stefan Baumgartner, Christian »Schepp« Schaefer
Willkommen zur 600ten Revision unseres Podcasts, die wir am Sonntag, den 7.
Januar 2024, in Form einer live abgehaltenen Fishbowl-Diskussion mit etwas über
zwanzig Gästen durchgeführt haben. Wir haben dabei über drei verschiedene
Themenblöcke gesprochen, die wir per Voting bestimmt haben:
1. Web Components
2. Erwartungen an den Framework-Jungle 2024
3. Design Systeme
Unsere Teilnehmerschar bestand aus ehemalige Gästen wie z.B. Marvin Hagemeister,
Jens Grochtdreis oder Alexander Lichter, aber auch aus vielen neuen Gesichtern.
Darüber haben wir uns sehr gefreut!
SCHAUNOTIZEN
[00:10:38] WEB COMPONENTS
Wir starteten mit den Web Components. Zunächst ging es darum, ob Web Components
überhaupt „einsatzbereit“ seien. Und wir diskutierten, wie sich Web Components
mit anderen Frontend-Frameworks verbinden lassen. Zum Glück gab es bereits
Artikel darüber, wie Frameworks und „Custom Components“ erfolgreich kombiniert
werden können, wie z.B. der „Custom Components Everywhere„. Besonders spannend
war, dass die Seite Reddit anscheinend teilweise bereits mit Web Components
erstellt wurde. Dies war jedoch noch nicht für alle Benutzer verfügbar – in
diesem Fall half der Inkognito-Modus und das Ausloggen -, aber dann konnten die
Teilnehmer die neue Webseite mit Web Components betrachten. Wir haben natürlich
über den Shadow DOM und die damit einhergehenden Probleme gesprochen. Wenn
jemand noch auf der Suche nach überzeugenden Argumenten für Web Components auf
Management-Ebene war, empfahlen wir das Lesen dieses Web Components Elevator
Pitchs.
* https://nolanlawson.com/2023/12/30/shadow-dom-and-the-problem-of-encapsulation/
* https://blog.jim-nielsen.com/2023/html-web-components-an-example/
* https://custom-elements-everywhere.com/
* https://jakelazaroff.com/words/web-components-eliminate-javascript-framework-lock-in/
* https://gomakethings.com/the-elevator-pitch-for-web-components/
* https://openui5.org/
* https://sap.github.io/ui5-webcomponents/
* https://livebook.manning.com/book/micro-frontends-in-action/
* https://caniuse.com/declarative-shadow-dom
[00:56:54] ERWARTUNGEN AN DEN FRAMEWORK-JUNGLE 2024
Die Diskussion ging nahtlos zum Thema Frontend-Frameworks über. Zuerst haben wir
darüber gesprochen, ob die Teilnehmer:innen zu dieser Zeit „FOMO“ (Fear of
missing out) in Bezug auf die aktuellen Frontend Frameworks empfanden. Danach
haben wir erörtert, wie viele verschiedene Frameworks tatsächlich in der
„Realität“, also in Arbeitsprojekten, verwendet wurden. Einige Personen haben
ihre Erfahrungen geteilt, wie sie Frameworks oder Bibliotheken wie NPM-Pakete
komplett ausgetauscht haben. Wir haben die Vor- und Nachteile der Verwendung von
Bibliotheken im Allgemeinen besprochen. Marvin hat in diesem Zusammenhang
passenderweise den Link zu einem XKCD-Comic über Bibliotheken im Web geteilt.
* https://workingdraft.de/595/ (HTML over the Wire)
* https://workingdraft.de/576/ (Qwik)
* https://workingdraft.de/584/ (Solid & Solidstart)
* https://workingdraft.de/552/ (Frontend-Development im Jahr 2023)
* https://workingdraft.de/405/ (rollup.js)
* https://marvinh.dev/blog/speeding-up-javascript-ecosystem-part-8/
* https://vinxi.vercel.app/
* https://github.com/unjs/
* https://workingdraft.de/565/ (Quo Vadis Frontend-Tooling?)
* https://socket.dev/blog/when-everything-becomes-too-much
[01:59:55] DESIGN SYSTEME
Mit einer fulminannten Überleitung von Hans gelangten wir zum Thema Design
Systeme. Sowohl in der Live-Diskussion als auch im Chat gingen viele Themen hin
und her. Wir sprachen darüber, wer in Projekten für die Instandhaltung von
Pattern Libraries verantwortlich ist. Es stellte sich auch heraus, dass es bei
dem Thema viel um Kommunikation geht. Die Teilnehmenden nannten Tools wie
Storybook, story.to.design, Histoire, UXPin und Ladle. Schließlich eröffnete
Hannah die Diskussion darüber, wer tatsächlich mit „Design Systemen“ und nicht
nur Pattern Libraries im Designbereich, beispielsweise mit Figma, arbeitete.
* https://histoire.dev/guide/getting-started.html
* https://help.figma.com/hc/en-us/articles/360045003494-Storybook-and-Figma
* https://story.to.design/
* https://www.uxpin.com/
* https://ladle.dev/
* https://fractal.build/
* https://www.youtube.com/watch?v=qtAu1V6v6YQ (Exploring the Anatomy of Design
Systems)
* https://esilva.net/sociotechnical/sociotechnical-architecture_why-and-what.html