Рет қаралды 233,593
🔥 My course: Responsive Design for Beginners! coder-coder.com/responsive/
💻 Become a full-stack web dev with Zero to Mastery: academy.zerotomastery.io/a/af...
In this video I'll walk you through the basics of Sass, BEM (block-element-modifier), and the principles of responsive design. This is a standalone course in Sass that's taken from my full course, Responsive Design for Beginners.
0:00 - Intro
0:22 - What is Sass?
1:17 - Compiling Sass with VS Code extensions
12:49 - Sass partials
26:17 - Sass variables and CSS custom properties
43:45 - Building the demo responsive website
50:00 - Sass and BEM
57:08 - Building the responsive mobile layout
1:04:30 - Building the desktop layout
1:18:10 - Setting widths
1:36:08 - Sass mixins
2:06:35 - Responsive typography
2:33:24 - Sass functions
3:03:39 - Why I use em units in media queries
3:10:49 - Nesting and BEM
3:35:23 - Helper/Utility classes
Source files: github.com/thecodercoder/sass...
____________________________
SUPPORT THE CHANNEL
⭐ Join channel members and get perks: / @thecodercoder
👏🏽 Hit the THANKS button in any video!
🎨 Get my VS Code theme: marketplace.visualstudio.com/...
WANT TO LEARN WEB DEV?
Check out my courses:
🌟 Responsive Design for Beginners: coder-coder.com/responsive/
🌟 Gulp for Beginners: coder-coder.com/gulp-course/
RECOMMENDATIONS
⌨ My keyboard, Vissles V84 -- vissles.com/?ref=mu96kxst5w -- 🔥 get 10% off with code THECODERCODER --
💻 Other gear -- www.amazon.com/shop/thecoderc...
📚 My Favorite Books -- coder-coder.com/best-web-deve...
📺 My Favorite Courses -- coder-coder.com/best-web-deve...
🔽 FOLLOW CODER CODER
Blog -- coder-coder.com/
Twitter -- / thecodercoder
Instagram -- / thecodercoder
#webdevelopment #coding #programming