beeon.academy
frontendBeginner

Sass / Less

42 lessons · Variables, nesting, modules, mixins, tooling, architecture

SassLessDart SassCSSViteStylelint
Duration
5 weeks
Starts
Students
0+
Rating
0 / 5
Starting from
49 000 ֏
Enrolling now
  • 5 weeks (24h total)
  • Starts
  • online format
  • HY · EN · RU
  • Certificate on completion

No payment required to register · We’ll contact you within 24h

What this course is about

Overview

42 lessons · Variables, nesting, modules, mixins, tooling, architecture

Across 5 weeks (24 hours of live + project work) you’ll move from fundamentals to shipping a real, production-grade project — guided by Tigran Hakobyan and the beeon.academy mentor team.

Learning outcomes

What you will learn

Write shallow nesting with named tokens
Use @use/@forward and mixins without dumping grounds
Read and write Less enough to maintain legacy stacks
Wire Sass/Less in Vite with Stylelint and source maps
Interactive course

Lessons

42 lessons · all open, start with any
  1. 1CSS that scales past copy-paste24 min
  2. 2Sass and Less: cousins, not clones26 min
  3. 3Dart Sass is the current Sass story24 min
  4. 4When plain CSS + custom properties win22 min
  5. 5Source → compile → CSS the browser sees24 min
  6. 6Course map: Sass core → Less → tooling → architecture20 min
  7. 7Nesting that stays readable26 min
  8. 8& parent selector with intent24 min
  9. 9Sass variables vs CSS custom properties26 min
  10. 10_partials and the old @import habit26 min
  11. 11@use and @forward as the module system28 min
  12. 12Maps and lists for design tokens24 min
  13. 13Interpolation when selectors need construction22 min
  14. 14Workshop: button with tokens + nesting28 min
  15. 15Mixins for repeated declaration blocks28 min
  16. 16@content blocks inside mixins24 min
  17. 17Functions that return values, not CSS26 min
  18. 18Built-in color and math helpers24 min
  19. 19@extend with eyes open24 min
  20. 20Workshop: fluid-type mixin + token function28 min
  21. 21When Less still shows up at work24 min
  22. 22Less variables and lazy evaluation26 min
  23. 23Less nesting and & the same idea24 min
  24. 24Less mixins and parametric guards26 min
  25. 25Less @import and (reference)24 min
  26. 26Less operations and escaping quirks22 min
  27. 27Workshop: Less theme variables + button mixin28 min
  28. 28Side-by-side: same UI in Sass and Less26 min
  29. 29Migrating Less → Sass without a big-bang rewrite24 min
  30. 30What modern CSS already stole from preprocessors24 min
  31. 31Choosing Sass, Less, or CSS for a new project22 min
  32. 32Sass/Less in Vite without drama26 min
  33. 33CLI watch for non-bundler workflows22 min
  34. 34Source maps that make DevTools honest22 min
  35. 35Stylelint for Sass/Less teams24 min
  36. 36Workshop: Vite scss entry + shared partial26 min
  37. 37Folder architecture that stays boring26 min
  38. 38BEM-friendly nesting without selector soup24 min
  39. 39Compile and selector performance habits22 min
  40. 40Theming: Sass maps + CSS variables together24 min
  41. 41Playbook: tiny design system sheet from zero28 min
  42. 42Practice loop for next week20 min
Course modules

Syllabus

  1. 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    What you need to start

    Requirements

    • Comfortable with CSS selectors and the box model
    • Node.js helpful for Vite labs
    • No prior Sass/Less experience required
    Learn from a working engineer

    Your instructor

    TH

    Tigran Hakobyan

    Frontend Mentor · beeon.academy

    Instructor at beeon.academy. Sass/Less path (ArT): 42 lessons through tokens and compile habits.

    What graduates say

    Student reviews

    Common questions

    FAQ

    Starting from
    49 000 ֏
    Register