by anorborg on 10/19/17, 8:02 PM with 101 comments
by andygcook on 10/19/17, 9:35 PM
by myf01d on 10/19/17, 9:29 PM
by czep on 10/20/17, 12:41 AM
However, just as frameworks like angular and libraries like react are "componentizing" the front end and replacing general purpose utilities like jQuery, will we see a similar trend with modular css where component styles will replace the need for large css frameworks like bootstrap? Or is modular css merely a complement to whatever sitewide css framework you've chosen?
by neovive on 10/19/17, 11:58 PM
by mmcnl on 10/19/17, 9:22 PM
by yourkin on 10/19/17, 9:35 PM
by desireco42 on 10/19/17, 9:34 PM
by lewisl9029 on 10/19/17, 11:48 PM
My favorite part of Bootstrap 4 is actually its newly included CSS reset Reboot [0]. It's built on Normalize, but also provides a set of very compelling improvements like making use of the native font stack, a bunch of very sensible spacing and layout adjustments, and built-in optimizations for touch responsiveness (removing the 300ms delay). I'm definitely going to be trying it out on my next project regardless of whether or not it uses Bootstrap itself.
With that said, I don't mean to rain on the parade, but I've been gradually deviating away from using CSS frameworks for my projects, not because I don't _want_ to use them, but rather because most CSS frameworks don't seem to mix naturally with component-oriented CSS-in-JS libraries like glamorous [1], which is my preferred way to work with styling these days.
If I do include a CSS framework, I end up having to use a mix of custom component-scoped styles and global CSS classes from these frameworks, and those CSS classes may have margins and cascading effects that reach into children. This breaks component-level style isolation, and makes the styling of children much harder to reason about, which defeats much of the purpose of using component-oriented CSS to begin with.
What I really want to do is to import styles from a well designed CSS framework _as a JS module_ (but I'm willing to accept anything that's properly namespaced and isolated, like CSS Modules), and compose them with my own styles without worrying about a polluted global namespace or styles from parents reaching into children/vice versa or fighting with specificity issues.
So far, I haven't found any CSS frameworks that fit the bill, but Tachyons [2] seems like it could be close enough (by emphasizing modular, low specificity, shallowly cascading styles) that I could maybe just run it through a CSS to JS compiler like native-css [3] and import its classes and compose them as I would with any other JS style object. This is something I'm going to experiment with soon enough, but I'd love to hear if others have any thoughts/experiences they'd like to share on using CSS frameworks with component-oriented CSS.
by Scarbutt on 10/19/17, 11:53 PM
by manigandham on 10/19/17, 11:38 PM
Bootstrap has a nice grid system (although the actual CSS standard is amazing now) and handles basic elements like buttons well. For everything else, Tachyon's component helpers make layouts really easy and fast.
by azr79 on 10/20/17, 6:34 AM