Using CSS Preprocessors to Save Time

Introduction

Preprocessors (aka precompilers) can make your life much easier when building a website. To be more specific the preprocessors eliminate code repetition and provide all sorts of yummy time-saving and code-saving features.

Learning Objectives

  • What a preprocessor is
  • Why preprocessors rock
  • What it means that a preprocessor "compiles to CSS"
  • SASS/SCSS
  • How to use SASS to nest CSS
  • How to use SASS to work with variables in our code
  • Why we should use mix-ins with SASS
  • How to set up SASS
  • What LESS is and how it is different from SASS
  • Other preprocessors we can find out there

Study

  1. Watch this recorded live session

  2. Read Introduction to CSS Preprocessors from Steven Bradley

  3. Read 6 Reasons You Should Use a Preprocessor

  4. Read Choosing the Right CSS Preprocessor from Treehouse

  5. Look over SASS’s getting started guide, which provides a brief look at its awesome features and then watch this 20-minute Sass Crash Course:

Additional Resources

In this section you can find a lot of helpful links to other content. This is a supplemental material for you if you want to dive deeper into some concepts.

Leave a Reply