<p>Neue TypeScript-Version, Stefan und Peter, Abschweifen. Ihr kennt das Spiel.</p>
<hr><aside class="message long-message" style="overflow: hidden">
<h2>JSCraftCamp</h2>
<p><a href="https://jscraftcamp.org/"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 256px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2023/06/jscraftcamp-2023.png" alt="" /><br />
</a></p>
<div class="message_content">
Das JSCraftCamp ist eine zweitägige Unkonferenz, bei der es um Software-Crafting von JavaScript-getriebener Software geht. Hier könnt Ihr nicht nur Euer Sprachverständnis gemeinsam mit anderen aufbauen oder schärfen, es können auch Programmierpattern, Frameworks oder Transpiler Themen für Sessions sein. Da es sich um eine Unkonferenz handelt, gestaltet Ihr alle das Programm zusammen, nach Euren Wünschen!</p>
<p><strong>Wann:</strong> Am 30. Juni und 1. Juli 2023<br />
<strong>Wo:</strong> codecentric, August-Everding-Str. 20, 81671 München</p>
<p>Alle Infos unter <a href="https://jscraftcamp.org/">jscraftcamp.org</a>.
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:01:27] <a href="https://devblogs.microsoft.com/typescript/announcing-typescript-5-1-beta">TypeScript 5.1</a></dt>
<dd>Bevor wir uns in die neuen Features von TS5.1 stürzen, blicken wir zurück auf die in <a href="https://workingdraft.de/560/">Revision 560</a> besprochene Version 5.0 und überlegen, warum sich bisher (die nun ja auch in ECMAScript standardisierten) Decorators nicht weiter durchgesetzt haben – Schwenks zu <a href="https://yehudakatz.com/">Yehuda Katz</a> und <a href="https://emberjs.com/">Ember</a> bzw. <a href="https://glimmerjs.com/">Glimmer</a> inklusive. An der Feature-Front beginnt der Abbau der Unterschiede zwischen <code>void</code> (nicht zu verwechseln mit <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/void"><code>void</code></a>, siehe <a href="https://fettblog.eu/void-in-javascript-and-typescript/">Stefans Artikel zum Thema</a>) und <code>undefined</code>, was wir begrüßen. Ebenfalls aufgeweicht werden die Anforderungen an die Typen von Getter and Setter-Signaturen, v.a. um Legacy-Use-Cases rund um Stylesheets (jenseits von <a href="https://web.dev/constructable-stylesheets/">Constructable Stylesheets</a>) zu bedienen. Anlässlich diverser Anpassungen der JSX-Typen (u.a. für mögliche zukünftige <a href="https://github.com/acdlite/rfcs/blob/first-class-promises/text/0000-first-class-support-for-promises.md">Promise-Komponenten in React</a>) waschen wir ein wenig React-Schmutzwäsche und feiern und besprechen die Genese des <a href="https://www.npmjs.com/package/dt-app">Dynatrace App Toolkit</a>. Da uns zu den weiteren Kleinigkeiten nicht ganz so viel einfällt, verlegen wir uns zum Ende hin auf Werbung! Peter empfiehlt <a href="https://marketplace.visualstudio.com/items?itemName=yoavbls.pretty-ts-errors">eine VS-Code-Extension</a> für schönere TypeScript-Fehlermeldungen und hat einen <a href="https://www.peterkroener.de/typescript-funktionen-mit-unknown-parametern-ueberladen/">Text zu unknown-Overloads</a> geschrieben, wohingegen Stefan gleich <a href="https://www.oreilly.com/library/view/typescript-cookbook/9781098136642/">ein ganzes zweites Buch zu TypeScript</a> zur Papier gebracht hat.</dd>
</dl>


Neue TypeScript-Version, Stefan und Peter, Abschweifen. Ihr kennt das Spiel.


JSCRAFTCAMP




Das JSCraftCamp ist eine zweitägige Unkonferenz, bei der es um Software-Crafting
von JavaScript-getrieben…

Working Draft

Neue TypeScript-Version, Stefan und Peter, Abschweifen. Ihr kennt das Spiel.


JSCRAFTCAMP




Das JSCraftCamp ist eine zweitägige Unkonferenz, bei der es um Software-Crafting
von JavaScript-getriebener Software geht. Hier könnt Ihr nicht nur Euer
Sprachverständnis gemeinsam mit anderen aufbauen oder schärfen, es können auch
Programmierpattern, Frameworks oder Transpiler Themen für Sessions sein. Da es
sich um eine Unkonferenz handelt, gestaltet Ihr alle das Programm zusammen, nach
Euren Wünschen!



Wann: Am 30. Juni und 1. Juli 2023
Wo: codecentric, August-Everding-Str. 20, 81671 München

Alle Infos unter jscraftcamp.org.


SCHAUNOTIZEN

[00:01:27] TYPESCRIPT 5.1

Bevor wir uns in die neuen Features von TS5.1 stürzen, blicken wir zurück auf
die in Revision 560 besprochene Version 5.0 und überlegen, warum sich bisher
(die nun ja auch in ECMAScript standardisierten) Decorators nicht weiter
durchgesetzt haben – Schwenks zu Yehuda Katz und Ember bzw. Glimmer inklusive.
An der Feature-Front beginnt der Abbau der Unterschiede zwischen void (nicht zu
verwechseln mit void, siehe Stefans Artikel zum Thema) und undefined, was wir
begrüßen. Ebenfalls aufgeweicht werden die Anforderungen an die Typen von Getter
and Setter-Signaturen, v.a. um Legacy-Use-Cases rund um Stylesheets (jenseits
von Constructable Stylesheets) zu bedienen. Anlässlich diverser Anpassungen der
JSX-Typen (u.a. für mögliche zukünftige Promise-Komponenten in React) waschen
wir ein wenig React-Schmutzwäsche und feiern und besprechen die Genese des
Dynatrace App Toolkit. Da uns zu den weiteren Kleinigkeiten nicht ganz so viel
einfällt, verlegen wir uns zum Ende hin auf Werbung! Peter empfiehlt eine
VS-Code-Extension für schönere TypeScript-Fehlermeldungen und hat einen Text zu
unknown-Overloads geschrieben, wohingegen Stefan gleich ein ganzes zweites Buch
zu TypeScript zur Papier gebracht hat.

Revision 571: TypeScript 5.1

<p>In dieser Revision sprechen Hans und Vanessa (Working Draft Host | Frontend Lead bei <a href="https://www.zavvy.io/">zavvy.io</a>) über dein Einbau von KI in die Website. Es werden verschiedene Aspekte der Integration von künstlicher Intelligenz (KI) diskutiert, insbesondere im Hinblick auf die Herausforderungen und Lösungen, die bei diesem Prozess auftreten können.</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://workshops.de/workingdraft?ref=workingdraft.de"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 500px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2022/12/Working-Draft-Banner.jpg" alt="" /></a></p>
<div class="message_content">
<p>Workshops.DE bietet IT-Schulungen für moderne Web-Entwicklung. Dabei arbeitet Workshops.DE nicht als reiner Vermittler, sondern bildet eine Community aus über 80 Trainer:innen, welche gemeinsam Material erstellen, sich gegenseitig unterstützen und weiterbilden, um möglichst nachhaltige und hochqualitative Weiterbildungsangebote zu schaffen.</p>
<p>Ein starker Fokus liegt hierbei auf den Frontend-Frameworks Angular, React und Vue. Neben diesen gibt es aber auch Weiterbildungen im Bereich Docker, Kubernetes und Spring Boot. Zum Netzwerk gehören ebenfalls die Community-Portale Angular.DE, ReactJS.DE und VueJS.DE.</p>
<p>Seid ihr auf der Suche nach einer qualitativen Weiterbildung im Bereich Web-Entwicklung oder möchtet euch selbst als Trainer:in einbringen? Dann seid ihr bei <a href="https://workshops.de/workingdraft?ref=workingdraft.de">Workshops.DE</a> genau richtig.</p>
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:20] KI: Integration leicht gemacht</dt>
<dd>Vanessa hat im Vorfeld eine umfassende Evaluierung verschiedener Editoren durchgeführt und sich schließlich für <a href="https://tiptap.dev/">Tiptap</a> entschieden. Alternativen waren <a href="https://editorjs.io/">Editor.js</a>, <a href="https://ckeditor.com/">CKEditor</a>, <a href="https://www.tiny.cloud/docs/tinymce/6/">Tiny MCE</a>, und noch viele mehr. Die Hauptkriterien für ihre Entscheidung waren die Flexibilität und die Möglichkeit zur Erweiterung um eigene Blöcke und Knoten. Der Editor Tiptap ermöglicht es, dass eine KI-Komponente integriert wird, die mittels einer eigenen Backend-Kommunikation und der <a href="https://platform.openai.com/docs/guides/completion">OpenAI Completion API</a> betrieben wird.</p>
<p>Während des Integrationsprozesses stellte sich das sogenannte Prompt Engineering als eine neue Herausforderung dar. Vanessa konzentrierte sich hierbei hauptsächlich auf das Frontend, um die richtigen Endpunkte im Backend aufzurufen und die nachfolgenden Aktionen wie das Auswechseln oder Hinzufügen von Texten zu verbinden. Eine wichtige Überlegung war dabei, dass bei manchen Anfragen Texte komplett ausgetauscht werden mussten, während sie bei anderen Anfragen an den bestehenden Text angehängt werden mussten.</p>
<p>Ein großer Bestandteil des Integrationsprozesses war auch das Feedback-Management, welches einen wichtigen Beitrag zur kontinuierlichen Verbesserung des Modells geleistet hat. Durch das Feedback konnte das Modell regelmäßig trainiert und optimiert werden, was zu einer verbesserten Genauigkeit und Effektivität der KI-Komponente führte.</dd>
</dl>


