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

July 18, 2012 Revision 80: X-Tag, Print Styles und IE-Basher bashen
Scheppman, Hans, Rodney und Kahlil trafen sich dieses mal wieder, um in illustrer Runde so zu tun, als hätten Sie eine Ahnung von Webentwicklung und so.
[00:00:15] News
getUserMedia() ist in Firefox gelandet
Schaunotizen
[00:00:39] styles.max.css
Daniel Eden schlägt vor, das CSS generell auch dekomprimiert auf dem Server bereit zu halten, damit Anfänger davon lernen können.
[00:12:40] It’s time to stop blaming Internet Explorer
Den Nicholas C. Zakas ermüdet das ewige IE-Gebashe und wir stimmen in diesen Kanon mit ein.
[00:22:06] box-decoration-break in Anmarsch
So langsam kommt box-decoration-break in die Browser. Der Schepp und Rodney sinnieren über die Sinnhaftigkeit des Propertys.
[00:40:22] X-tag – reduce your html
Der Autor behilft sich mit JavaScript, um HTML-Code zu sparen. Wir sinnieren auch hier über die Sinnhaftigkeit dessen.
[00:49:48] Keine Schaunotizen
Moqup
Mockups mit HTML5.
Avoiding Faux Weights And Styles With Google Web Fonts
Ein Artikel über die richtige Einbindung von Google Web Fonts.
CSS Parser
Ein CSS Parser aus JavaScript.
DailyJS: JS101: The Function Constructor
DailyJS erzählt Euch mal was über den Function Constructor.
JSConf.US 2012 Videos
Die Vorträge von JSConf.US
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
54 min
July 18, 2012 Revision 80: X-Tag, Print Styles und IE-Basher bashen
Scheppman, Hans, Rodney und Kahlil trafen sich dieses mal wieder, um in illustrer Runde so zu tun, als hätten Sie eine Ahnung von Webentwicklung und so.
[00:00:15] News
getUserMedia() ist in Firefox gelandet
Schaunotizen
[00:00:39] styles.max.css
Daniel Eden schlägt vor, das CSS generell auch dekomprimiert auf dem Server bereit zu halten, damit Anfänger davon lernen können.
[00:12:40] It’s time to stop blaming Internet Explorer
Den Nicholas C. Zakas ermüdet das ewige IE-Gebashe und wir stimmen in diesen Kanon mit ein.
[00:22:06] box-decoration-break in Anmarsch
So langsam kommt box-decoration-break in die Browser. Der Schepp und Rodney sinnieren über die Sinnhaftigkeit des Propertys.
[00:40:22] X-tag – reduce your html
Der Autor behilft sich mit JavaScript, um HTML-Code zu sparen. Wir sinnieren auch hier über die Sinnhaftigkeit dessen.
[00:49:48] Keine Schaunotizen
Moqup
Mockups mit HTML5.
Avoiding Faux Weights And Styles With Google Web Fonts
Ein Artikel über die richtige Einbindung von Google Web Fonts.
CSS Parser
Ein CSS Parser aus JavaScript.
DailyJS: JS101: The Function Constructor
DailyJS erzählt Euch mal was über den Function Constructor.
JSConf.US 2012 Videos
Die Vorträge von JSConf.US
54 min
July 11, 2012 Revision 79: File System API, Chrome Apps und ein Haufen Links
Schepp war nicht da, aber mit Rodney, Hans, Kahlil und Peter an Bord waren wir trotzdem beschlussfähig. Haben wir schon erwähnt, dass Rodney seit letzter Woche offizieller Bestandteil der Crew von Working Draft ist? Glückwunsch Rodney!
[00:00:22] News
Fullscreen-API
Jetzt offizieller Working Draft
Weniger Prefixes in Firefox
Ab Version 16 sind Animationen, Transitions, Transforms und Gradients nicht mehr geprefixt
Schaunotizen
[00:01:14] Why no FileSystem API in Firefox?
Jonas Sicking erklärt, warum wir nicht damit rechnen sollten, die File System und File Writer zeitnah im Firefox vorzufinden. Andere APIs wie z.B. Indexed DB und Web Storage können fast alle Aufgaben der FS-API übernehmen. Wir gehen im Prinzip d‘accord und finden auch, dass die Alternativen einfach viel schöner sind, als der elaboriert-javaeske Code, der bei der FS-API anfällt – man sehe sich nur mal dieses Tutorial an. Und wer gar nicht ohne File System API kann, dem helfen (auf Indexed DB aufsetzende) Polyfills.
[00:16:06] Chrome Apps: JavaScript Desktop Development
Google hat auf der diesjährigen Google I/O mal wieder die Revolution angekündigt – diesmal sollen‘s Webapps auf dem Desktop werden. Klingt eigentlich ganz schön, nur Peter fühlt sich an Adobe Air erinnert und fragt sich, warum man sich Web-Gefrickel auf der Clientseite wünschen sollte. Immerhin sollen die entstehenden Technologien in die System Applications Working Group eingebracht werden, so dass vielleicht der eine oder andere Webstandard daraus entsteht.
[00:30:42] Keine Schaunotizen
Git in 15 Minutes
Großartiges interaktives Tutorial.
GitHub Android App Released
Github – jetzt auch für alle, die sich kein iPhone leisten können!
PHP – The right way
Versucht, den zahllosen ranzigen Tutorials im Web die Stirn zu bieten.
Replacing Text in DOM
Diese Technik kommt auch mit größeren Tag-Verschachtelungen klar und liefert ein valides Ergebnis.
iOS has a :hover problem
Erklärt, unter welchen Umstände iOS einen Klick/Tap als :hover interpretiert.
TYPO3 Codesprint Freiburg
Hans will mit euch am 13. Juli Typo3 aufmöbeln.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
36 min
July 11, 2012 Revision 79: File System API, Chrome Apps und ein Haufen Links
Schepp war nicht da, aber mit Rodney, Hans, Kahlil und Peter an Bord waren wir trotzdem beschlussfähig. Haben wir schon erwähnt, dass Rodney seit letzter Woche offizieller Bestandteil der Crew von Working Draft ist? Glückwunsch Rodney!
[00:00:22] News
Fullscreen-API
Jetzt offizieller Working Draft
Weniger Prefixes in Firefox
Ab Version 16 sind Animationen, Transitions, Transforms und Gradients nicht mehr geprefixt
Schaunotizen
[00:01:14] Why no FileSystem API in Firefox?
Jonas Sicking erklärt, warum wir nicht damit rechnen sollten, die File System und File Writer zeitnah im Firefox vorzufinden. Andere APIs wie z.B. Indexed DB und Web Storage können fast alle Aufgaben der FS-API übernehmen. Wir gehen im Prinzip d‘accord und finden auch, dass die Alternativen einfach viel schöner sind, als der elaboriert-javaeske Code, der bei der FS-API anfällt – man sehe sich nur mal dieses Tutorial an. Und wer gar nicht ohne File System API kann, dem helfen (auf Indexed DB aufsetzende) Polyfills.
[00:16:06] Chrome Apps: JavaScript Desktop Development
Google hat auf der diesjährigen Google I/O mal wieder die Revolution angekündigt – diesmal sollen‘s Webapps auf dem Desktop werden. Klingt eigentlich ganz schön, nur Peter fühlt sich an Adobe Air erinnert und fragt sich, warum man sich Web-Gefrickel auf der Clientseite wünschen sollte. Immerhin sollen die entstehenden Technologien in die System Applications Working Group eingebracht werden, so dass vielleicht der eine oder andere Webstandard daraus entsteht.
[00:30:42] Keine Schaunotizen
Git in 15 Minutes
Großartiges interaktives Tutorial.
GitHub Android App Released
Github – jetzt auch für alle, die sich kein iPhone leisten können!
PHP – The right way
Versucht, den zahllosen ranzigen Tutorials im Web die Stirn zu bieten.
Replacing Text in DOM
Diese Technik kommt auch mit größeren Tag-Verschachtelungen klar und liefert ein valides Ergebnis.
iOS has a :hover problem
Erklärt, unter welchen Umstände iOS einen Klick/Tap als :hover interpretiert.
TYPO3 Codesprint Freiburg
Hans will mit euch am 13. Juli Typo3 aufmöbeln.
36 min
July 04, 2012 Revision 78: Editoren, jQuery, Yeoman, Browser
Die gesamte Crew war an Bord, allerdings leider auch die Skype-Dämonen. Wir hoffen dass die Themen-Menge für die sporadischen Audio-Fails kompensiert.
[00:00:16] News
New (experimental) CSS feature: Hierarchies
Jetzt zum ausprobieren in Webkit Nightlies
Web Intents
Seit kurzem offizieller W3C-Draft
Schaunotizen
[00:01:08] Editoren & IDEs
Web-IDE Cloud9 stellt (unter anderem) sein neues Collaboration-Feature vor, während Adobe mit Brackets seine eigene Fassung eines Online-Codeeditors veröffentlicht (mit einigen sehr schicken Features). In der Offline-Welt ist derweil Sublime Text 2.0 Stable erschienen. Ebenfalls offline, aber nicht ganz so traditionell kommt Light Table daher, von dem es mittlerweile erste Brocken zu sehen gibt. Wir finden die Auswahl super, aber können Online-IDEs auch wirklich alles leisten, was ihre Offline-Verwandten können, z.B. Buildprozesse mit PNG-Optimierung? Möglich sein sollte es eigentlich. Peter baut sich seinen eigenen Cloud-Editor, indem er sein Sublime Text 2 nebst Einstellungen mittels Ubuntu One zwischen seinen Rechnern synchronisiert.
[00:20:42] Die Zukunft von jQuery
jQuery 1.8 ward angekündigt! Neu ist neben automatischen Vendor-Prefixes und so mancher internen Aufräumaktion vor allem Modularität, ganz ähnlich wie bei MooTools. Auch für die Versionen 1.9 und 2.0 laufen bereits die Planungen. Beide Versionen sollen die gleiche API haben – der einzige Unterschied ist, dass sich 2.0 die Unterstützung für alte Internet Explorer spart. Genaueres ist den Slides der jQuery Conference 2012 keynote zu entnehmen.
[00:34:20] Yeoman
Yeoman hält sich für eine Sammlung von Tools für Frontend-Entwicklung, Kahlil spricht hingegen einfach von „Grunt auf Crack“. Zusätzliche Features sind im wesentlichen Presents und ein paar Extra-Plugins für Grunt. Peter sieht nicht ganz ein, warum er sich von irgendwelchen Hanseln Grunt vorkonfigurieren lassen sollte, wenn er das doch selbst ganz gut kann.
[00:54:23] Chrome für iOS
Chrome für iOS ist da und findet durchaus unser Gefallen. Er kommt zwar notgedrungen ohne V8 daher und ist daher sogar eigentlich noch langsamer als Safari, aber ein paar Speed-Schmankerl gibt es trotzdem.
[01:04:47] Keine Schaunotizen
Retinafy your Website
Zum Ausdrucken und aufhängen.
Tinycon – Favicon Alert Bubbles
A small library for manipulating the favicon
Introduction To JavaScript Unit Testing
Autor Jörn Zaefferer ist für QUnit, das Testframework von jQuery, verantwortlich.
Symbolset
Eine bessere Icon-Font.
Recommendations for building smartphone-optimized websites
Google sagt wie sie’s gern hätten.
Google IO 2012 Notes
Gesammelt von Christian Heilmann.
SirPepe/HTML5Resources
Peter sammelt Links.
Repo.js
Sehr schick: Github-Projekte direkt in Websites einbetten!
Peity
Dynamisch generierte Inline-Graphen.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 16 min
July 04, 2012 Revision 78: Editoren, jQuery, Yeoman, Browser
Die gesamte Crew war an Bord, allerdings leider auch die Skype-Dämonen. Wir hoffen dass die Themen-Menge für die sporadischen Audio-Fails kompensiert.
[00:00:16] News
New (experimental) CSS feature: Hierarchies
Jetzt zum ausprobieren in Webkit Nightlies
Web Intents
Seit kurzem offizieller W3C-Draft
Schaunotizen
[00:01:08] Editoren & IDEs
Web-IDE Cloud9 stellt (unter anderem) sein neues Collaboration-Feature vor, während Adobe mit Brackets seine eigene Fassung eines Online-Codeeditors veröffentlicht (mit einigen sehr schicken Features). In der Offline-Welt ist derweil Sublime Text 2.0 Stable erschienen. Ebenfalls offline, aber nicht ganz so traditionell kommt
1 hr 16 min
June 27, 2012 Revision 77: Do not Track, IHK-Petition und Web Components
Überraschung: Sowohl Schepp als auch Peter waren zur Abwechlsung mal wieder an Bord. Der ewige Rod vertrat Hans und Kahlil.
[00:00:22] News
It’s Official, CSS Media Queries Are a Web Standard
CSS3 Media Queries sind eine fertige W3C Recommendation
Schaunotizen
[00:00:55] The Sabotage of Do Not Track
Kommt er oder kommt er nicht, der Do-Not-Track-Header? Und wenn ja, wie? Seit der Microsoft-Ankündigung, den IE10 per Default DNT:1 schicken zu lassen regt sich Widerstand bei den Werbenetzwerken. Ohne irgendwelche Gesetzgebung, als reiner Webstandard, wird es wohl schwer für Do Not Track …
[00:18:30] I Want a DAMNodeInserted Event
Epischer Hack implementiert einen primitiven DOM-Observer für Insertions, quasi als Teil-Polyfill für die in Revision 71 schon besprochenen DOM Mutation Observers. Der Trick ist zwar recht abgefahren, für Dinge wie accessifyhtml5.js aber sicher von Wert (falls man nicht gerade jQuery verwendet und die entsprechenden Hooks benutzt).
[00:29:05] X-Tag – Web Components Workshop und Working with CSS Regions and Shadow DOM
Präsentation eines Polyfills für Web Components (ihr wisst schon, Shadow DOM und so) und ein Adobe-Artikel zur Kombination von Shadow DOM und CSS3 Regions.
[00:42:35] Der IHK-Zwang muss abgeschafft werden
Vladimir Simovic erklärt uns warum der IHK-Zwang in die Tonne getreten gehört. Wir gehen d’accord und fordern zum Unterzeichnen der dazugehörigen Petition auf.
[00:57:05] Keine Schaunotizen
reFiddle
JSFiddle für Regex.
Asynchronous programming and continuation-passing style in JavaScript
Der Doktor erleuchtet uns über asynchrones JS.
DailyJS #js101
Artikel für JavaScript-Einsteiger.
Grunt plugins published to Npm
Damit man nicht mehr selbst Tasks bauen muss.
pageguide.js
An interactive guide for web page elements using jQuery and CSS3.
10 things you didn’t know JavaScript could do
Von @asciidisco.
Cool URIs don’t change
Steinalt, aber immer noch relevant und richtig.
Shumway & bikeshed.js
Flash-Interpreter in JS.
CSS generated content and screen readers
Die lesen das Zeug vor!
Skrollr
Scrolling-Library ohne Dependencies.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 5 min
June 27, 2012 Revision 77: Do not Track, IHK-Petition und Web Components
Überraschung: Sowohl Schepp als auch Peter waren zur Abwechlsung mal wieder an Bord. Der ewige Rod vertrat Hans und Kahlil.
[00:00:22] News
It’s Official, CSS Media Queries Are a Web Standard
CSS3 Media Queries sind eine fertige W3C Recommendation
Schaunotizen
[00:00:55] The Sabotage of Do Not Track
Kommt er oder kommt er nicht, der Do-Not-Track-Header? Und wenn ja, wie? Seit der Microsoft-Ankündigung, den IE10 per Default DNT:1 schicken zu lassen regt sich Widerstand bei den Werbenetzwerken. Ohne irgendwelche Gesetzgebung, als reiner Webstandard, wird es wohl schwer für Do Not Track …
[00:18:30] I Want a DAMNodeInserted Event
Epischer Hack implementiert einen primitiven DOM-Observer für Insertions, quasi als Teil-Polyfill für die in Revision 71 schon besprochenen DOM Mutation Observers. Der Trick ist zwar recht abgefahren, für Dinge wie accessifyhtml5.js aber sicher von Wert (falls man nicht gerade jQuery verwendet und die entsprechenden Hooks benutzt).
[00:29:05] X-Tag – Web Components Workshop und Working with CSS Regions and Shadow DOM
Präsentation eines Polyfills für Web Components (ihr wisst schon, Shadow DOM und so) und ein Adobe-Artikel zur Kombination von Shadow DOM und CSS3 Regions.
[00:42:35] Der IHK-Zwang muss abgeschafft werden
Vladimir Simovic erklärt uns warum der IHK-Zwang in die Tonne getreten gehört. Wir gehen d’accord und fordern zum Unterzeichnen der dazugehörigen Petition auf.
[00:57:05] Keine Schaunotizen
reFiddle
JSFiddle für Regex.
Asynchronous programming and continuation-passing style in JavaScript
Der Doktor erleuchtet uns über asynchrones JS.
DailyJS #js101
Artikel für JavaScript-Einsteiger.
Grunt plugins published to Npm
Damit man nicht mehr selbst Tasks bauen muss.
pageguide.js
An interactive guide for web page elements using jQuery and CSS3.
10 things you didn’t know JavaScript could do
Von @asciidisco.
Cool URIs don’t change
Steinalt, aber immer noch relevant und richtig.
Shumway & bikeshed.js
Flash-Interpreter in JS.
CSS generated content and screen readers
Die lesen das Zeug vor!
Skrollr
Scrolling-Library ohne Dependencies.
1 hr 5 min
June 23, 2012 Revision 76: Testen, Dokumentieren und Abhängigkeiten verwalten
Dieses mal trafen sich Hans, Sebastian Golasch aka @asciidisco und Kahlil in Skype, um sich durch einen stattliche Anzahl an Themen zu arbeiten.
[00:00:40] News
image-resolution in Webkit
CSS Variables in WebKit (prefixed)
Border-Image in Firefox 15
Opera 12 ist da
Die IE7-Steuer
Schaunotizen
[00:02:21] Zombie.js
Ein schneller, kopfloser Browser auf Node.js Basis um JavaScript zu testen. Nützlich?
[00:14:15] Auf echten mobilen Endgeräten testen ohne Bankrott zu gehen
Brad Frost spricht über die Anschaffungskosten für mobile Endgeräte, die man zum testen braucht und macht Vorschläge, wie man Kosten sparen kann. Wir reden darüber und über die weiteren Aufwände, die beim Testen von mobilen Geräten aufkommen.
[00:25:34] Mobile Safari auf iOS 6
Welche Features bringt Safari in iOS 6 für uns Webentwickler?
[00:31:42] Volo.js
Sebastian erklärt uns ausführlich was es mit Volo.js und anderen Dependency Managern für JavaScript im Frontend auf sich hat.
[00:45:54] JavaScript Doc Tools
Sebastian und Kahlil tauschen sich über ihre Erfahrungen mit JavaScript Dokumentations-Tools wie YUI Doc und docco aus.
[00:56:05] Keine Schaunotizen
Gradient Finder
Findet CSS-Gradients in einem Bild.
Mozilla CSS Extensions
Liste aller mozillaspezifischen CSS-Erweiterungen.
Debunking Responsive CSS Performance Myths
CSS Performance-Mythen entkräften
ECMAScript 6: Maps, Sets und Weak Maps
Peter Kröner über neue JavaScript-Features.
Require.js Hogan Plugin
Templates im Buildprozess direkt kompilieren.
EditorConfig
Editoreinstellungen projektweit festlegen.
How Browsers Work Internally (Video)
Talk von Tali Garsiel auf der Front-Trends 2012.
memSQL
memSQL ist angeblich 30 mal schneller als SQL
Pew Pew Manifesto
Adobe propagiert, daß sich JavaScript für große Projekte nicht eignet.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 14 min
June 22, 2012 Revision 76: Testen, Dokumentieren und Abhängigkeiten verwalten
Dieses mal trafen sich Hans, Sebastian Golasch aka @asciidisco und Kahlil in Skype, um sich durch einen stattliche Anzahl an Themen zu arbeiten.
[00:00:40] News
image-resolution in Webkit
CSS Variables in WebKit (prefixed)
Border-Image in Firefox 15
Opera 12 ist da
Die IE7-Steuer
Schaunotizen
[00:02:21] Zombie.js
Ein schneller, kopfloser Browser auf Node.js Basis um JavaScript zu testen. Nützlich?
[00:14:15] Auf echten mobilen Endgeräten testen ohne Bankrott zu gehen
Brad Frost spricht über die Anschaffungskosten für mobile Endgeräte, die man zum testen braucht und macht Vorschläge, wie man Kosten sparen kann. Wir reden darüber und über die weiteren Aufwände, die beim Testen von mobilen Geräten aufkommen.
[00:25:34] Mobile Safari auf iOS 6
Welche Features bringt Safari in iOS 6 für uns Webentwickler?
[00:31:42] Volo.js
Sebastian erklärt uns ausführlich was es mit Volo.js und anderen Dependency Managern für JavaScript im Frontend auf sich hat.
[00:45:54] JavaScript Doc Tools
Sebastian und Kahlil tauschen sich über ihre Erfahrungen mit JavaScript Dokumentations-Tools wie YUI Doc und docco aus.
[00:56:05] Keine Schaunotizen
Gradient Finder
Findet CSS-Gradients in einem Bild.
Mozilla CSS Extensions
Liste aller mozillaspezifischen CSS-Erweiterungen.
Debunking Responsive CSS Performance Myths
CSS Performance-Mythen entkräften
ECMAScript 6: Maps, Sets und Weak Maps
Peter Kröner über neue JavaScript-Features.
Require.js Hogan Plugin
Templates im Buildprozess direkt kompilieren.
EditorConfig
Editoreinstellungen projektweit festlegen.
How Browsers Work Internally (Video)
Talk von Tali Garsiel auf der Front-Trends 2012.
memSQL
memSQL ist angeblich 30 mal schneller als SQL
Pew Pew Manifesto
Adobe propagiert, daß sich JavaScript für große Projekte nicht eignet.
1 hr 14 min