Issue #140  (Houdini & Learning Tools)


(Skip to the tools section below)


A few months ago, I came across a project called Houdini. Since I come across so many things every day, I gave it a pretty superficial look and didn't really understand what it was all about, so I discarded the tab in my browser and went along my merry way.

Fortunately for people like me with little patience for technical jargon, Philip Walton has blown it all open in his fantastic article on Smashing Magazine this week. He calls it 'maybe the most exciting development in CSS you've never heard of'. And he's right.

To quote the article:

"...imagine how much nicer your development life would be if you could use any CSS property and know for sure it was going to work, exactly the same, in every browser. And think about all of the new features you read of in blog posts or hear about at conferences and meetups — things like CSS grids, CSS snap points and sticky positioning. Imagine if you could use all of them today and in a way that was as performant as native CSS features. And all you’d need to do is grab the code from GitHub."

One of the code examples that Philip uses that really blew my mind is this:
 
body {
  display: layout('masonry');
}

The associated JavaScript defines a class that holds the masonry layout logic, and this single line of CSS is all you need to make it work. Masonry, of course, is a popular layout technique that is possible only with a JavaScript library or plugin, or else a lot of really complex HTML and CSS.

If you're a CSS developer, I think that should pique your interest enough to check out the full article. Quite an interesting initiative that I'll be paying close attention to.


Now on to this week's learning tools!
 

Newsletters and Podcasts


JavaScript Air
"The live broadcast podcast all about JavaScript."

Toolsday Podcast
"A 20-ish-minute podcast about the latest in tech tools, tips, and tricks."

SVG Immersion
"A podcast that empowers you to passively learn SVG. Each episode is a deep dive in to one SVG concept, designed to supplement and reinforce difficult concepts."

EmberWeekend
"A week(end)ly podcast about Ember."

Style Guide Podcast
"A small batch series of interviews on Style Guides, hosted by Anna Debenham and Brad Frost." No new episodes coming, but the archives should be valuable.

Adventures in Angular
"A weekly show dedicated to the AngularJS framework."

ES.next News
"5 ECMAScript.next links every week, in your inbox. Curated by Dr. Axel Rauschmayer and Johannes Weber."

SVG Weekly
"A weekly email selection of interesting links to Scalable Vector Graphics (SVG) tutorials, tools, experiments and talks."

Frontend BUZZ
5 front-end links daily.

CSS Layout News
"A weekly collection of tutorials, news and information on all things CSS Layout."

Fullweb Weekly
5 links every week for full-stack developers.

Web Animation Weekly
"A hand-picked selection of articles, videos, book reviews, and other goodies pertaining to the wonderful worlds of web animation and motion design."

Dev Diner Newsletter
"Links to the latest in VR, AR, wearables, the Internet of Things and all sorts of other new tech."

NCZOnline Newsletter
"Delivered every other Tuesday and is intended for web application engineers who want to grow their career."

 
384 Pages of CSS for $7 (PDF E-Book)
 

Books


Eloquent JavaScript — The Annotated Version
"An annotated version of the second edition of Eloquent JavaScript by Marijn Haverbeke, which is licensed under a Creative Commons attribution-noncommercial license."

Frontend Architecture for Design Systems
By Micah Godbolt. "Takes experienced web developers through the new discipline of frontend architecture, including the latest tools, standards, and best practices."

Building APIs with Node.JS
By Caio Ribeiro Pereira. "In this book, you'll learn in practice how to build scalable APIs in Node.js platform through writing elegant codes using ECMAScript 2015 (aka ES6) and some popular frameworks like Express, Passport, ApiDoc, Mocha, Helmet and more."

Jump Start Git
By Shaumik Daityari. Aimed at beginner-level developers with little or no Git experience, to help get up and running with Git quickly.

Setting Up ES6
By Axel Rauschmayer. "Learn how to set up ES6, with a focus on configuring Babel 6."

MEAN Machine
By Chris Sevilleja and Holly Lloyd. "A beginner's practical guide to the JavaScript stack. Become an impressive Node.js, AngularJS, ExpressJS, and MongoDB developer."
 
70 JavaScript and DOM Tips for $5 (EPUB, MOBI, PDF)
 

Courses and Screencast Series


JsTips
iOS and Android app that gives you a JavaScript tip every day.

React.js Fundamentals
"If you're new to React.js, there's no better place to learn React.js and the React ecosystem than with this React.js fundamentals course."

Functional Flexbox
"Learn to create bulletproof layouts using Flexbox in this free email course."

React for Beginners
"Upgrade your JavaScript skills. Learn React.js in just a couple of afternoons. A premium step-by-step training course to get you building real world React.js + Firebase apps and website components."

Angular Meteor Tutorial
A tutorial that teaches you how to build apps with the angular-meteor, a library that combines the two technologies.

Servers for Hackers
Video screencasts, a newsletter and other resources for developers who want to learn more about server administration.
 
384 Pages of CSS for $7 (PDF E-Book)
 

A Tweet for Thought

Trek Glowacki has an interesting way to determine if he made a good decision on a hire.
 

Suggestions / Corrections

Made something? Send links via Twitter @WebToolsWeekly (details here). No tutorials or articles, please. If you have any suggestions for improvement or corrections, feel free to reply to this email.
 

Before I Go...

In case you missed it, I've published the results of SitePoint's Ultimate CSS Survey.

Thanks to all for subscribing and reading!

Keep tooling,
Louis
webtoolsweekly.com
@WebToolsWeekly
Copyright © 2013 Web Tools Weekly, All rights reserved.

Email Marketing Powered by MailChimp