In dieser Revision sprechen Hans und Vanessa (Working Draft Host | Frontend Lead
bei zavvy.io) über dein Einbau von KI in die Website. Es werden verschiedene
Aspekte der Integration von künstlicher In…

In dieser Revision sprechen Hans und Vanessa (Working Draft Host | Frontend Lead
bei zavvy.io) über dein Einbau von KI in die Website. Es werden verschiedene
Aspekte der Integration von künstlicher Intelligenz (KI) diskutiert,
insbesondere im Hinblick auf die Herausforderungen und Lösungen, die bei diesem
Prozess auftreten können.


UNSER SPONSOR



Workshops.DE bietet IT-Schulungen für moderne Web-Entwicklung. Dabei arbeitet
Workshops.DE nicht als reiner Vermittler, sondern bildet eine Community aus über
80 Trainer:innen, welche gemeinsam Material erstellen, sich gegenseitig
unterstützen und weiterbilden, um möglichst nachhaltige und hochqualitative
Weiterbildungsangebote zu schaffen.

Ein starker Fokus liegt hierbei auf den Frontend-Frameworks Angular, React und
Vue. Neben diesen gibt es aber auch Weiterbildungen im Bereich Docker,
Kubernetes und Spring Boot. Zum Netzwerk gehören ebenfalls die Community-Portale
Angular.DE, ReactJS.DE und VueJS.DE.

Seid ihr auf der Suche nach einer qualitativen Weiterbildung im Bereich
Web-Entwicklung oder möchtet euch selbst als Trainer:in einbringen? Dann seid
ihr bei Workshops.DE genau richtig.


SCHAUNOTIZEN

[00:02:20] KI: INTEGRATION LEICHT GEMACHT

Vanessa hat im Vorfeld eine umfassende Evaluierung verschiedener Editoren
durchgeführt und sich schließlich für Tiptap entschieden. Alternativen waren
Editor.js, CKEditor, Tiny MCE, und noch viele mehr. Die Hauptkriterien für ihre
Entscheidung waren die Flexibilität und die Möglichkeit zur Erweiterung um
eigene Blöcke und Knoten. Der Editor Tiptap ermöglicht es, dass eine
KI-Komponente integriert wird, die mittels einer eigenen Backend-Kommunikation
und der OpenAI Completion API betrieben wird.



Während des Integrationsprozesses stellte sich das sogenannte Prompt Engineering
als eine neue Herausforderung dar. Vanessa konzentrierte sich hierbei
hauptsächlich auf das Frontend, um die richtigen Endpunkte im Backend aufzurufen
und die nachfolgenden Aktionen wie das Auswechseln oder Hinzufügen von Texten zu
verbinden. Eine wichtige Überlegung war dabei, dass bei manchen Anfragen Texte
komplett ausgetauscht werden mussten, während sie bei anderen Anfragen an den
bestehenden Text angehängt werden mussten.

Ein großer Bestandteil des Integrationsprozesses war auch das
Feedback-Management, welches einen wichtigen Beitrag zur kontinuierlichen
Verbesserung des Modells geleistet hat. Durch das Feedback konnte das Modell
regelmäßig trainiert und optimiert werden, was zu einer verbesserten Genauigkeit
und Effektivität der KI-Komponente führte.

Revision 570: KI: Integration leicht gemacht

<p>In dieser Revision des Working Draft Podcasts dürfen wir Matthias Endler (<a href="https://endler.dev/">Web</a> / <a href="https://github.com/mre">GitHub</a> / <a href="https://twitter.com/matthiasendler">Twitter</a> / <a href="https://mastodon.social/@mre">Mastodon</a>) als Gast begrüßen, der sich als selbständiger Softwareentwickler und <a href="https://corrode.dev/">Consultant</a>, hauptsächlich in der Programmiersprache Rust verdingt. Ursprünglich aus Bayern, hat Matthias Informatik in Bayreuth studiert und arbeitete ab 2014 für Trivago in Düsseldorf. Er hat viele Erfahrungen mit Backend-Entwicklung, insbesondere mit Elastic Search, Containern und Cloud-Technologien. Er ist Mitbetreiber der Plattform &#8222;<a href="https://openpodcast.app/">Open Podcast</a>&#8222;, Autor einer Video-Serie namens &#8222;<a href="https://hello-rust.show/">Hello, Rust!</a>&#8220; und Erfinder der GitHub &#8222;<a href="https://codeprints.dev/">codeprints</a>&#8222;.</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://mittwald.de/workingdraft?ref=workingdraft.de"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 350px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2023/03/Podcast_Banner_Mittwald_-Hosting_neu_gedacht_945x314px.jpg" alt="" /></a></p>
<div class="message_content">
<p>Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die Decke gehen, deine Seite bleibt immer rasend schnell.</p>
<p>mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur, benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting. Also, worauf wartest du? Geh jetzt auf <a href="https://mittwald.de/workingdraft?ref=workingdraft.de">mittwald.de/workingdraft</a> und buch dein erstes Projekt!</p>
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:23] Von Link-Checkern und Rabbit Holes</dt>
<dd>Matthias ist unter anderem Autor des URL-Crawlers/Link-Checkers <a href="https://github.com/lycheeverse/lychee">lychee</a> und wir wollen heute über die vielen Aspekte eines solchen Unterfangens sprechen, die man gemeinhin nicht sieht oder bedenkt. Matthias entwickelte den Crawler als Tool, um eine wachsende <a href="https://analysis-tools.dev/">Liste von Code-Analyse-Tools</a> für PHP zu verwalten. Die Liste begann als einfache Markdown-Datei und wuchs schließlich auf über 700 Tools und zog auf GitHub 11.000 Sterne an. Matthias fand jedoch heraus, dass die Wartung der Liste mit all ihren Links eine zeitaufwendige und frustrierende Aufgabe war. Aus diesem Grund entschied er sich, einen Link-Checker zu verwenden. Er testete verschiedene vorhandene Link-Checker, fand aber kein Tool, das seinen Anforderungen entsprach. Daher entschied er sich, sein eigenes Tool zu entwickeln. Was zunächst wie eine einfache Aufgabe klang, entpuppte sich als eine Herausforderung mit vielen Hürden und Lernmöglichkeiten. Und was als Wochenendprojekt begann, entwickelte sich zu einem größeren Projekt, als andere Entwickler auf sein Tool aufmerksam wurden und es nutzen wollten.</dd>
</dl>


In dieser Revision des Working Draft Podcasts dürfen wir Matthias Endler (Web /
GitHub / Twitter / Mastodon) als Gast begrüßen, der sich als selbständiger
Softwareentwickler und Consultant, hauptsächl…

In dieser Revision des Working Draft Podcasts dürfen wir Matthias Endler (Web /
GitHub / Twitter / Mastodon) als Gast begrüßen, der sich als selbständiger
Softwareentwickler und Consultant, hauptsächlich in der Programmiersprache Rust
verdingt. Ursprünglich aus Bayern, hat Matthias Informatik in Bayreuth studiert
und arbeitete ab 2014 für Trivago in Düsseldorf. Er hat viele Erfahrungen mit
Backend-Entwicklung, insbesondere mit Elastic Search, Containern und
Cloud-Technologien. Er ist Mitbetreiber der Plattform „Open Podcast„, Autor
einer Video-Serie namens „Hello, Rust!“ und Erfinder der GitHub „codeprints„.


UNSER SPONSOR



Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie
wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die
Decke gehen, deine Seite bleibt immer rasend schnell.

mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und
Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur,
benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server
selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs
kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen
Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade
beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine
Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet
bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting.
Also, worauf wartest du? Geh jetzt auf mittwald.de/workingdraft und buch dein
erstes Projekt!


SCHAUNOTIZEN

[00:02:23] VON LINK-CHECKERN UND RABBIT HOLES

