@jhirth's .noplan

When it comes to nice-looking layouts, effective whitespace usage is key. There should be little space between elements you want to visually group together and significantly more space between elements you want to separate.

Of course, your whitespace usage should be consistent across all pages. All of your building blocks should behave in the same predictable manner. It shouldn’t matter in which order they are put into containers. Conveniently for us, CSS makes this fairly easy if we follow some self-imposed rules.

Read more (+844 words)

Github and many other sites show a link to a particular section when you hover a heading. This lets visitors deep-link particular sections. Jekyll, a popular static website generator, doesn’t do this by default, however.

Kramdown, the Markdown parser which is generally used by Jekyll and thus on Github Pages, already does most of the work. It “slugifies” the heading’s text and adds it as “id” attribute to the heading tag. This means you could already jump there via fragment links.

All that’s missing is some JS and CSS for giving users direct access to these fragment links. Of course this kind of thing has been done before, but I wanted something just as minimalist as this blog’s design. There is no need for fancy icons – a simple ‘#’ will do. Furthermore, I don’t care about older browsers, which means I can cut it down even more.

Read more (+519 words)

ES6 (aka ES2015) introduced the let and const keywords. Both let you create block-scoped variables. The difference is that those created with const are read-only. Well, the binding is. It doesn’t make objects immutable. It only prevents you from assigning something else to that variable.

Immutability is all the rage when it comes to functional programming. Naturally, using const wherever you can became popular in some circles.

Read more (+565 words)