Sass Training Class | Webucator Web Development Classes

Overview

In this 3-day Sass Training class, students will learn how to get started using Sass (Syntactically Awesome Style Sheets). Sass is a growing CSS extension language that is compatible with all versions of CSS. This course starts with a introduction of what Sass is along with a HTML and CSS background review. Then we dive right into getting students started using Sass.

CSS is not a prerequisite to this course. However, working with Sass is a more advanced way of using CSS with a website. Students looking to enhance their skills may want to consider our Introduction to CSS, Advanced CSS, or CSS3 for Web Developers courses after taking Sass.

This course is not yet available but will be in fall of 2016.

Goals

Learn to learn what Sass is and why to use it.
Learn to learn to work with preprocessors.
Learn to learn to install and configure Sass on either a PC or a Mac.
Learn to learn the Sass philosophy on code organization.
Learn to learn how comments work in Sass.
Learn to learn how to work with operations, control directives, and expressions.
Learn to learn about mixins, such as bourbon, and learn how to write your own.
Learn to understand when and how to use nesting.
Learn to learn how to write your own functions.
Learn to learn about extending and framework options.

Outline

Introduction/Why Sass?/What is Sass?
1. What Needs Fixing in CSS?
2. Preprocessors in General (Sass, Less)
3. Using Sass
HTML/CSS Background Review
1. Review of HTML/HTML5 Concepts
2. Review of CSS/CSS3 Concepts
Installing and Configuring Sass
1. Installing on Mac from the Command Line
2. Installing on Windows from the Command Line
3. GUI Installed Apps
4. Using NPM/grunt with Sass and the grunt-contrib-sass plugin
5. How to Run Sass from the Command Line
6. Setting a Watch
7. Output Styles (compressed etc.)
8. Sass vs. SCSS Syntax
Organizing and Including Sass Code
1. Partials: Including Sass Code
2. Code Organization
3. Dividing Code by Site Section
4. Dividing Code by Functional Areas
5. What to Include First
6. Working as a Team
Sass Comments and Variables
1. Comments in Sass
2. Defaults
3. Using Variables in Sass
4. Colors
5. Lengths
6. Sizes
7. &debug, &warn, &error
Operations in Sass
1. Numeric Operations
2. Color Operations
3. String Operations
4. Boolean Operations
5. List Operations
6. Using Parentheses
7. Interpolation in Sass
Control Directives and Expressions
1. if Statements
2. for Statements
3. each Statements
4. while Statements
Functions in Sass
1. Function and Calculations
2. Using built-in Functions
3. Writing Your Own Functions
Nesting
1. Avoiding Repetition with Nesting
2. When Not to Use Nesting and How Not to Nest too Much
3. Namespaced properties
4. Using the "and" Operator
Mixins
1. Intro to Mixins
2. Writing Your Own Mixins
3. Finding and Using Others' Mixins
4. Bourbon
Using &extend
1. &extend
2. Placeholder Selectors
3. More Complex Extending
4. The !optional Flag
5. &at-root
Sass and Frameworks
1. Using Sass with Frameworks
2. Using Sass with Bootstrap
Debugging and Best Practices
1. Tips on Writing Effective, Maintainable Sass Code
2. Avoiding Repetition
3. Sass Philosophy
4. Debugging Sass Code

Class Materials

Each student in our Live Online and our Onsite classes receives a comprehensive set of materials, including course notes and all the class examples.

Preparing for Class

Onsite: Course Setup
Live Online: Course Setup | WebEx Setup

Follow-on Courses

No cancelation for low enrollment

Certified Microsoft Partner

Registered Education Provider (R.E.P.)

GSA schedule pricing

72,346

Students who have taken Live Online Training

15,155

Organization who trust Webucator for their training needs

100%

Satisfaction guarantee and retake option

9.42

Students rated our trainers 9.42 out of 10 based on 5,232 reviews

Customized Onsite Training

Live Online Training