Learning by doing one (mini) project at a time

Navigation

Using And Understanding ES6 Today - Block Scoping

When yet another JS framework lurks around and everyone starts jumping on the buzz words bandwagon, you might rightfully sense that feeling of "déja vu" and can be excused when caught screaming out of your lungs "Not again !!!". In the case of ES6 though, Javascript - the language, is the one evolving from its solid predecessor ES5 and you will be wrong to miss the early train on this one. This post is the first in…

Create an off canvas navigation menu with CSS

Popularized by apps like Facebook on mobile, the off canvas menu allows to save valuable real screen estate by toggling the navigation into view only when needed. We will dive and explore one way of achieving the effect using some overlooked CSS properties. View Demo Download Source View On Github Click on the starter.html file and save it on your computer. The finish.html is also there for your reference. If you are more the…

Designing Your Own Masonry Grid Layout From Scratch

I was fascinated by the masonry layout made popular by Desandro famous jQuery plugin the moment I saw it. Beyond the fascination I was intrigued at how was it done, what was going on under the hood? It's no hazard that the first official post of this hacker blog takes a deep dive in creating our very own version of it. View Demo Download Source Code View On Github Goals and Challenges First let's outline some…