Right, so it’s all about reusability-
Basically, find repeating/ duplicate code and turn it into an object of the same class.
The alternative is to just write out brand new code as it comes up, without any concern for duplication.
From personal experience, writing one-off variables turns into a dumpster fire quickly.
Planning out what classes you’ll need does take more time, upfront.
But in the long run, much time is saved by having reusable functions / a pattern to build on.
It’s also about organizing code with the target object as the subject of action.
There is “object oriented css”, which tries to find generic html patterns, and then class names are based on styles, instead of targeting elements ad hoc.
For example, “.blue-picture-top-of-page” would be pretty specific, but imagine the same element instead uses classes:
“.blue-background .center-image” , or something like that….
One is extremely specific and has little reusability. But the other has a combination of generic classes, styled from the perspective of the element itself
Latest Answers