Matthias ist unter anderem Autor des URL-Crawlers/Link-Checkers lychee und wir
wollen heute über die vielen Aspekte eines solchen Unterfangens sprechen, die
man gemeinhin nicht sieht oder bedenkt. Matthias entwickelte den Crawler als
Tool, um eine wachsende Liste von Code-Analyse-Tools für PHP zu verwalten. Die
Liste begann als einfache Markdown-Datei und wuchs schließlich auf über 700
Tools und zog auf GitHub 11.000 Sterne an. Matthias fand jedoch heraus, dass die
Wartung der Liste mit all ihren Links eine zeitaufwendige und frustrierende
Aufgabe war. Aus diesem Grund entschied er sich, einen Link-Checker zu
verwenden. Er testete verschiedene vorhandene Link-Checker, fand aber kein Tool,
das seinen Anforderungen entsprach. Daher entschied er sich, sein eigenes Tool
zu entwickeln. Was zunächst wie eine einfache Aufgabe klang, entpuppte sich als
eine Herausforderung mit vielen Hürden und Lernmöglichkeiten. Und was als
Wochenendprojekt begann, entwickelte sich zu einem größeren Projekt, als andere
Entwickler auf sein Tool aufmerksam wurden und es nutzen wollten.

Revision 569: Von Link-Checkern und Rabbit Holes

<p>Anlässlich des Abschlusses seiner Blogpost-Serie &#8222;<a href="https://www.matuzo.at/blog/2022/100-days-of-more-or-less-modern-css/">100 Days Of More Or Less Modern CSS</a>&#8222;, luden wir Manuel Matuzović, Frontend-Entwickler und Accessibility-Experte aus Graz (<a href="https://www.matuzo.at">Web</a> / <a href="https://front-end.social/@matuzo">Mastodon</a>), in unseren Podcast ein, um zunächst über seine Motivation zu dieser Serie und schließlich auch über die spannendsten seiner gewonnenen Erkenntnisse in Sachen CSS zu sprechen. <a href="https://workingdraft.de/531/">Manuel war zuvor schon einmal zum Thema HTML-Crafting bei uns zu Gast</a>.</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://mittwald.de/workingdraft?ref=workingdraft.de"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 350px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2023/03/Podcast_Banner_Mittwald_-Hosting_neu_gedacht_945x314px.jpg" alt="" /></a></p>
<div class="message_content">
<p>Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die Decke gehen, deine Seite bleibt immer rasend schnell.</p>
<p>mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur, benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting. Also, worauf wartest du? Geh jetzt auf <a href="https://mittwald.de/workingdraft?ref=workingdraft.de">mittwald.de/workingdraft</a> und buch dein erstes Projekt!</p>
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:12] <a href="https://www.matuzo.at/blog/2022/100-days-of-more-or-less-modern-css/">100 Days Of More Or Less Modern CSS</a></dt>
<dd>
<ul>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day1/">Day 1: custom properties and fallbacks</a></li>
<li><a href="https://www.youtube.com/watch?v=ZuZizqDF4q8">Lea Verou &#8211; Custom Variables Secrets</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day93/">Day 93: the lch() color function</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day98/">Day 98: oklab() and oklch()</a></li>
<li><a href="https://bottosson.github.io/posts/oklab/">Björn Ottosson: A perceptual color space for image processing (OKLAB)</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day95/">Day 95: the color-mix() function</a></li>
<li><a href="https://www.youtube.com/watch?v=zkun6wAPc1s">Chris Lilley &#8211; Escaping the sRBG Prison</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day92/">Day 92: relative color syntax</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day75/">Day 75: font palettes</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day76/">Day 76: overwriting colors in font palettes</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day22/">Day 22: the ::backdrop pseudo-element</a></li>
<li><a href="https://kilianvalkhof.com/2023/css-html/backdrop-doesnt-inherit-from-anywhere/">Kilian Valhof &#8211; ::backdrop doesn’t inherit from anywhere</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day36/">Day 36: :has() and pseudo-elements</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day50/">Day 50: :has(:not()) vs. :not(:has())</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day91/">Day 91: a previous sibling selector with :has()</a></li>
<li><a href="https://twitter.com/mxbck/status/1433799539379609605">Der &#8222;Max Böck Offset&#8220;</a></li>
<li><a href="https://blogs.windows.com/msedgedev/2023/01/17/the-truth-about-css-selector-performance/">Microsoft Edge / Patrick Brosset &#8211; The truth about CSS selector performance</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day99/">Day 99: native nesting</a></li>
<li><a href="https://sass-lang.com/dart-sass">Dart Sass</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day2/">Day 2: logical properties</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day3/">Day 3: logical property shorthands</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day9/">Day 9: the inset shorthand property</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day31/">Day 31: logical border properties</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day44/">Day 44: logical floating and clearing</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day77/">Day 77: block-size, inline-size, vi, and vb</a></li>
<li><a href="https://rtlstyling.com/">Ahmad Shadeed &#8211; RTL Styling 101</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day96/">Day 96: the margin-trim property</a></li>
<li><a href="https://alistapart.com/article/axiomatic-css-and-lobotomized-owls/">Heydon Pickering &#8211; Axiomatic CSS and Lobotomized Owls</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day82/">Day 82: value processing</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day63/">Day 63: explicit defaulting with inherit, initial, unset, and revert</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day74/">Day 74: using !important in cascade layers</a></li>
<li><a href="https://www.youtube.com/watch?v=dS123IXPcJ0">Una Kravets &#8211; How does !important actually work? (It&#8217;s not what you think!)</a></li>
<li><a href="https://www.youtube.com/watch?v=zEPXyqj7pEA">Bramus Van Damme &#8211; The CSS Cascade, a deep dive</a></li>
<li><a href="https://www.matuzo.at/blog/2022/100daysof-day48/">Day 48: inset 0</a></li>
<li><a href="https://www.matuzo.at/blog/2023/100daysof-day84/">Day 84: the @property at-rule</a></li>
</ul>
</dd>
</dl>


Anlässlich des Abschlusses seiner Blogpost-Serie „100 Days Of More Or Less
Modern CSS„, luden wir Manuel Matuzović, Frontend-Entwickler und
Accessibility-Experte aus Graz (Web / Mastodon), in unseren …

Anlässlich des Abschlusses seiner Blogpost-Serie „100 Days Of More Or Less
Modern CSS„, luden wir Manuel Matuzović, Frontend-Entwickler und
Accessibility-Experte aus Graz (Web / Mastodon), in unseren Podcast ein, um
zunächst über seine Motivation zu dieser Serie und schließlich auch über die
spannendsten seiner gewonnenen Erkenntnisse in Sachen CSS zu sprechen. Manuel
war zuvor schon einmal zum Thema HTML-Crafting bei uns zu Gast.


UNSER SPONSOR



Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie
wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die
Decke gehen, deine Seite bleibt immer rasend schnell.

mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und
Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur,
benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server
selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs
kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen
Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade
beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine
Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet
bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting.
Also, worauf wartest du? Geh jetzt auf mittwald.de/workingdraft und buch dein
erstes Projekt!


SCHAUNOTIZEN

[00:02:12] 100 DAYS OF MORE OR LESS MODERN CSS

 * Day 1: custom properties and fallbacks
 * Lea Verou – Custom Variables Secrets
 * Day 93: the lch() color function
 * Day 98: oklab() and oklch()
 * Björn Ottosson: A perceptual color space for image processing (OKLAB)
 * Day 95: the color-mix() function
 * Chris Lilley – Escaping the sRBG Prison
 * Day 92: relative color syntax
 * Day 75: font palettes
 * Day 76: overwriting colors in font palettes
 * Day 22: the ::backdrop pseudo-element
 * Kilian Valhof – ::backdrop doesn’t inherit from anywhere
 * Day 36: :has() and pseudo-elements
 * Day 50: :has(:not()) vs. :not(:has())
 * Day 91: a previous sibling selector with :has()
 * Der „Max Böck Offset“
 * Microsoft Edge / Patrick Brosset – The truth about CSS selector performance
 * Day 99: native nesting
 * Dart Sass
 * Day 2: logical properties
 * Day 3: logical property shorthands
 * Day 9: the inset shorthand property
 * Day 31: logical border properties
 * Day 44: logical floating and clearing
 * Day 77: block-size, inline-size, vi, and vb
 * Ahmad Shadeed – RTL Styling 101
 * Day 96: the margin-trim property
 * Heydon Pickering – Axiomatic CSS and Lobotomized Owls
 * Day 82: value processing
 * Day 63: explicit defaulting with inherit, initial, unset, and revert
 * Day 74: using !important in cascade layers
 * Una Kravets – How does !important actually work? (It’s not what you think!)
 * Bramus Van Damme – The CSS Cascade, a deep dive
 * Day 48: inset 0
 * Day 84: the @property at-rule

Revision 568: 100 Days Of More Or Less Modern CSS

