Learn to create a simple Sass function that calculates your flex-basis value, including flexible margins. The per-line() function places the number of flex items defined on one line (if the available space allows it). As a result, your flex items will line up perfectly across multiple flex lines.

In this talk from Nodevember 2016, Guil covers essential features of React Router, a popular React library that manages navigation and rendering of components in React apps.

Mixins are arguably one of the more widely used tools in the Sass language next to the variable. Coming with that, mixins are more apt to be the most abused tool in the language. Mixins are extremely powerful and capable of doing a great number of things, but as we are creating these massive bodies of complex code, it’s easy to find ourselves in a place where we have too many arguments in order to use our mixin. It’s at this point we have started to lose comprehension of what’s happening. The complexity of the tool starts to outweigh its value.

CSS needs to be reusable, scalable and adaptable to different use cases. When writing modular CSS, our goal should be to get to a point where modifying or re-arranging anything about the structure will not break the front-end.

Just when you’re getting used to working with Sass, you hear about a new type of Sass called LibSass. Then you immediately start asking yourself: “What the heck is LibSass? Should I drop Ruby Sass and get on board with LibSass? Oh no — I’m behind on the new hotness!”

Since we launched Sass break, we’ve received links to helpful Sass tools and snippets from readers. So in this post, we’re giving them a hat tip by sharing their tools and code snippets with everyone!