Working Draft

By Vanessa Otto, Peter Kröner, Hans Christian Reinl, Stefan Baumgartner, Christian »Schepp« SchaeferNews Technology Education How To Tech News

Working Draft episodes

June 14, 2015 Revision 221: Pattern libraries, Styleguides und PatternLab
[00:00:39] News
Please update Picturefill
Ein kleines Public Service Annoucement der Responsive Images Group: Holt euch den neuen Picturefill. Der ist den Standards nahe und rüstet dort auf wo’s nötig ist..
Schaunotizen
[00:01:33] PatternLab
Stefan hat’s schon bei einigen Projekten im Einsatz, Schepp hat gerade den Intensivkurs vom Großmeister Brad Frost selbst absolviert: PatternLab, das Tool, dass allen Beteiligten eines Projektes hilft Designs, Technik und Responsiveness besser zu verstehen und zu managen. Wir erzählen von unseren Erfahrungen mit dem Tool und der Atomic Design Herangehensweise, und räumen mit Vorurteilen und Missverständnissen auf. In Summe also ein „Was tut es, und wozu ist das jetzt gut?“. Darüber hinaus erzählt Stefan, wie er das Grundprinzip in ein eigenes Tool verwandeln konnte, dass näher an dem von ihm verwendeten CMS liegt, und auch dort eine nötige Brücke im Entwicklungsfluss stellt.
[00:38:25] Keine Schaunotizen
Art directing SVG using Viewbox
Ein SVG Artikel über das viewbox-Attribut. Natürlich von Sara Soueidan.
Mosaic Academy
Schnellcheck für eure JavaScript Kenntnisse. Gut für Training und Verständnis..
text-rendering: optimizeSpeed vs optimizeLegibility
Schöneres Font-Rendering wirkt sich massiv auf die perceived performance der Seite aus.
Canvas Recording
Browserscreen in einer Canvas aufzeichnen und über Web-RTC durch die Gegend schicken? Geht anscheinend.
Galen
CSS Tests mit toller Beschreibungssprache. Zwar Selenium, aber gute Idee.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
45 min
June 14, 2015 Revision 221: Pattern libraries, Styleguides und PatternLab
[00:00:39] News
Please update Picturefill
Ein kleines Public Service Annoucement der Responsive Images Group: Holt euch den neuen Picturefill. Der ist den Standards nahe und rüstet dort auf wo’s nötig ist..
Schaunotizen
[00:01:33] PatternLab
Stefan hat’s schon bei einigen Projekten im Einsatz, Schepp hat gerade den Intensivkurs vom Großmeister Brad Frost selbst absolviert: PatternLab, das Tool, dass allen Beteiligten eines Projektes hilft Designs, Technik und Responsiveness besser zu verstehen und zu managen. Wir erzählen von unseren Erfahrungen mit dem Tool und der Atomic Design Herangehensweise, und räumen mit Vorurteilen und Missverständnissen auf. In Summe also ein „Was tut es, und wozu ist das jetzt gut?“. Darüber hinaus erzählt Stefan, wie er das Grundprinzip in ein eigenes Tool verwandeln konnte, dass näher an dem von ihm verwendeten CMS liegt, und auch dort eine nötige Brücke im Entwicklungsfluss stellt.
[00:38:25] Keine Schaunotizen
Art directing SVG using Viewbox
Ein SVG Artikel über das viewbox-Attribut. Natürlich von Sara Soueidan.
Mosaic Academy
Schnellcheck für eure JavaScript Kenntnisse. Gut für Training und Verständnis..
text-rendering: optimizeSpeed vs optimizeLegibility
Schöneres Font-Rendering wirkt sich massiv auf die perceived performance der Seite aus.
Canvas Recording
Browserscreen in einer Canvas aufzeichnen und über Web-RTC durch die Gegend schicken? Geht anscheinend.
Galen
CSS Tests mit toller Beschreibungssprache. Zwar Selenium, aber gute Idee.
45 min
May 25, 2015 Revision 220: Tools are [not] the Problem
[00:00:14] Tools are [not] the Problem
Schepp und Anselm debattieren zu zweit mit kleinen Abschweifungen über den Artikel von Peter Paul Koch, die Gegendarstellung von Sebastian Markbåge bezüglich der Facebook Instant Articles Ankündigung, zu der auch Tim Kadlec im Bezug auf Performance Stellung nimmt.
Wir fragen uns, was der richtige Weg ist, warum es so unterschiedliche Meinungen zu dem Thema gibt und wie der Missstand denn zu beheben wäre.
[00:37:33] SVG Icon Systeme Probleme
Wir nehmen den Artikel Implementing an SVG Icons System von Damon Bauer zum Anlass und sprechen über SVG. Anselm erzählt von Iconfonts, dem Wechsel zu SVG und etlichen kleinen Problemchen, die er beim Einsatz gefunden hat. Schepp pflichtet bei, wir stellen aber auch fest, dass SVG einfach super coole Sachen wie Vererbungen kann, die wir super nützlich finden. Außerdem erwähnten wir die Grunt-Tasks grunt-svgmin und grunt-svg-sprite.
[00:59:44] Verlosung
Ja, der Schepp hat eine Lizenz von Jetbrains zu viel und möchte sie unter unsere Hörer bringen.
Schreibt dazu einfach eure Erfahrungen, Tipps oder Probleme mit SVG Icons in die Kommentare und dazu, ob ihr PHPStorm oder WebStorm haben möchtet. Die Verlosung findet zur Revision 223 statt…
[01:01:15] Keine Schaunotizen
Lovefield
SQL-ähnliche Syntax schreiben schreiben und JavaScript IndexedDB Queries herausbekommen? Das macht Lovefield für euch. Leider nicht ganz schlank als Library.
Windows 95
Yeah, Windows 95 läuft nun im Browser!
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 5 min
May 25, 2015 Revision 220: Tools are [not] the Problem
[00:00:14] Tools are [not] the Problem
Schepp und Anselm debattieren zu zweit mit kleinen Abschweifungen über den Artikel von Peter Paul Koch, die Gegendarstellung von Sebastian Markbåge bezüglich der Facebook Instant Articles Ankündigung, zu der auch Tim Kadlec im Bezug auf Performance Stellung nimmt.
Wir fragen uns, was der richtige Weg ist, warum es so unterschiedliche Meinungen zu dem Thema gibt und wie der Missstand denn zu beheben wäre.
[00:37:33] SVG Icon Systeme Probleme
Wir nehmen den Artikel Implementing an SVG Icons System von Damon Bauer zum Anlass und sprechen über SVG. Anselm erzählt von Iconfonts, dem Wechsel zu SVG und etlichen kleinen Problemchen, die er beim Einsatz gefunden hat. Schepp pflichtet bei, wir stellen aber auch fest, dass SVG einfach super coole Sachen wie Vererbungen kann, die wir super nützlich finden. Außerdem erwähnten wir die Grunt-Tasks grunt-svgmin und grunt-svg-sprite.
[00:59:44] Verlosung
Ja, der Schepp hat eine Lizenz von Jetbrains zu viel und möchte sie unter unsere Hörer bringen.
Schreibt dazu einfach eure Erfahrungen, Tipps oder Probleme mit SVG Icons in die Kommentare und dazu, ob ihr PHPStorm oder WebStorm haben möchtet. Die Verlosung findet zur Revision 223 statt…
[01:01:15] Keine Schaunotizen
Lovefield
SQL-ähnliche Syntax schreiben schreiben und JavaScript IndexedDB Queries herausbekommen? Das macht Lovefield für euch. Leider nicht ganz schlank als Library.
Windows 95
Yeah, Windows 95 läuft nun im Browser!
1 hr 5 min
May 24, 2015 Revision 219: Interview mit Sara Soueidan
Natürlich waren wir auch dieses Mal wieder auf der (grandiosen) beyond tellerrand // Düsseldorf und haben uns wie gehabt einen der Sprecher herausgeangelt und zu einem Interview genötigt :)
Getroffen hat es niemanden geringeres als Sara Soueidan, der CSS- und SVG-Shooting-Star des letzten Jahres. Wir sprachen allerdings genau nicht über technische Themen, sondern interessierten uns viel mehr für ihren Hintergrund.