<p><a href="https://mastodon.social/@sir_pepe/109856941965482875">Ein harmloser Trollversuch auf Mastodon</a> endet in einer stundenlangen Grundsatzdebatte zwischen Stefan und Peter.</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://workshops.de/workingdraft?ref=workingdraft.de"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 500px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2022/12/Working-Draft-Banner.jpg" alt="" /></a></p>
<div class="message_content">
<p>Workshops.DE bietet IT-Schulungen für moderne Web-Entwicklung. Dabei arbeitet Workshops.DE nicht als reiner Vermittler, sondern bildet eine Community aus über 80 Trainer:innen, welche gemeinsam Material erstellen, sich gegenseitig unterstützen und weiterbilden, um möglichst nachhaltige und hochqualitative Weiterbildungsangebote zu schaffen.</p>
<p>Ein starker Fokus liegt hierbei auf den Frontend-Frameworks Angular, React und Vue. Neben diesen gibt es aber auch Weiterbildungen im Bereich Docker, Kubernetes und Spring Boot. Zum Netzwerk gehören ebenfalls die Community-Portale Angular.DE, ReactJS.DE und VueJS.DE.</p>
<p>Seid ihr auf der Suche nach einer qualitativen Weiterbildung im Bereich Web-Entwicklung oder möchtet euch selbst als Trainer:in einbringen? Dann seid ihr bei <a href="https://workshops.de/workingdraft?ref=workingdraft.de">Workshops.DE</a> genau richtig.</p>
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:11] Design Patterns in der Webentwicklung</dt>
<dd>Inspiriert durch <a href="https://refactoring.guru/design-patterns/typescript">die zweifelhafte Aufstellung von Design Patterns durch den selbsterklärten Refactoring-Guru</a> sprechen wir über <a href="https://en.wikipedia.org/wiki/Software_design_pattern">Design Patterns!</a> Ausgehend vom <a href="https://www.amazon.de/Patterns-Elements-Reusable-Object-Oriented-Software/dp/0201633612">Buch-Klassiker „Design Patterns“</a> besprechen wir, was in JS/TS anders, und speziell beim Refactoring-Guru falsch läuft. Vor allem das <a href="https://refactoring.guru/design-patterns/singleton/typescript/example#lang-features">Singleton</a> und die <a href="https://refactoring.guru/design-patterns/decorator/typescript/example#lang-features">Decorators</a> bringen uns in Wallung. Wir eruieren, was die Programmiersprachen dieser Welt wirklich unterscheidet, debattieren Sinn und Unsinn von Klassen (sowie Legacy-Patterns wie das <a href="https://wiki.selfhtml.org/wiki/JavaScript/Tutorials/OOP/Module_und_Kapselung#Revealing_Module_Pattern">Revealing Module Pattern</a>) und stellen die Frage, ob das Builder-Pattern ein OOP Design Pattern ist … und ob nicht vielleicht eher React ein Design Pattern ist. Nachdem wir auf <a href="https://www.patterns.dev/">Patterns.dev</a> auch das Singleton wiederfinden, beenden wir entsetzt die Sendung.</dd>
</dl>


Ein harmloser Trollversuch auf Mastodon endet in einer stundenlangen
Grundsatzdebatte zwischen Stefan und Peter.


UNSER SPONSOR



Workshops.DE bietet IT-Schulungen für moderne Web-Entwicklung. Dabei…

Ein harmloser Trollversuch auf Mastodon endet in einer stundenlangen
Grundsatzdebatte zwischen Stefan und Peter.


UNSER SPONSOR



Workshops.DE bietet IT-Schulungen für moderne Web-Entwicklung. Dabei arbeitet
Workshops.DE nicht als reiner Vermittler, sondern bildet eine Community aus über
80 Trainer:innen, welche gemeinsam Material erstellen, sich gegenseitig
unterstützen und weiterbilden, um möglichst nachhaltige und hochqualitative
Weiterbildungsangebote zu schaffen.

Ein starker Fokus liegt hierbei auf den Frontend-Frameworks Angular, React und
Vue. Neben diesen gibt es aber auch Weiterbildungen im Bereich Docker,
Kubernetes und Spring Boot. Zum Netzwerk gehören ebenfalls die Community-Portale
Angular.DE, ReactJS.DE und VueJS.DE.

Seid ihr auf der Suche nach einer qualitativen Weiterbildung im Bereich
Web-Entwicklung oder möchtet euch selbst als Trainer:in einbringen? Dann seid
ihr bei Workshops.DE genau richtig.


SCHAUNOTIZEN

[00:02:11] DESIGN PATTERNS IN DER WEBENTWICKLUNG

Inspiriert durch die zweifelhafte Aufstellung von Design Patterns durch den
selbsterklärten Refactoring-Guru sprechen wir über Design Patterns! Ausgehend
vom Buch-Klassiker „Design Patterns“ besprechen wir, was in JS/TS anders, und
speziell beim Refactoring-Guru falsch läuft. Vor allem das Singleton und die
Decorators bringen uns in Wallung. Wir eruieren, was die Programmiersprachen
dieser Welt wirklich unterscheidet, debattieren Sinn und Unsinn von Klassen
(sowie Legacy-Patterns wie das Revealing Module Pattern) und stellen die Frage,
ob das Builder-Pattern ein OOP Design Pattern ist … und ob nicht vielleicht eher
React ein Design Pattern ist. Nachdem wir auf Patterns.dev auch das Singleton
wiederfinden, beenden wir entsetzt die Sendung.

Revision 567: Design Patterns in der Webentwicklung

<p>Gast <a href="https://twitter.com/drunknzombiecow">Nils Röhrig</a> berichtet über seine Erfahrungen mit <a href="https://www.redhat.com/de/topics/edge-computing/what-is-edge-computing">Edge Computing</a> mit <a href="https://kit.svelte.dev/">SvelteKit</a> und <a href="https://pages.cloudflare.com/">Cloudflare Pages</a>. Er spricht über Edge Computing und seine Auswirkungen auf die Webentwicklung. Im Detail wird er sich zusammen mit Vanessa mit SvelteKit und Cloudflare Pages befassen.</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://mittwald.de/workingdraft?ref=workingdraft.de"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 350px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2023/03/Podcast_Banner_Mittwald_-Hosting_neu_gedacht_945x314px.jpg" alt="" /></a></p>
<div class="message_content">
<p>Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die Decke gehen, deine Seite bleibt immer rasend schnell.</p>
<p>mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur, benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting. Also, worauf wartest du? Geh jetzt auf <a href="https://mittwald.de/workingdraft?ref=workingdraft.de">mittwald.de/workingdraft</a> und buch dein erstes Projekt!<br />
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:13] Edge Computing mit SvelteKit und Cloudflare Pages</dt>
<dd>Zuerst beschreibt Nils auf Edge Computing. Edge Computing bezieht sich auf die Verarbeitung von Daten und Berechnungen an der &#8222;Kante&#8220; eines Netzwerks, nämlich nahe am Benutzer oder Gerät. Dadurch können Latenzprobleme reduziert werden, da die Verarbeitung näher an der Quelle der Daten stattfindet. Durch Edge Computing können Webanwendungen schneller und zuverlässiger werden. Den Vorteil sieht Nils bei Anwendungen, die international aufgerufen werden.</dd>
<dd>Als nächstes widmet sich Nils dem Framework SvelteKit, das dem Compiler von <a href="https://svelte.dev/">Svelte</a> aufbaut. Weiter unten ist eine Revision verlinkt, bei der wir in der Vergangenheit bereits über Svelte und SvelteKit gesprochen haben.</dd>
<dd>Um Edge Computing mit einer in SvelteKit geschriebenen Applikation zu ermöglichen, benutzt Nils  Cloudflare Pages. Cloudflare Pages ist ein Hosting-Service für Webanwendungen, der auf der Cloudflare-Plattform basiert. Es bietet eine einfache Möglichkeit, statische oder dynamische Webanwendungen zu hosten und zu bereitstellen. Es gibt einen kostenfreien Testbereich. Interessant wird die <a href="https://developers.cloudflare.com/pages/platform/functions">Integration mit Cloudflare Workers</a>, die das Edge Computing ermöglichen.</dd>
</dl>
<h3>Links</h3>
<ul>
<li>Blogartikel: <a href="https://workingdraft.de/wp-admin/post-new.php">Setting up Cloudflare Pages with SvelteKit</a></li>
<li>App: <a href="https://living-on-the-edge-ecom-app.pages.dev/">Living on the edge</a></li>
<li>Code.talks 2022 &#8211; Living on the egde <a href="https://www.youtube.com/watch?v=nGfadGWyMjY&amp;list=PLmByTtq_jZj3k7bt0iUCjcj40wcannIca&amp;index=94">YouTube Video</a> und <a href="https://slides.com/nilsroehrig/living-on-the-edge-ct-webdev-22">Slides</a></li>
<li><a href="https://enterjs.de/veranstaltung-20010-0-web-apps-mit-svelte-ein-praktischer-einstieg.html">Svelte Workshop</a> mit Nils bei der enterJS im Juni</li>
</ul>
<h3>Passende Revisionen</h3>
<ul>
<li><a href="https://workingdraft.de/511/">Revision 511: Microfrontends bei REWE Digital</a> mit Nils Röhrig</li>
<li><a href="https://workingdraft.de/528/">Revision 528: Svelte und SvelteKit</a> mit <a href="https://www.uhlmann.pro/">Jon Uhlmann</a></li>
</ul>


Gast Nils Röhrig berichtet über seine Erfahrungen mit Edge Computing mit
SvelteKit und Cloudflare Pages. Er spricht über Edge Computing und seine
Auswirkungen auf die Webentwicklung. Im Detail wird er…

