Learn the fundamentals of Sass, BEM (Block-Element-Modifier), and responsive design principles in this comprehensive 3-hour 45-minute course for beginners. Explore Sass basics, compilation using VS Code extensions, partials, variables, and CSS custom properties. Build a demo responsive website while implementing Sass and BEM methodologies. Master mobile and desktop layouts, width settings, mixins, responsive typography, and Sass functions. Understand the benefits of using em units in media queries, proper nesting techniques with BEM, and the creation of helper/utility classes. Gain practical skills to enhance your web development toolkit and create more efficient, maintainable, and responsive websites.
Overview
Syllabus
- Intro.
- What is Sass?.
- Compiling Sass with VS Code extensions.
- Sass partials.
- Sass variables and CSS custom properties.
- Building the demo responsive website.
- Sass and BEM.
- Building the responsive mobile layout.
- Building the desktop layout.
- Setting widths.
- Sass mixins.
- Responsive typography.
- Sass functions.
- Why I use em units in media queries.
- Nesting and BEM.
- Helper/Utility classes.
Taught by
Coder Coder