Foto mit freundlicher Genehmigung von Gunnar Bittersmann
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
17 min
May 24, 2015 Revision 219: Interview mit Sara Soueidan
Natürlich waren wir auch dieses Mal wieder auf der (grandiosen) beyond tellerrand // Düsseldorf und haben uns wie gehabt einen der Sprecher herausgeangelt und zu einem Interview genötigt :)
Getroffen hat es niemanden geringeres als Sara Soueidan, der CSS- und SVG-Shooting-Star des letzten Jahres. Wir sprachen allerdings genau nicht über technische Themen, sondern interessierten uns viel mehr für ihren Hintergrund.
Foto mit freundlicher Genehmigung von Gunnar Bittersmann
17 min
May 23, 2015 Revision 218: ECMAScript 6
Dieses Mal haben sich Peter, Hans, Rodney und Stefan zusammengefunden, um ein wenig von der Arbeit mit ECMAScript 6 zu berichten.
Schaunotizen
[00:00:10] ES6 in der Praxis
Hans und Stefan berichten davon, wie ihre Erfahrungen mit dem Einsatz von ES6. Es geht dabei um Tools, und inwiefern es einem im Vergleich zum Vorgänger das Leben einfacher macht. Darüberhinaus reden wir auch darüber, wie zweckmäßig der Einsatz von ES6 heute schon ist und wie spekulieren darüber, wie lange es wohl dauern wird, bis es im Alltag angekommen sein wird.
[00:25:36] ES6 Module-Loader sind wieder gestrichen
Nicht undiskutiert bleiben durfte auch die Tatsache, dass die TC39 in letzter Sekunde in Sachen ES6 Module-Loader einen Rückzieher gemacht hat, und JavaScript damit weiterhin ohne einen solchen dastehen wird. Wir reden über die möglichen Gründe für diesen Schritt und darüber, welche Möglichkeiten man derzeit für’s Module Laden hat. Dabei fällt auch das Stichwort „Universal Module Definition“.
[00:40:12] Keine Schaunotizen
ramjet
„Ramjet makes it looks as though one DOM element is capable of transforming into another, no matter where the two elements sit in the DOM tree.“ WOW!
Git-Extras
Hilfereiche Toolsammlung für Git Nr. 1
Hub
Hilfereiche Toolsammlung für Git Nr. 2
LanguageTool
Ein Open Source Grammatikfehler-Suchprogramm
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
44 min
May 23, 2015 Revision 218: ECMAScript 6
Dieses Mal haben sich Peter, Hans, Rodney und Stefan zusammengefunden, um ein wenig von der Arbeit mit ECMAScript 6 zu berichten.
Schaunotizen
[00:00:10] ES6 in der Praxis
Hans und Stefan berichten davon, wie ihre Erfahrungen mit dem Einsatz von ES6. Es geht dabei um Tools, und inwiefern es einem im Vergleich zum Vorgänger das Leben einfacher macht. Darüberhinaus reden wir auch darüber, wie zweckmäßig der Einsatz von ES6 heute schon ist und wie spekulieren darüber, wie lange es wohl dauern wird, bis es im Alltag angekommen sein wird.
[00:25:36] ES6 Module-Loader sind wieder gestrichen
Nicht undiskutiert bleiben durfte auch die Tatsache, dass die TC39 in letzter Sekunde in Sachen ES6 Module-Loader einen Rückzieher gemacht hat, und JavaScript damit weiterhin ohne einen solchen dastehen wird. Wir reden über die möglichen Gründe für diesen Schritt und darüber, welche Möglichkeiten man derzeit für’s Module Laden hat. Dabei fällt auch das Stichwort „Universal Module Definition“.
[00:40:12] Keine Schaunotizen
ramjet
„Ramjet makes it looks as though one DOM element is capable of transforming into another, no matter where the two elements sit in the DOM tree.“ WOW!
Git-Extras
Hilfereiche Toolsammlung für Git Nr. 1
Hub
Hilfereiche Toolsammlung für Git Nr. 2
LanguageTool
Ein Open Source Grammatikfehler-Suchprogramm
44 min
May 04, 2015 Revision 217: Offline First und Links
Da diese Woche nichts spannendes passiert war, ließen Peter, Hans und Anselm den Schepp einfach ein wenig von seinem aktuellen Offline-First-Projekt erzählen.
Schaunotizen
[00:00:11] Offline First
Schepp bastelt eine „appige“ Mobile-Variante seines Projektes Salz&Brot und verfolgt dabei den Offline-First-Gedanken. Dafür verwendet er unter anderem den Application Cache in Kombination mit grunt-appcache und den Scripts aus einem Artikel von HTML5 Rocks.Für den Daten-Sync wird gechunktes JSON (via Oboe.js) gestreamt und (aus einer Reihe von Gründen und mit teilweiser Kompression) mit localStorage gespeichert, nicht mit IndexedDB. Desweiteren kommen AngularJS, jQuery und jQuery-Plugins zum Einsatz. Für die Zukunft plant Schepp, den Suchalgorithmus in einen Web Worker auszulagern, Optimierungen mit der Page Visibility API einzubauen, add to homescreen in Chrome zu nutzen und natürlich Service Worker und Push Notfications zu Felde zu führen.
[00:40:17] Keine Schaunotizen
The WebKit Open Source Project – Web Platform Status
Status diverser Technologien in der Webkit-Engine, ganz wie vom IE-Team vorgemacht.
mdo-ular CSS
Video eines kurzen Talks über writing better CSS with fewer, more flexible guidelines that help put the focus on what’s between the curly braces..
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
43 min
May 04, 2015 Revision 217: Offline First und Links
Da diese Woche nichts spannendes passiert war, ließen Peter, Hans und Anselm den Schepp einfach ein wenig von seinem aktuellen Offline-First-Projekt erzählen.
Schaunotizen
[00:00:11] Offline First
Schepp bastelt eine „appige“ Mobile-Variante seines Projektes Salz&Brot und verfolgt dabei den Offline-First-Gedanken. Dafür verwendet er unter anderem den Application Cache in Kombination mit grunt-appcache und den Scripts aus einem Artikel von HTML5 Rocks.Für den Daten-Sync wird gechunktes JSON (via Oboe.js) gestreamt und (aus einer Reihe von Gründen und mit teilweiser Kompression) mit localStorage gespeichert, nicht mit IndexedDB. Desweiteren kommen AngularJS, jQuery und jQuery-Plugins zum Einsatz. Für die Zukunft plant Schepp, den Suchalgorithmus in einen Web Worker auszulagern, Optimierungen mit der Page Visibility API einzubauen, add to homescreen in Chrome zu nutzen und natürlich Service Worker und Push Notfications zu Felde zu führen.
[00:40:17] Keine Schaunotizen
The WebKit Open Source Project – Web Platform Status
Status diverser Technologien in der Webkit-Engine, ganz wie vom IE-Team vorgemacht.
mdo-ular CSS
Video eines kurzen Talks über writing better CSS with fewer, more flexible guidelines that help put the focus on what’s between the curly braces..
43 min