Gast Nils Röhrig berichtet über seine Erfahrungen mit Edge Computing mit
SvelteKit und Cloudflare Pages. Er spricht über Edge Computing und seine
Auswirkungen auf die Webentwicklung. Im Detail wird er sich zusammen mit Vanessa
mit SvelteKit und Cloudflare Pages befassen.


UNSER SPONSOR



Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie
wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die
Decke gehen, deine Seite bleibt immer rasend schnell.

mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und
Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur,
benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server
selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs
kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen
Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade
beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine
Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet
bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting.
Also, worauf wartest du? Geh jetzt auf mittwald.de/workingdraft und buch dein
erstes Projekt!



SCHAUNOTIZEN

[00:02:13] EDGE COMPUTING MIT SVELTEKIT UND CLOUDFLARE PAGES

Zuerst beschreibt Nils auf Edge Computing. Edge Computing bezieht sich auf die
Verarbeitung von Daten und Berechnungen an der „Kante“ eines Netzwerks, nämlich
nahe am Benutzer oder Gerät. Dadurch können Latenzprobleme reduziert werden, da
die Verarbeitung näher an der Quelle der Daten stattfindet. Durch Edge Computing
können Webanwendungen schneller und zuverlässiger werden. Den Vorteil sieht Nils
bei Anwendungen, die international aufgerufen werden.

Als nächstes widmet sich Nils dem Framework SvelteKit, das dem Compiler von
Svelte aufbaut. Weiter unten ist eine Revision verlinkt, bei der wir in der
Vergangenheit bereits über Svelte und SvelteKit gesprochen haben.

Um Edge Computing mit einer in SvelteKit geschriebenen Applikation zu
ermöglichen, benutzt Nils  Cloudflare Pages. Cloudflare Pages ist ein
Hosting-Service für Webanwendungen, der auf der Cloudflare-Plattform basiert. Es
bietet eine einfache Möglichkeit, statische oder dynamische Webanwendungen zu
hosten und zu bereitstellen. Es gibt einen kostenfreien Testbereich. Interessant
wird die Integration mit Cloudflare Workers, die das Edge Computing ermöglichen.


LINKS

 * Blogartikel: Setting up Cloudflare Pages with SvelteKit
 * App: Living on the edge
 * Code.talks 2022 – Living on the egde YouTube Video und Slides
 * Svelte Workshop mit Nils bei der enterJS im Juni


PASSENDE REVISIONEN

 * Revision 511: Microfrontends bei REWE Digital mit Nils Röhrig
 * Revision 528: Svelte und SvelteKit mit Jon Uhlmann

Revision 566: Edge Computing mit SvelteKit und Cloudflare Pages

<p>In dieser Revision hatten wir das Vergnügen, mit Marvin Hagemeister (<a href="https://marvinh.dev/">Web</a> / <a href="https://twitter.com/marvinhagemeist">Twitter</a> / <a href="https://infosec.exchange/@marvinh">Mastodon</a>) über JavaScript-Tooling und seine Erfahrungen auf diesem Gebiet zu sprechen. Marvin ist Entwickler bei <a href="https://www.shopify.com/">Shopify</a> vor allem durch seine Arbeit im Open-Source-Bereich bekannt, insbesondere bei <a href="https://preactjs.com/">Preact</a>, einem React-ähnlichen Framework. Er erzählte uns, dass er sich immer mehr für das gesamte JavaScript-Ökosystem und Tooling interessiert, was ihn entsprechend dazu gebracht hat, eine <a href="https://marvinh.dev/blog/speeding-up-javascript-ecosystem/">Blogpost-Serie</a> zu dem Thema zu schreiben. Und genau darüber wollten auch wir mit ihm sprechen.</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://www.factorial.io/de?ref=workingdraft.de"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 350px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2022/02/FAC_Banner_workingdraft_v3.jpg" alt="" /></a></p>
<div class="message_content">
<p>Factorial ist eine Digitalagentur mit einem internationalen Team und dem Fokus auf Open Source Technologien, die für regionale und internationale Kunden Technologien entwickelt. Mit Kompetenzen im Bereich Development, Design und Projektmanagement treibt die Agentur die digitale Transformation ihrer Kunden voran. Zu den Anwendungsbereichen zählen unter anderem Hosting, Content Management, Qualitätssicherung, Automatisierung und die Integration heterogener Systemlandschaften.<br />
Mehr Infos zu den aktuellen Stellenausschreibungen <a href="https://www.factorial.io/de/jobs?ref=workingdraft.de">gibt es hier</a>.<br />
<a href="https://bit.ly/3tZJjHz?ref=workingdraft.de">In diesem Video</a> stellt unser Kollege Julian den Frontend Job bei Factorial vor.</p>
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:04] Quo vadis Frontend-Tooling?</dt>
<dd>Anlass für Marvins Forschungen war die suboptimale Performance von JavaScript-Tools, insbesondere bei größeren Projekten, bei denen das Bauen und Testen von Code länger dauern kann &#8211; wie es z.B. bei Shopify der Fall ist. </p>
<p>Aktuell gibt es viele neue Tools, die in schnelleren Programmiersprachen wie Rust oder Go entwickelt werden, um die Leistung zu verbessern. Schnelle Tools halten wir für essenziell, da Langsamkeit den Arbeitsfluss und die Produktivität beeinträchtigen kann. Marvin sprach auch über seine persönlichen Erfahrungen mit schnellen Testframeworks und das er sich fragte, warum bestehende Tools nicht genau so schnell sind. Wir diskutierten die Größe von Projekten und wie viel die Programmiersprache zur Leistung beiträgt.</p>
<p>Ein weiterer Schwerpunkt unseres Gesprächs war der Wandel im JavaScript-Tooling-Universum. Bestehende Tools werden neu gedacht und oft in anderen Programmiersprachen als JavaScript entwickelt. Beispiele dafür sind der Nachfolger von Webpack, <a href="https://turbo.build/pack">TurboPack</a>, und <a href="https://esbuild.github.io/">ES-Build</a>, die in Rust bzw. Go geschrieben sind. Zusammen mit Marvin haben wir über die Auswirkungen dieser Entwicklungen auf das gesamte JavaScript-Ökosystem und die Industrie gesprochen und sinniert.</dd>
</dl>
<h3>Keine Schaunotizen</h3>
<dl>
<dt><a href="https://www.speedscope.app/">speedscope</a></dt>
<dd>Ein interaktiver Flamegraph-Visualisierer</dd>
<dt><a href="https://www.npmjs.com/package/patch-package">patch-package</a></dt>
<dd>Mit patch-package könnt Ihr nach dem Installieren lokale Korrekturen an npm-Paketen vornehmen.</dd>
</dl>


In dieser Revision hatten wir das Vergnügen, mit Marvin Hagemeister (Web /
Twitter / Mastodon) über JavaScript-Tooling und seine Erfahrungen auf diesem
Gebiet zu sprechen. Marvin ist Entwickler bei Sh…

In dieser Revision hatten wir das Vergnügen, mit Marvin Hagemeister (Web /
Twitter / Mastodon) über JavaScript-Tooling und seine Erfahrungen auf diesem
Gebiet zu sprechen. Marvin ist Entwickler bei Shopify vor allem durch seine
Arbeit im Open-Source-Bereich bekannt, insbesondere bei Preact, einem
React-ähnlichen Framework. Er erzählte uns, dass er sich immer mehr für das
gesamte JavaScript-Ökosystem und Tooling interessiert, was ihn entsprechend dazu
gebracht hat, eine Blogpost-Serie zu dem Thema zu schreiben. Und genau darüber
wollten auch wir mit ihm sprechen.


UNSER SPONSOR



Factorial ist eine Digitalagentur mit einem internationalen Team und dem Fokus
auf Open Source Technologien, die für regionale und internationale Kunden
Technologien entwickelt. Mit Kompetenzen im Bereich Development, Design und
Projektmanagement treibt die Agentur die digitale Transformation ihrer Kunden
voran. Zu den Anwendungsbereichen zählen unter anderem Hosting, Content
Management, Qualitätssicherung, Automatisierung und die Integration heterogener
Systemlandschaften.
Mehr Infos zu den aktuellen Stellenausschreibungen gibt es hier.
In diesem Video stellt unser Kollege Julian den Frontend Job bei Factorial vor.


SCHAUNOTIZEN

[00:02:04] QUO VADIS FRONTEND-TOOLING?

Anlass für Marvins Forschungen war die suboptimale Performance von
JavaScript-Tools, insbesondere bei größeren Projekten, bei denen das Bauen und
Testen von Code länger dauern kann – wie es z.B. bei Shopify der Fall ist.



Aktuell gibt es viele neue Tools, die in schnelleren Programmiersprachen wie
Rust oder Go entwickelt werden, um die Leistung zu verbessern. Schnelle Tools
halten wir für essenziell, da Langsamkeit den Arbeitsfluss und die Produktivität
beeinträchtigen kann. Marvin sprach auch über seine persönlichen Erfahrungen mit
schnellen Testframeworks und das er sich fragte, warum bestehende Tools nicht
genau so schnell sind. Wir diskutierten die Größe von Projekten und wie viel die
Programmiersprache zur Leistung beiträgt.

