Watch videos with subtitles in your language, upload your videos, create your own subtitles! Click here to learn more on "how to Dotsub"

What is a CSS Preprocessor

0 (0 Likes / 0 Dislikes)
[What is a CSS preprocessor?} [Learning Sass and Compass, Chapter 2, with Addison Berry] Sass is in a class of tools called CSS preprocessors. CSS preprocessors have been around for quite a while, but they really started to gain popularity in the last several years. So in this lesson we're going to take a look at what is a CSS preprocessor? What are the benefits to actually using them, and why are they becoming popular now? And then we're going to finish it up by looking at some of the most popular CSS preprocessors that are out there today. So let's dive in and start with the basics. What is a CSS preprocessor? At its most basic, a CSS processor really is just a scripting language that extends regular CSS, and then you use some sort of program, application, to compile that scripted language into the regular CSS syntax that your browser is expecting to see and use. So it's just a matter of basically learning a new language that's very similar to CSS but has some additional things that you can use in the language and sorting out how you're going to get that compiled into regular CSS. When it comes to reasons for using a CSS processor, there are actually quite a number of reasons and the reason that they're becoming so popular. So you can write sort of cleaner, more readable code in your CSS files. You have lots of reusable pieces, so you can sort of define something in your CSS and then just reuse a shorthand for that or reuse the chunks of CSS that you've written, without having to actually, literally, write it out every single time that you need to use it in your code. And there's ways of, visually, organizing your CSS code that makes it easier to read and see what's being applied where. You also get some flexibility to do things on the fly. You have various things you can do with conditions. So if this, then do that. And you can do things like calculations, You can use math, and you can modify colors, based on a variety of things that sort of happens as you go, rather than having to actually hard-code that information directly into your CSS. You also get exposed to a lot of snippets libraries, things that other people have written to solve common problems. And you can simply—It's very easy to import those into your CSS and reuse what other people have created. You can also, once you've sort of created your own way of approaching a problem, you can share that with other people, either generally in the community, the web community, or, let's say, on your team working on a project, you may come up with a solution within the CSS that you would like everybody to use. And you can bundle that up and then let everybody use it really, really easily. And the other really nice thing is one of those common problems that people solve using CSS preprocessors are cross-browser compatibility issues. And there are a lot of libraries of what they call mixins available that solve these common problems. And then when you write your scripting language, your CSS preprocessor language, when that gets compiled into the regular CSS that browsers read, it adds in all of the information that's needed to make sure that your CSS actually does work across all browsers. So it's a huge timesaver in terms of having to troubleshoot and track down and make sure that you're writing the correct code for all of the different browsers that you're trying to target. There are a number of CSS preprocessors that are available today The three main ones that are quite popular are Sass, LESS, and Stylus, with Sass and LESS probably being the two most popular ones that people are using these days. [Drupalize.Me: Learn Drupal]

Video Details

Duration: 4 minutes and 11 seconds
Country: United States
Language: English
License: All rights reserved
Genre: None
Views: 48
Posted by: drupalizeme on May 20, 2013

Sass is in a class of tools called CSS preprocessors. CSS preprocessors have been around for a while now, but they've really started to gain in popularity in the last several years. In this lesson we'll find out what a CSS preprocessor is, what the benefits of using one are, and which ones are popular today.

Caption and Translate

    Sign In/Register for Dotsub to translate this video.