Preparing for the workshop

You’ll need to bring your laptop with a modern browser and your favorite code editor installed. There are code demos in this book. I put both the code into the page and on Codepen is live demo. You can find those live demos in the following Codpen collection. Please fork them and play around the code yourself. You won’t learn it until you hack it.

http://codepen.io/collection/XdbWMW/

prefix-free library

prefix-free is the JS library made by Lea Verou. It parses the CSS properties and apply certain vendor prefixes on the rules by determining the browser version. This library allows us to skip worrying about different prefixes and the old syntaxes.

Preprocessor

The logic in CSS preprocessor provides us the DRY—Don’t repeat yourself—way to write the CSS code. We will use some Scss code when defining the grid layout. It’s loop and list feature helps reducing the lines of code a lot. If you are using other preprocessor, you may find their equivalents in CSSPre.com. If you aren’t using any preprocessor, no worry, we also provide the full CSS code.