Ein weiterer Schwerpunkt unseres Gesprächs war der Wandel im
JavaScript-Tooling-Universum. Bestehende Tools werden neu gedacht und oft in
anderen Programmiersprachen als JavaScript entwickelt. Beispiele dafür sind der
Nachfolger von Webpack, TurboPack, und ES-Build, die in Rust bzw. Go geschrieben
sind. Zusammen mit Marvin haben wir über die Auswirkungen dieser Entwicklungen
auf das gesamte JavaScript-Ökosystem und die Industrie gesprochen und sinniert.


KEINE SCHAUNOTIZEN

SPEEDSCOPE

Ein interaktiver Flamegraph-Visualisierer

PATCH-PACKAGE

Mit patch-package könnt Ihr nach dem Installieren lokale Korrekturen an
npm-Paketen vornehmen.

Revision 565: Quo vadis Frontend-Tooling?

<p>Diese Woche war <a href="https://marcthiele.com/">Marc Thiele</a> mal wieder bei uns zu Gast und wir sprechen über Konferenzorganisation.</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://mittwald.de/workingdraft?ref=workingdraft.de"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 350px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2023/03/Podcast_Banner_Mittwald_-Hosting_neu_gedacht_945x314px.jpg" alt="" /></a></p>
<div class="message_content">
<p>Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die Decke gehen, deine Seite bleibt immer rasend schnell.</p>
<p>mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur, benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting. Also, worauf wartest du? Geh jetzt auf <a href="https://mittwald.de/workingdraft?ref=workingdraft.de">mittwald.de/workingdraft</a> und buch dein erstes Projekt!</p>
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:15] Konferenzorganisation</dt>
<dd>Diesmal schauen wir mal etwas genauer hinter die Kulissen der Organisation von Konferenzen. Marc Thiele ist als Organisator der <a href="https://beyondtellerrand.com/">Beyond Tellerrand</a> prädestiniert dafür. Die Konferenz findet bereits nächste Woche in Düsseldorf statt, aber auch <a href="https://beyondtellerrand.com/events/berlin-2023">am 11. und 12. September in Berlin</a>.<br />Natürlich sprechen wir über die Konferenz selbst, aber auch darüber, wie die Pandemie die Konferenz verändert hat, wie Marc seine Gäste findet und wie er die Zielgruppe der Konferenz anspricht.<br />
Darüber hinaus gibt&#8217;s einige Insights zu <a href="https://neu-gierig.fm/">Marcs Podcast &#8222;neu•gierig&#8220;</a>.</dd>
</dl>


Diese Woche war Marc Thiele mal wieder bei uns zu Gast und wir sprechen über
Konferenzorganisation.


UNSER SPONSOR



Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie
wie…

Diese Woche war Marc Thiele mal wieder bei uns zu Gast und wir sprechen über
Konferenzorganisation.


UNSER SPONSOR



Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie
wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die
Decke gehen, deine Seite bleibt immer rasend schnell.

mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und
Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur,
benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server
selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs
kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen
Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade
beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine
Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet
bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting.
Also, worauf wartest du? Geh jetzt auf mittwald.de/workingdraft und buch dein
erstes Projekt!


SCHAUNOTIZEN

[00:02:15] KONFERENZORGANISATION

Diesmal schauen wir mal etwas genauer hinter die Kulissen der Organisation von
Konferenzen. Marc Thiele ist als Organisator der Beyond Tellerrand prädestiniert
dafür. Die Konferenz findet bereits nächste Woche in Düsseldorf statt, aber auch
am 11. und 12. September in Berlin.
Natürlich sprechen wir über die Konferenz selbst, aber auch darüber, wie die
Pandemie die Konferenz verändert hat, wie Marc seine Gäste findet und wie er die
Zielgruppe der Konferenz anspricht.
Darüber hinaus gibt’s einige Insights zu Marcs Podcast „neu•gierig“.

Revision 564: Hinter den Kulissen von Konferenzorganisationen mit Marc Thiele

<p>Peter und Schepp durften <strong>Thomas Steiner</strong> (DevRel bei Google, online zu finden <a href="https://blog.tomayac.com/">im Web</a>, <a href="https://github.com/tomayac">auf Github</a>, <a href="https://twitter.com/tomayac">auf Twitter</a> und <a href="https://toot.cafe/@tomayac">im Fediverse</a>) zu den neusten Neuheiten aus dem Wirkungskreis von Project Fugu ausquetschen, nachdem Working Draft zuletzt in der <a href="https://workingdraft.de/399/">Revision 399</a> darüber berichtete. Es hat sich einiges getan!</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://partner.pcloud.com/r/90879"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 500px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2023/04/pCloud-Osteraktion-1024x512.jpg" alt="78% Rabatt bei der pCloud Osteraktion" /></a></p>
<div class="message_content">
<p>pCloud ist eine sichere Cloud-Lösung aus der Schweiz, die monatliche Abonnements und lebenslange Lizenzen anbietet. Der Online-Speicher kann bis zu 10 Terabyte an Daten speichern und hält sich an strenge Datenschutzbestimmungen.</p>
<p>Zu Ostern bietet pCloud eine 78% Rabattaktion auf Familienlizenzen an. Der Preis steigt allerdings nach 24 Stunden stündlich wieder an. Sichert euch also schnell den Rabatt ab dem 6. April auf <a href="https://partner.pcloud.com/r/90879">partner.pcloud.com</a>!
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:08] Neues von <a href="https://www.chromium.org/teams/web-capabilities-fugu/">Projekt Fugu</a></dt>
<dd>Projekt Fugu ist ein <a href="https://developer.chrome.com/blog/is-project-fugu-done/">laufendes</a> <a href="https://www.chromium.org/teams/web-capabilities-fugu/">Chrome-Großprojekt</a> zum Schließen des „App Gap“, was sich in <a href="https://fugu-tracker.web.app/">vielen neue Browser-APIs</a> widerspiegelt. Zu diesen APIs gehören die <a href="https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API">File System Access API</a>, <a href="https://www.w3.org/TR/generic-sensor/">konsolidierte Sensoren-APIs</a>, die <a href="https://developer.mozilla.org/en-US/docs/Web/API/Badging_API">Badging API</a>, eine <a href="https://developer.chrome.com/articles/shape-detection/">Shape Detection API</a> und die <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API">Web Serial API</a>. Neben den APIs an sich geht es auch ums weitere API-Umfeld wie Permission-Handling, die Möglichkeiten von <a href="https://github.com/WICG/isolated-web-apps/blob/main/README.md">Isolated Web Apps</a> (z.B. die vorgeschlagene <a href="https://wicg.github.io/direct-sockets/">Direct Sockets API</a>), inwiefern andere Browser mit an Bord sind (lokal nachzutesten mit <a href="https://howfuguismybrowser.dev/">howfuguismybrowser.dev</a>) und wie sich das Discoverability-Problem lösen lässt.</dd>
</dl>


Peter und Schepp durften Thomas Steiner (DevRel bei Google, online zu finden im
Web, auf Github, auf Twitter und im Fediverse) zu den neusten Neuheiten aus dem
Wirkungskreis von Project Fugu ausquetsc…

Peter und Schepp durften Thomas Steiner (DevRel bei Google, online zu finden im
Web, auf Github, auf Twitter und im Fediverse) zu den neusten Neuheiten aus dem
Wirkungskreis von Project Fugu ausquetschen, nachdem Working Draft zuletzt in
der Revision 399 darüber berichtete. Es hat sich einiges getan!


UNSER SPONSOR



pCloud ist eine sichere Cloud-Lösung aus der Schweiz, die monatliche Abonnements
und lebenslange Lizenzen anbietet. Der Online-Speicher kann bis zu 10 Terabyte
an Daten speichern und hält sich an strenge Datenschutzbestimmungen.

Zu Ostern bietet pCloud eine 78% Rabattaktion auf Familienlizenzen an. Der Preis
steigt allerdings nach 24 Stunden stündlich wieder an. Sichert euch also schnell
den Rabatt ab dem 6. April auf partner.pcloud.com!


SCHAUNOTIZEN

[00:02:08] NEUES VON PROJEKT FUGU

Projekt Fugu ist ein laufendes Chrome-Großprojekt zum Schließen des „App Gap“,
was sich in vielen neue Browser-APIs widerspiegelt. Zu diesen APIs gehören die
File System Access API, konsolidierte Sensoren-APIs, die Badging API, eine Shape
Detection API und die Web Serial API. Neben den APIs an sich geht es auch ums
weitere API-Umfeld wie Permission-Handling, die Möglichkeiten von Isolated Web
Apps (z.B. die vorgeschlagene Direct Sockets API), inwiefern andere Browser mit
an Bord sind (lokal nachzutesten mit howfuguismybrowser.dev) und wie sich das
Discoverability-Problem lösen lässt.

