We code the web

Faster CSS coding with Hayaku

Lately a good friend of mine showed me this plugin for Sublime Text called Hayaku. I had never heard of it so I asked him what it was. It’s like Emmet for CSS. Hey, I know Emmet, it makes writing HTML and CSS easier, so what’s this about?

Why React PropTypes are important

Props are the mechanism React uses to let components communicate with each other. A parent component can pass it’s child(ren) named prop values, which the child can then use in its internal logic.

How to structure your front-end application

I have always been very picky about a good folder structure. I enjoy working in a neatly structured project. How do we go about this in a front-end application?

Var, let or const, what to use?

The Javascript world has grown, a lot. Instead of a simple scripting language, it is now used as a full blown programming language for the web. Not to forget it’s server side capabilities with NodeJS. ECMAScript 6 brings some features to make Javascript a more ‘mature’ language. A good example is the new let and const variable types.

Quick tip: shortId

Generating id’s, no matter the concern, it always comes in handy. Check out this little fella!

Goodbye nested lists, hello SASS maps!

SASS lists are great, and with multidimensional lists you can get a key-value-like experience, but not completely..

ES6 Destructuring

Destructuring must be my favorite feature of ECMAScript 6. I don’t exactly know why, I guess I just like the simplicity. It makes your code more clean and declarative.

Using icon fonts with SASS

Sometimes you want to display an icon in your website somewhere, but you do not want to touch the HTML. For instance if you have an auto-generated link in your CMS and you want to prefix it with an icon. This is actually very easy to do, because that is exactly what icon font vendors like Bootstrap Glyphicons and FontAwesome already do!