5 ms·

How does Tailwind require bouncing between multiple files? Everything is in the HTML in the form of class names. Yes, you will have to know what the classes do

How does Tailwind require bouncing between multiple files? Everything is in the HTML in the form of class names. Yes, you will have to know what the classes do, but where that isn't already intuitive it's just a one-off lookup, and then you know. HTML + CSS can simply not be parsed without hoping between multiple files. Unless you inline all of your CSS, of course.

eajakobsen 4y ago
I think the point in the comment you are replying to is that they _prefer_ having markup and styles in separate files.
- solumunus 4y ago
  You can still do that though. I swear half the Tailwind haters haven't used it for more than 30 minutes, or at all.
  - xigoi 4y ago
    Then what's the advantage of Tailwind?
    - solumunus 4y ago
      Standardised and clean CSS syntax. The benefits in that context are debatable, a component based frontend architecture is where it absolutely shines. If you end up using it in that context you won't need to ask this question, it quickly becomes clear that it's the optimal path.
      - emmacharp 4y ago
        What can't pure CSS do here and that Tailwind does ? The CSS syntax is already clean and standardized if you use it properly and don't name every little piece of interface. It is a genuine question, by the way...
      - xigoi 4y ago
        CSS is standardized…
- nailer 4y ago
  No, I have HTML and CSS in the same component file. I prefer having styling in one place (the CSS inside the component file) rather than two (the HTML of the component and tailwinds’s own postcss files that implement the styles).
jasonjmcghee 4y ago
Fwiw styled and emotion both offer ways to have css in the same file as html/js
- nailer 4y ago
  Yep Svelte and Vue do too. It seems like not having CSS in their components is the actual problem many people are trying to make better.
nailer 4y ago
> How does Tailwind require bouncing between multiple files? You have styling split between the classes and the actual CSS tailwind implements, which every team I know that has used tailwind absolutely does have to look at.
- christophilus 4y ago
  It's a vocabulary you quickly get used to, and when paired with editor plugins, it's a non-issue in my experience.
  - diob 4y ago
    Yeah, and it's much better than trying to figure out what random class names some dev made up are doing.
    - nailer 4y ago
      I agree that ‘div soup’ is a problem - I’ve seen a lot of react code by new developers that resembles GWT generated DOMs. But ‘div soup’ has other problems too - way over complicated doms are hard to edit and debug - and the problem is better solved by learning CSS basics to avoid all the wrapper divs you see in React apps made by junior front end developers.
  - nailer 4y ago
    Most of the time I know the CSS already I have to convert it to tailwind - and devtools uses the same syntax so (as the article mentions) the abstraction leaks.

eajakobsen 4y ago

I think the point in the comment you are replying to is that they _prefer_ having markup and styles in separate files.

solumunus 4y ago
You can still do that though. I swear half the Tailwind haters haven't used it for more than 30 minutes, or at all.
- xigoi 4y ago
  Then what's the advantage of Tailwind?
  - solumunus 4y ago
    Standardised and clean CSS syntax. The benefits in that context are debatable, a component based frontend architecture is where it absolutely shines. If you end up using it in that context you won't need to ask this question, it quickly becomes clear that it's the optimal path.
    - emmacharp 4y ago
      What can't pure CSS do here and that Tailwind does ? The CSS syntax is already clean and standardized if you use it properly and don't name every little piece of interface. It is a genuine question, by the way...
    - xigoi 4y ago
      CSS is standardized…
nailer 4y ago
No, I have HTML and CSS in the same component file. I prefer having styling in one place (the CSS inside the component file) rather than two (the HTML of the component and tailwinds’s own postcss files that implement the styles).

jasonjmcghee 4y ago

Fwiw styled and emotion both offer ways to have css in the same file as html/js

nailer 4y ago
Yep Svelte and Vue do too. It seems like not having CSS in their components is the actual problem many people are trying to make better.

nailer 4y ago

> How does Tailwind require bouncing between multiple files? You have styling split between the classes and the actual CSS tailwind implements, which every team I know that has used tailwind absolutely does have to look at.

christophilus 4y ago
It's a vocabulary you quickly get used to, and when paired with editor plugins, it's a non-issue in my experience.
- diob 4y ago
  Yeah, and it's much better than trying to figure out what random class names some dev made up are doing.
  - nailer 4y ago
    I agree that ‘div soup’ is a problem - I’ve seen a lot of react code by new developers that resembles GWT generated DOMs. But ‘div soup’ has other problems too - way over complicated doms are hard to edit and debug - and the problem is better solved by learning CSS basics to avoid all the wrapper divs you see in React apps made by junior front end developers.
- nailer 4y ago
  Most of the time I know the CSS already I have to convert it to tailwind - and devtools uses the same syntax so (as the article mentions) the abstraction leaks.