Revision 563: Ein Update zu Projekt Fugu

<p>Und wieder haben wir eine Gästin zu Besuch &#8211; diesmal ist es Svenja aus Marburg. Svenja ist Webentwicklerin mit Schwerpunkt Accessibility bei <a href="https://www.accenture.com/de-de/about/accenture-song-index">Accenture Song</a>, <a href="https://svenja-blog.de/">Bloggerin</a>, und Ihr findet Sie als <a href="https://twitter.com/SvenjaDev">@SvenjaDev</a> auf Twitter und als <a href="https://fedisabled.social/@svenja">@svenja@fedisabled.social</a> auf Mastodon.</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://workshops.de/workingdraft?ref=workingdraft.de"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 500px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2022/12/Working-Draft-Banner.jpg" alt="" /></a></p>
<div class="message_content">
<p>Workshops.DE bietet IT-Schulungen für moderne Web-Entwicklung. Dabei arbeitet Workshops.DE nicht als reiner Vermittler, sondern bildet eine Community aus über 80 Trainer:innen, welche gemeinsam Material erstellen, sich gegenseitig unterstützen und weiterbilden, um möglichst nachhaltige und hochqualitative Weiterbildungsangebote zu schaffen.</p>
<p>Ein starker Fokus liegt hierbei auf den Frontend-Frameworks Angular, React und Vue. Neben diesen gibt es aber auch Weiterbildungen im Bereich Docker, Kubernetes und Spring Boot. Zum Netzwerk gehören ebenfalls die Community-Portale Angular.DE, ReactJS.DE und VueJS.DE.</p>
<p>Seid ihr auf der Suche nach einer qualitativen Weiterbildung im Bereich Web-Entwicklung oder möchtet euch selbst als Trainer:in einbringen? Dann seid ihr bei <a href="https://workshops.de/workingdraft?ref=workingdraft.de">Workshops.DE</a> genau richtig.</p>
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:06] Interview mit Entwicklerin Svenja zu Barrierefreiheit</dt>
<dd>Vor ein paar Jahren ist Svenja auf Social Media in der Webentwickler-Bubble aufgetaucht. Ihre Spezialisierung ist Accessibility, was nicht von ungefähr kommt, denn Svenja ist blind.</p>
<p>In unserem Interview mit ihr sprachen wir über ihren Weg in den Beruf. Wir wollen von ihr wissen, wie sie das Programmieren angeht und welche Coding-Umgebung dafür aus ihrer Sicht gut geeignet ist. Es stellt sich heraus, dass dies Microsofts Visual Studio Code ist.</p>
<p>Natürlich wollen wir auch wissen, was aus ihrer Sicht ein gute gecodete Webseite ausmacht und welche Dinge vielleicht gar nicht so wichtig sind, die wir Sehende möglicherweise überbewerten.</p>
<p>Wir fragen sie, ob eine Webseite möglicherweise auch zu semantisch sein kann, wie es einmal in einem Vortrag von <a href="https://www.youtube.com/watch?v=TkKkAgjsfgQ">Vasilis van Gemert</a> durchklang.</p>
<p>Schließlich lenken unser Augenmerk auch auf die Barrierefreiheit von Single-Page-Applications. Hier schlagen wir den Bogen zurück zu Visual Studio Code, das ein Paradebeispiel einer mit Webtechnologie umgesetzten App darstellt. In der Regel sind native Apps den Web-basierten Apps aber überlegen.</dd>
</dl>
<h3>Links</h3>
<dl>
<dt><a href="https://www.youtube.com/watch?v=l9Tjzbms0V4">Der Grubenlampe Podcast &#8211; Interview mit Svenja, einer blinden Programmiererin</a></dt>
<dd>Unser Podcast war nicht ihr erster Podcast. Auch dieser hier ist sehr hörenswert!</dd>
<dt><a href="https://svenja-blog.de/">Svenjas Blog</a></dt>
<dd>Hier bloggt Svenja von Zeit zu Zeit zu ihren Liebslingsthemen</dd>
<dt><a href="https://twitch.tv/svenjadev">Svenjas Twitch</a></dt>
<dd>Svenja spielt gerne Heartstone und streamt das ganze dann hier.</dd>
</dl>


Und wieder haben wir eine Gästin zu Besuch – diesmal ist es Svenja aus Marburg.
Svenja ist Webentwicklerin mit Schwerpunkt Accessibility bei Accenture Song,
Bloggerin, und Ihr findet Sie als @SvenjaDe…

Und wieder haben wir eine Gästin zu Besuch – diesmal ist es Svenja aus Marburg.
Svenja ist Webentwicklerin mit Schwerpunkt Accessibility bei Accenture Song,
Bloggerin, und Ihr findet Sie als @SvenjaDev auf Twitter und als
@svenja@fedisabled.social auf Mastodon.


UNSER SPONSOR



Workshops.DE bietet IT-Schulungen für moderne Web-Entwicklung. Dabei arbeitet
Workshops.DE nicht als reiner Vermittler, sondern bildet eine Community aus über
80 Trainer:innen, welche gemeinsam Material erstellen, sich gegenseitig
unterstützen und weiterbilden, um möglichst nachhaltige und hochqualitative
Weiterbildungsangebote zu schaffen.

Ein starker Fokus liegt hierbei auf den Frontend-Frameworks Angular, React und
Vue. Neben diesen gibt es aber auch Weiterbildungen im Bereich Docker,
Kubernetes und Spring Boot. Zum Netzwerk gehören ebenfalls die Community-Portale
Angular.DE, ReactJS.DE und VueJS.DE.

Seid ihr auf der Suche nach einer qualitativen Weiterbildung im Bereich
Web-Entwicklung oder möchtet euch selbst als Trainer:in einbringen? Dann seid
ihr bei Workshops.DE genau richtig.


SCHAUNOTIZEN

[00:02:06] INTERVIEW MIT ENTWICKLERIN SVENJA ZU BARRIEREFREIHEIT

Vor ein paar Jahren ist Svenja auf Social Media in der Webentwickler-Bubble
aufgetaucht. Ihre Spezialisierung ist Accessibility, was nicht von ungefähr
kommt, denn Svenja ist blind.



In unserem Interview mit ihr sprachen wir über ihren Weg in den Beruf. Wir
wollen von ihr wissen, wie sie das Programmieren angeht und welche
Coding-Umgebung dafür aus ihrer Sicht gut geeignet ist. Es stellt sich heraus,
dass dies Microsofts Visual Studio Code ist.

Natürlich wollen wir auch wissen, was aus ihrer Sicht ein gute gecodete Webseite
ausmacht und welche Dinge vielleicht gar nicht so wichtig sind, die wir Sehende
möglicherweise überbewerten.

Wir fragen sie, ob eine Webseite möglicherweise auch zu semantisch sein kann,
wie es einmal in einem Vortrag von Vasilis van Gemert durchklang.

Schließlich lenken unser Augenmerk auch auf die Barrierefreiheit von
Single-Page-Applications. Hier schlagen wir den Bogen zurück zu Visual Studio
Code, das ein Paradebeispiel einer mit Webtechnologie umgesetzten App darstellt.
In der Regel sind native Apps den Web-basierten Apps aber überlegen.


LINKS

DER GRUBENLAMPE PODCAST – INTERVIEW MIT SVENJA, EINER BLINDEN PROGRAMMIERERIN

Unser Podcast war nicht ihr erster Podcast. Auch dieser hier ist sehr
hörenswert!

SVENJAS BLOG

Hier bloggt Svenja von Zeit zu Zeit zu ihren Liebslingsthemen

SVENJAS TWITCH

Svenja spielt gerne Heartstone und streamt das ganze dann hier.

Revision 562: Interview mit Entwicklerin Svenja zu Barrierefreiheit

