Simple layouting with Gulp

Have you ever wanted to make a really quick and simple website using Gulp with repeating components like header and footer, but didn’t quite manage to find a good layouting system? I’ve gone a bit crazy after a while of searching, so crazy that I ended up with Ember, which is not even a layouting system, it’s a MVC framework and not at all what I wanted. For Grunt there’s Assemble, but even if it existed for Gulp (it kinda does) it’s still to complicated. The solution is really dead simple—gulp-wrap.

GitHub Pages file name clash

Let’s say your user or organization name on GitHub is “easy-peasy”. You want to create a blog or something, so you create a repository named “easy-peasy/easy-peasy.github.io”, as instructed in the GitHub Pages documentation. Now you want to create a new repository, “easy-peasy/lemon-squeezy” that you also want hosted on GitHub Pages, so you create a gh-pages branch with an index.html in the root. What would happen if in “easy-peasy/easy-peasy.github.io” you created a lemon-squeezy/index.html file, as they would have the same URL?

CSS pre- vs. post-processing

CSS preprocessors are awesome, the’ve revolutionized CSS authoring. Writing cross-browser CSS today is a lot easier because all vendor prefixes and browser hacks can be abstracted away into mixins, placeholders and what have you. For a while this was more than enough, but because we are obsessive, mentally deranged control-freaks we want more. Always more. MOOOOAAAAR. Say hello to CSS postprocessing!

Speedy Sass with @import & Sprockets

We learned that it’s not possible to properly use Sprockets with Sass because access to global variables, mixins and functions (let’s call them globals) would be lost. Only @importing them works. If you, like me, really love designing in the browser (maybe using LiveReload or something similar), you are probably having a hard time dealing with the slow compilation time on larger projects, because it’s killing your creativity. I would like to propose a way to bring Sprockets back to the game.