English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 3 Hours | 503 MB
No more cluttered CSS! Realize clean designs lightning-fast and without frustration using Sass & SCSS.
Power up your website design skills with Sass & SCSS — the powerful CSS preprocessor!
This course is the complete masterclass for Sass & SCSS development. It covers all you need to know about this awesome technology including:
- How to use Sass / SCSS to create more flexible designs in less time and generate CSS code from them
- How to use variables to store colors, sizes, fonts and more to avoid repetition and make your designs more flexible and reusable
- How to perform calculations right inside your Sass & SCSS code to create responsive and flexible layouts
- How to use mixins and imports to reuse your existing designs and finish new projects in no time
- How to use inheritance in Sass to avoid duplicating code and the nasty bugs that come with it
- How you can use Sass to write scaleable CSS code even for big projects
You will also learn how to use Sublime Text 3, one of the most popular lightweight text editors out there, confidently and write your code with lightning speed.
During the course, you will create useful code snippets in Sass that you can use in future projects to double your development speed — and you will have all the tools you need to create more such snippets to enhance your productivity even further and make clients happy!
You can test what you learned in several quizzes and by coding along while we create a library of powerful code snippets.
What are the requirements?
- We will cover all setup required.
- You need NO previous knowledge with Sass or Bootstrap.
- You should know basic HTML & CSS.
- You need basic computer skills to install and run applications.
What am I going to get from this course?
- Over 35 lectures and 3 hours of content!
- Write professional Sass code and generate CSS code from it.
- Realize designs much faster with less frustration.
- Use variables to make designs more flexible and avoid repetitive code.
- Use mixins to reuse existing solutions and built upon them without re-inventing the wheel
- Use functions and operators to calculate flexible dimensions, colors and more.
- Import fonts and existing Sass files into new designs to reuse them.
- Use Sublime Text 3 confidently to write Sass code swiftly.
What is the target audience?
- You want to skyrocket your productivity when writing CSS code.
- You want to keep up with current web design trends.
- You want to write scaleable CSS code.
- You want to avoid cluttering your code with repetitive selectors.
- You want to make your designs much more flexible and easily create different variants of your beautiful designs.
- You don’t want to start from scratch in every project but have a flexible way to reuse existing designs to finish projects fast.
- You want to build upon your Bootstrap knowledge and complement it with Sass to finish beautiful designs more effectively.
Introduction – Welcome To The Complete SASS & SCSS Course!
Introduction: Welcome To The Complete SASS & SCSS Course!
Introduction Continued: Here is What You Will Learn In Our SASS & SCSS Course!
How To Follow Along and Use This Course
What Is a Preprocessor?
Sass or SCSS?
Setting Up Sublime Text 3
Installing Sass / SCSS
A Quick Test
Setting Up The Project Structure
Variables in Sass
Using Variables Correctly
Mixins in Sass
Mixins with Arguments
Passing Content Into Mixins
Imports in Sass
Practice Activity: A Mixin to Import Fonts
Nested Media Queries in Sass
Practice Activity: Mixins & Media Queries
Basic Arithmetic & The Sass Shell
What Are Functions?
Creating Your Own Functions
Inheritance with @extend
More About @extend
Do You Need It? @extend vs. @mixin
Using the @if and @else Directives
Practice Activity: @if Directives To Switch Themes
Practice Activity: A Useful Mixin With @if
Course Summary & Course Conclusion – It’s Now Time To Apply What You’ve Learned
Course Summary & Course Conclusion – A Short Overview of What We Have Learned
A Special Bonus Lecture Exclusively For The Students Enrolling In This Course!