Mastering Sass: From Beginner to Expert
How many lines of CSS would you say go into the typical web project? What about just those lines for accommodating fluid, responsive break points? How about for browser compatibility? Typography rules? Color schemes?
The amount of CSS we use to make the web beautiful has increased in step with the amount of control granted to us by browser engines. And it is unlikely to decrease any time soon.
Enter Sass: an elegant solution to writing fewer lines of CSS while, at the same time, doing an order of magnitude more with them.
Recently, Sass was adopted by the core WordPress development team in order to optimize how the admin area of WordPress is styled. You probably already knew that, and you probably hear it mentioned everywhere because it is an extremely popular way to style the web.
It’s an important toolset to have in any front-end developer’s wheelhouse, and this course is designed to make it a stronger part of yours.
Follow along with Greg as he carefully explains the basic building blocks of Sass, gradually walking you through to several expert design practices. Whether you’re afraid of Sass, are just starting to use it, or have been comfortable with it for some time, there is something for you in this course.
You must be a WPSessions Member to access this course. Become a member
Already a member? Please sign in.
Lessons
| 1 | Introduction to Sass | 12:30 |
|---|---|---|
| 1.1 | Introduction to Sass | 4:06 |
| 1.2 | Sass Lingo | 2:42 |
| 1.3 | Sass Compilers | 1:21 |
| 1.4 | Introduction to Sass Frameworks | 1:27 |
| 1.5 | Getting Started | 2:54 |
| 2 | Compiling Sass with Grunt | 12:33 |
| 2.1 | Preparing Your Project for Sass | 3:51 |
| 2.2 | Installing Node.js | 3:16 |
| 2.3 | Teaching Grunt to Compile Sass | 5:26 |
| 3 | Sass Variables | 6:12 |
| 3.1 | Introduction to Sass Variables | 6:12 |
| 4 | Nesting in Sass | 8:37 |
| 4.1 | Introduction to Sass Nesting | 3:57 |
| 4.2 | Styling Navigation using Nesting | 4:40 |
| 5 | Sass Mixins and @extend | 16:34 |
| 5.1 | Introduction to Sass Mixins | 3:10 |
| 5.2 | Understanding @extend | 4:57 |
| 5.3 | Using Operators and Control Structures in Sass | 5:38 |
| 5.4 | Creating an rem unit mixin | 2:49 |
| 6 | Sass Frameworks | 7:03 |
| 6.1 | Using Sass Frameworks | 7:03 |
| 7 | Conclusion | 0:21 |
| 7.1 | Conclusion | 0:21 |