5 ms·

In the article you say you "Reuse through React instead of CSS" and that you have CSS files for the components and no global CSS classes. Do you mean that the

In the article you say you "Reuse through React instead of CSS" and that you have CSS files for the components and no global CSS classes. Do you mean that the CSS files are applied to the elements as inline styles by react, or just that each component has its own CSS so it's not really "global"?

lopatin 11y ago
The latter. Most of our components have an associated scss file. I didn't consider those to be global because we namespace all css rules in the style files under a class name of the same name as the component. But that's a great point, it didn't occur to me that that paragraph may have only made sense to people familiar with our conventions.
- nodejsisbest 11y ago
  This is a, well, dick off account but behind it is really a genuine developer. I recently converted my React code from scss to the embedded styles in JavaScript. Does each component have that many scss styles to justify using scss? I guess my project isn't such a large scale, but I'm just curious as to what benefit you get from scss. Note that I didn't read the article. I rarely do, but I'll give this one a go because well, I'm commenting on the gosh darn thing so I may as well stop being a fucktard and read the damn thing! EDIT: Well, you only mention scss once in the entire article. I guess I didn't learn much on why you use it vs. just using the embedded styles for components in React.
- rattray 11y ago
  Interesting. Asking out of curiosity, not skepticism: why not use react styles in js directly, à la vjeux et al? Reasons I'd guess: not being able to use pseudo-selectors and things like :hover; familiarity for designers; easier use of legacy code; benefits of SCSS that would take work to re-implement in js. But I'm curious what your real reasons were!
  - lopatin 11y ago
    That's pretty much it! Although the ideas presented here do make sense (https://speakerdeck.com/vjeux/react-css-in-js https://speakerdeck.com/vjeux/react-css-in-js) we haven't gotten there yet. Our css namespacing scheme solves the "global namespace" issue, which was the biggest issue that stood out for us.
    - nulltype 11y ago
      I like the vjeux thing, I think for dynamic sites if we replace static html and css with javascript the world will be a better place.

lopatin 11y ago

The latter. Most of our components have an associated scss file. I didn't consider those to be global because we namespace all css rules in the style files under a class name of the same name as the component. But that's a great point, it didn't occur to me that that paragraph may have only made sense to people familiar with our conventions.

nodejsisbest 11y ago
This is a, well, dick off account but behind it is really a genuine developer. I recently converted my React code from scss to the embedded styles in JavaScript. Does each component have that many scss styles to justify using scss? I guess my project isn't such a large scale, but I'm just curious as to what benefit you get from scss. Note that I didn't read the article. I rarely do, but I'll give this one a go because well, I'm commenting on the gosh darn thing so I may as well stop being a fucktard and read the damn thing! EDIT: Well, you only mention scss once in the entire article. I guess I didn't learn much on why you use it vs. just using the embedded styles for components in React.
rattray 11y ago
Interesting. Asking out of curiosity, not skepticism: why not use react styles in js directly, à la vjeux et al? Reasons I'd guess: not being able to use pseudo-selectors and things like :hover; familiarity for designers; easier use of legacy code; benefits of SCSS that would take work to re-implement in js. But I'm curious what your real reasons were!
- lopatin 11y ago
  That's pretty much it! Although the ideas presented here do make sense (https://speakerdeck.com/vjeux/react-css-in-js https://speakerdeck.com/vjeux/react-css-in-js) we haven't gotten there yet. Our css namespacing scheme solves the "global namespace" issue, which was the biggest issue that stood out for us.
  - nulltype 11y ago
    I like the vjeux thing, I think for dynamic sites if we replace static html and css with javascript the world will be a better place.