geelen commented 9 years ago

CSS Modules: turning extension into composition

Type of Presentation

[ x ] Standard Length Talk [ ] Lightning Talk [ ] Workshop [ ] Moderated Discussion

Description

Sass' @extend function is one of the most powerful, surprising, controversial & subtle parts of the language. We've all seen blog posts about "what you didn't know about @extend", "why @extend is so powerful", "why you shouldn't use @extend" — seemingly every possible viewpoint has someone intelligent arguing for it. It's a confusing state of affairs, yet clearly the intent of @extend is really useful — define all your styles for a component one place, but avoid duplicating output as much as possible.

Meanwhile, our relationship to markup is changing dramatically. The rise of React brings with it a new rendering model and a whole host of new techniques for writing applications, but the new ideas around styling seem extremely limited, a long way off being ready to use day-to-day.

In my talk, I'm going to explore what happens when you put these seemingly disparate technologies together, and how that's risen to a new potential standard in CSS Modules. In particular, I will:

deconstruct @extend, showing how the algorithm works, and that it's the constraints of the language that cause the problems, not the idea itself
show some of the shortcomings of JS-based styling approaches, and the useful ideas they hint at
explain how the transition from static to dynamic markup marks a profound shift in our capabilities
tell the story of CSS Modules, from my custom Sass @extend-based DSL to a team of 6 (including the authors of Webpack & JSPM) dreaming of a future CSS specification
how you can use CSS Modules with Sass today, even if you're not using React
Speaker Info
Name : Glen Maddern
Location : Melbourne, Australia
Contact : glenmaddern@gmail.com
More Info

Social Media:
Twitter : @glenmaddern
GitHub : geelen
Url(s) : glenmaddern.com
Bio:

Glen Maddern is an independent web developer from Melbourne, Australia, with a background in mathematical simulations and distributed computing. Since 2009, he’s been working exclusively on the web and most recently, almost entirely on the front-end. He believes there’s never been a more potent target for ideas than the browser and the web, and loves the incredible pace at which new ideas are emerging, and the new ways ideas can be demonstrated, shared and built upon. He helps to run CSSConf AU, tied for greatest conference in the world with SassConf.

Photo:

Avatar

kennethormandy commented 9 years ago

Love that this is framed around @extends! I have definitely been cautious about diving into React and PostCSS too early, and I think @geelen would do a great job of making the case for them to people like me.