Blog
Mert Özen's blog posts on software development, backend, frontend, and DevOps.
Style Architecture in Large Projects: the 7-1 Pattern, BEM, ITCSS and Layered CSS with Cascade Layers
Split a large style code base into CSS-free abstracts and folders that produce CSS, keep names flat with BEM, and move ITCSS's general-to-specific order into the browser with @layer; in Sass, layers are built with meta.load-css(), not @use. We turn Bookstore's style tree into 7-1, put vendor CSS into a layer, and measure how Angular component styles, being unlayered, beat even the longest layered selector.
Sass Basics: Variables, Nesting, the Parent Selector (&), Interpolation and Placeholders
A Sass variable is a build-time value that disappears after compilation, while a custom property lives at runtime, so when combining them you must pass the value through #{}, or the browser receives the text "$brand". We rewrite Bookstore's card with & and BEM, measure in two engines how Sass nesting produces different specificity from native nesting, and show how deep nesting bloats the output.