Notes and anecdotes

Techstuff rambling

Creating a Google Chrome Extension

I’ve heard multiple say that creating a chrome extension is about as easy as creating a static web page. Is it really? Here’s a step-by-step on how I created my first Trello-integrated chrome extension, almost like a simple and developer-friendly version of Momentum.

CSS systems and principles

What’s wrong with CSS? How do you write scalable CSS? What’s the difference between SMACSS, BEM, OOCSS, SUIT CSS and Atomic Design? Here’s some opinionated thoughts on the confusing world of CSS.

Semantic vs Content-Independent CSS

Say you have a search form in the top right corner of your website, that looks something like the picture below. What should be the class name of a component? If you use semantic classes, you could name it something like “search” or even “header-search”, because it is how it’s used. If you use content-independent classes, you might call it…

Continue Reading

Awesome webdeveloper links

Just a collection of links that allow you to create webpages faster or simpler or sexier.

Chromes Awesome Developer Tools

Here is a great talk about them Chrome tools. You can emulate reduced network speed You can emulate other device You can force states (:active etc) for elements You can smartprint objects You can group console logging You can time sections of the code or timestamp all logging You can insert debugger stops debugger; You can…

Continue Reading

Creating a presentation

People still call presentations or slides for powerpoints. That’s kind of funny. This could be an anecdote about that, but it’s not. I’m about to make some slides, and I wonder what applications to use. So here’s some notes instead. I googled around, and liked these two: The first is really the visual editor implementation of the…

Continue Reading

Parallax. CSS it, please.

Parallax is hot. But in so many implementations, it’s not. Because it’s implemented shittily. Parallax shouldn’t be done with Javascript, because then it might end up like this: so laggy it breaks my heart. It should be done with CSS. Jsfiddle  

Building a better bootstrap

These are my notes from Build a Better Bootstrap, by Tim G. Thomas. It’s a good talk. Just not good notes. Overflow: hidden; (Or clear:both?) Can help with those fesky times where an outer container doesn’t wraps around the inner elements. box-sizing: border-box; What this does, is include padding and border in the width of an…

Continue Reading

Grunt: Don’t worry about webkit-*, moz-* when typing css

Would you like to skip having to think about vendor prefixes when typing css? Wouldn’t we all. We could skip it though, with grunt autoprefixer.