Uploaded May 2017 | Updated September 2026, 2 minutes ago
Thank you to Mozilla for making video recording possible.
Creating a maintainable CSS architecture has always been a challenge. Many tools aim to enhance CSS and extend the language to overcome this challenge, but CSS Modules takes a different tack. While it does make a few additions to the language, more significant is what it takes away. And this is something that many people don't realise at first: CSS Modules actually makes certain things harder!
Many newcomers to CSS Modules have run into frustration because the strategies they previously relied on now seem unnecessarily complicated. This is no accident; CSS Modules comes with some opinions about CSS and we can learn a lot of useful patterns by following the cowpath it paves.
We'll explore these patterns and think out their implications. I'll draw on what I've learned from creating and maintaining a large CSS Modules architecture over the last 12 months, running workshops and helping to address questions on github. We'll also look at some of the common frustrations people face when starting with CSS Modules and some practical examples of how to achieve the same result but in a more maintainable way.
My hope is to pass on the principles that will enable newcomers to get the most out of CSS Modules and to show that, while opinionated in some ways, what we get in exchange is a simple yet powerful tool that helps us to win at every stage of the project, from authoring to modifying, debugging and maintaining.
Thank you to Mozilla for making video recording possible.
Creating a maintainable CSS architecture has always been a challenge. Many tools aim to enhance CSS and extend the language to overcome this challenge, but CSS Modules takes a different tack. While it does make a few additions to the language, more significant is what it takes away. And this is something that many people don't realise at first: CSS Modules actually makes certain things harder!
Many newcomers to CSS Modules have run into frustration because the strategies they previously relied on now seem unnecessarily complicated. This is no accident; CSS Modules comes with some opinions about CSS and we can learn a lot of useful patterns by following the cowpath it paves.
We'll explore these patterns and think out their implications. I'll draw on what I've learned from creating and maintaining a large CSS Modules architecture over the last 12 months, running workshops and helping to address questions on github. We'll also look at some of the common frustrations people face when starting with CSS Modules and some practical examples of how to achieve the same result but in a more maintainable way.
My hope is to pass on the principles that will enable newcomers to get the most out of CSS Modules and to show that, while opinionated in some ways, what we get in exchange is a simple yet powerful tool that helps us to win at every stage of the project, from authoring to modifying, debugging and maintaining.
