CSS Modules in 30 seconds

Updated on Jan 15, 2018

CSS Modules allows us to write CSS rules that are restricted to a certain part of the UI. It is not an official specification or browser implementation, but rather a process enabled by a build tool like Webpack. In contrast to a regular CSS selector, which can match any element, a CSS Modules selector can only match elements in a specific part of the UI (e.g. in a specific React Component). Build tools accomplish this by transforming the selectors we write into new, globally unique selectors and then applying the new selector to the associated UI element.

Did you find this post useful? Show some love!
Classic DEV Post from Jun 26

Books vs Online Courses

Which the two learning methods is better for learning a new programming language?

Follow @kostassar to see more of their posts in your feed.
dev.to is now open source!
View Announcement Post View GitHub Repo
Ross Creighton
Member since Jan 18, 2017
More from @ross
CSS Flexbox in 30 seconds
#css #inthirtyseconds
ReduxJS in 30 seconds
#javascript #redux #react #inthirtyseconds
Trending on dev.to
How does the web look if everyone owned their own data?
Explain Hashing + salting Like I'm Five
#explainlikeimfive #webdev
What's the deal with downing PHP development?
What part of your first dev job were you least prepared for?
#discuss #career
How to Build Your Own Html editor⁉
#html #javascript #css #beginners
Explaining CSS Blending by Example
#html #css #video
15 CSS Relative units, how many do you know? em, rem, ex, cap, ch, ic...
#webdev #css #html #responsive
Sublime Text 3 Kurulumu
#sublimetext3 #texteditor #css