-
Learning by doing
-
Trainers with practical experience
-
Classroom training
-
Detailed course material
-
Clear content description
-
Tailormade content possible
-
Training that proceeds
-
Small groups
In the course Sass and Less Preprocessing participants learn the functionalities of the CSS Preprocessors Sass and Less. Preprocessors are script languages ​​that extend the default capabilities of CSS. This makes it possible to use logic in CSS code with variables, nesting, inheritance, mixins, functions and mathematical operations. CSS preprocessors make it easy to automate repetitive tasks and reduce errors.
The course starts with a discussion of the basic characteristics of Sass and Less. The Sass syntax with the .scss file extension is discussed. Sass uses standard CSS syntax with braces and semicolons. It is also explained how Less is actually a JavaScript library that requires either NodeJS or compilation using .less files.
Subsequently the variables and types of Sass are discussed and the scope of variables, nested rules and nested properties is explained. And also Sass Plugins are treated.
Attention is paid as well to Less variables and types and the syntax of variable interpolation is discussed. The use of mixin's and the parameterization thereof is also part of the program of the course.
A number of directives can be used in Sass such as @import, @mixin, @include and @extend. The meaning and application of these directives is treated. There is also attention for various Sass functions such as Map, Selector and Introspection.
The course concludes with the subject of testing Sass and Less. This includes the Less Hat, Clearless and 3L libraries.
The course Sass and Less Preprocessing is intended for Web Designers and Developers who want to use Sass and Less Preprocessing in the development of Web Applications.
Knowledge and experience with HTML and the basic principles of Cascading Style Sheets (CSS) are required.
The concepts are discussed on the basis of presentation slides. Demo projects are used to clarify the concepts. The theory and the demos are interchanged with hands-on exercises. Course times are from 9.30 to 16.30.
After successful completion of the course participants receive an official certificate Sass and Less Preprocessing.
Module 1 : CSS Preprocessors |
Module 2 : Sass Variables |
Module 3 : Less Variables |
What is Sass? Installing Sass CSS Extensions Sass Transpilation What is Less? CSS3 for Styling CSS Inheritance CSS Cascading Compiling Less CSS Resets Layout in Less Autoprefixing BEM Methodology |
Variable Syntax Strings Numbers Colors Booleans Lists Nulls SCSS Syntax Variable Scope Sass !global Plugins Nested Rules Nested Properties |
Naming Variables Variable Types Using Variables Variable Interpolation Non Staticness Declaration Order Escaping Values Detached Rulesets Lazy Loading Mixins Basic Mixins Parametric Mixins Default Values |
Module 4 : Sass Directives |
Module 5 : Sass Functions |
Module 6 : Testing Sass and Less |
Importing Files Sass @import Partials Sass Mixins @mixin Defining Mixins Passing Parameters Vendor Prefixes Mixin @include @extend Directive Inheritance |
String Functions Numeric Functions List Functions join and append Map Functions Selector Functions Introspection Functions feature-exists function-exists type-of Color Functions |
Using Developer Tools Understanding TDD Test Cycle Using Style Guides Building Style Guides Prebuilt Mixins Less Hat Library SEO Debugging HTML Debugging Clearless Library 3L Library |