<p>In dieser Revision besprechen wir Organisationsstrukturen. Dabei haben wir einen Fokus auf UnFIX, ein Organisationsdesign, worüber uns <a href="http://www.milanmatull.com/">Milan Matull</a>, Managing Partner bei <a href="https://www.factorial.io/en">Factorial</a>, viel zu erzählen hat. Milan war bereits Gast beim Working Draft in <a href="https://workingdraft.de/464/">Revision 464</a> zum Thema TailwindCSS 2.0 und in <a href="https://workingdraft.de/516/">Revision 516</a> zum Thema TailwindCSS 3.0.</p>
<hr><aside class="message long-message">
<h3>Unser Sponsor</h3>
<p><a href="https://mittwald.de/workingdraft?ref=workingdraft.de"><img class="alignnone size-medium wp-image-3774" style="display: block; max-width: 350px; width: 100%; float: right; margin-bottom: 1rem; margin-left: 1rem;" src="https://workingdraft.de/wp-content/uploads/2023/03/Podcast_Banner_Mittwald_-Hosting_neu_gedacht_945x314px.jpg" alt="" /></a></p>
<div class="message_content">
<p>Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die Decke gehen, deine Seite bleibt immer rasend schnell.</p>
<p>mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur, benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting. Also, worauf wartest du? Geh jetzt auf <a href="https://mittwald.de/workingdraft?ref=workingdraft.de">mittwald.de/workingdraft</a> und buch dein erstes Projekt!</p>
</div>
</aside><hr>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:11] Organisationstruktur &#8222;UNFIX&#8220;</dt>
<dd>Unterschiedliche Unternehmensgrößen benötigen unterschiedliche Modelle, um Teams und Arbeit zu strukturieren. Milan und seine Kolleg:innen setzten in der Vergangenheit auf das &#8222;<a href="https://nativdigital.com/viable-system-model/">Viable System Model</a>&#8220; (VSM). Das <a href="https://agilescrumgroup.de/spotify-modell/">Spotify-Model</a> ist seit Jahren ein fester Bestandteil in Diskussion, wie man Teams am besten aufstellen könnte. Für größere Strukturen gibt es Modelle, die auf Scrum aufbauen, wie <a href="https://www.atlassian.com/de/agile/agile-at-scale/what-is-safe">SAFe</a> und <a href="https://www.atlassian.com/de/agile/agile-at-scale/less">leSS</a>. Sind flache Hierarchien gewünscht eignen sich <a href="https://agilescrumgroup.de/holacracy/#:~:text=Bei%20Holacracy%20(zu%20Deutsch%3A%20Holakratie,Entscheidungsfindung%20und%20selbststeuernde%20Teams%20aus.">Holacracy</a>, allerdings ebenfalls VSM und <a href="https://unfix.com/">UnFIX</a>. Denn gefragt sind Modelle, die sich ständig an das Unternehmen anpassen können, wie auch <a href="https://management30.com/">Management 3.0</a> und <a href="https://teamtopologies.com/">Team Topologies</a>. Milan erzählt, worum genau es im UnFIX Modell geht. Es unterscheidet sich v.a. darin, dass es kein starres Framework ist. Das mag den Einstieg etwas erschweren, aber sorgt für viel Flexibilität, sobald es notwendig wird.</dd>
</dl>


In dieser Revision besprechen wir Organisationsstrukturen. Dabei haben wir einen
Fokus auf UnFIX, ein Organisationsdesign, worüber uns Milan Matull, Managing
Partner bei Factorial, viel zu erzählen ha…

In dieser Revision besprechen wir Organisationsstrukturen. Dabei haben wir einen
Fokus auf UnFIX, ein Organisationsdesign, worüber uns Milan Matull, Managing
Partner bei Factorial, viel zu erzählen hat. Milan war bereits Gast beim Working
Draft in Revision 464 zum Thema TailwindCSS 2.0 und in Revision 516 zum Thema
TailwindCSS 3.0.


UNSER SPONSOR



Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie
wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die
Decke gehen, deine Seite bleibt immer rasend schnell.

mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und
Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur,
benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server
selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs
kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen
Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade
beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine
Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet
bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting.
Also, worauf wartest du? Geh jetzt auf mittwald.de/workingdraft und buch dein
erstes Projekt!


SCHAUNOTIZEN

[00:02:11] ORGANISATIONSTRUKTUR „UNFIX“

Unterschiedliche Unternehmensgrößen benötigen unterschiedliche Modelle, um Teams
und Arbeit zu strukturieren. Milan und seine Kolleg:innen setzten in der
Vergangenheit auf das „Viable System Model“ (VSM). Das Spotify-Model ist seit
Jahren ein fester Bestandteil in Diskussion, wie man Teams am besten aufstellen
könnte. Für größere Strukturen gibt es Modelle, die auf Scrum aufbauen, wie SAFe
und leSS. Sind flache Hierarchien gewünscht eignen sich Holacracy, allerdings
ebenfalls VSM und UnFIX. Denn gefragt sind Modelle, die sich ständig an das
Unternehmen anpassen können, wie auch Management 3.0 und Team Topologies. Milan
erzählt, worum genau es im UnFIX Modell geht. Es unterscheidet sich v.a. darin,
dass es kein starres Framework ist. Das mag den Einstieg etwas erschweren, aber
sorgt für viel Flexibilität, sobald es notwendig wird.

Revision 561: Organisationstruktur „UnFIX“

<p>Nach einer Pause nehmen Stefan und Peter wieder das allquartalige Besprechen der neuesten TypeScript-Version auf. Und möglicherweise gibt es noch andere semi-relevante Themen wie React-Beef, Klassenkampf und PHP.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:01:01] <a href="https://devblogs.microsoft.com/typescript/announcing-typescript-5-0-beta/">TypeScript 5.0</a></dt>
<dd>Wie gewohnt rekapitulieren für anlässlich der Beta einer neuen TypeScript-Version das TypeScript-Versionierungs-Schema und tauchen danach tief in die spannenderen neuen Features ein. An erster Stelle stehen die neuen, <a href="https://github.com/tc39/proposal-decorators">dem ECMAScript-Standard entsprechenden</a> <strong>Decorators</strong>. Diese ergänzen in TypeScript die weiterhin verfügbaren <a href="https://www.typescriptlang.org/docs/handbook/decorators.html">Legacy Decorators</a>, deren Unterschiede zum Standard und Herkunft aus den Ruinen von <a href="https://en.wikipedia.org/wiki/AtScript">AtScript</a> wir besprechen. <a href="https://devblogs.microsoft.com/typescript/announcing-typescript-5-0-beta/#const-type-parameters">const Type Parameters</a> halten wir für eine sinnvolle Ergänzung, ebenso die Änderungen am Config-File-Format und die neue Unterstützung <code>export type *</code>. Die in 5.0 anstehenden Änderungen an Enums sind auch nicht schlecht, Enums selbst hingegen schon.</dd>
<dt>[00:42:27] Hidden Bonus Track/dt></p>
<dd>In einer etwas außer Kontrolle geratenen Vorbesprechung sprechen wir über den aktuellen React-Beef in der Frontend-Welt, Peters jüngste Erfahrungen<br />
mit PHP und <a href="https://laravel.com/">Laravel</a> sowie die Beziehung zwischen (und die Qualität von) React, <a href="https://nextjs.org/">Next.js</a> und <a href="https://vercel.com/">Vercel</a>.</dd>
</dl>


Nach einer Pause nehmen Stefan und Peter wieder das allquartalige Besprechen der
neuesten TypeScript-Version auf. Und möglicherweise gibt es noch andere
semi-relevante Themen wie React-Beef, Klassenka…

Nach einer Pause nehmen Stefan und Peter wieder das allquartalige Besprechen der
neuesten TypeScript-Version auf. Und möglicherweise gibt es noch andere
semi-relevante Themen wie React-Beef, Klassenkampf und PHP.


SCHAUNOTIZEN

[00:01:01] TYPESCRIPT 5.0

Wie gewohnt rekapitulieren für anlässlich der Beta einer neuen
TypeScript-Version das TypeScript-Versionierungs-Schema und tauchen danach tief
in die spannenderen neuen Features ein. An erster Stelle stehen die neuen, dem
ECMAScript-Standard entsprechenden Decorators. Diese ergänzen in TypeScript die
weiterhin verfügbaren Legacy Decorators, deren Unterschiede zum Standard und
Herkunft aus den Ruinen von AtScript wir besprechen. const Type Parameters
halten wir für eine sinnvolle Ergänzung, ebenso die Änderungen am
Config-File-Format und die neue Unterstützung export type *. Die in 5.0
anstehenden Änderungen an Enums sind auch nicht schlecht, Enums selbst hingegen
schon.

[00:42:27] HIDDEN BONUS TRACK/DT>



In einer etwas außer Kontrolle geratenen Vorbesprechung sprechen wir über den
aktuellen React-Beef in der Frontend-Welt, Peters jüngste Erfahrungen
mit PHP und Laravel sowie die Beziehung zwischen (und die Qualität von) React,
Next.js und Vercel.

Revision 560: TypeScript 5.0

Wöchentlicher Podcast für Frontend Devs, Design Engineers und Web-Entwickler:innen

PODLIST

Working Draft

Wöchentlicher Podcast für Frontend Devs, Design Engineers und Web-Entwickler:innen.

Neue Episoden

Revision 571: TypeScript 5.1

Working Draft

Revision 570: KI: Integration leicht gemacht

Working Draft

Revision 569: Von Link-Checkern und Rabbit Holes

Working Draft

Revision 568: 100 Days Of More Or Less Modern CSS

Working Draft

Revision 567: Design Patterns in der Webentwicklung

Working Draft

Revision 566: Edge Computing mit SvelteKit und Cloudflare Pages

Working Draft

Revision 565: Quo vadis Frontend-Tooling?

Working Draft

Revision 564: Hinter den Kulissen von Konferenzorganisationen mit Marc Thiele

Working Draft

Revision 563: Ein Update zu Projekt Fugu

Working Draft

Revision 562: Interview mit Entwicklerin Svenja zu Barrierefreiheit

Working Draft

Revision 561: Organisationstruktur „UnFIX“

Working Draft

Revision 560: TypeScript 5.0

Working Draft