3 ms·

Haha I like “usually” part, very honest. I’m a backend engineer too and I learned most of this css stuff fairly easily in a few weeks without much pain. The tr

Haha I like “usually” part, very honest. I’m a backend engineer too and I learned most of this css stuff fairly easily in a few weeks without much pain. The truth is something like tailwind can get you to understanding 95% of css, just by digesting someone else’s editorialized model of it. You also sidestep a lot of issues with class-based nature of CSS, which just complicates the learning experience. I can copy/paste an extremely complicated layout that I made in tailwind to an entirely different section of html or the codebase, and 99% of the time it just works. Anyway I highly recommend to everyone who comes from a backend background to just learn something like tailwind. It’s basically css, just expedited and editorialized by professionals. When you run into gaps in the metaphor they’re easy to understand why they’re there, and you can easily add them yourself using their plugin system, which fit me just enhanced my own learning.

deleted 5y ago
[deleted]
e12e 5y ago
> You also sidestep a lot of issues with class-based nature of CSS, which just complicates the learning experience. I'm not sure I follow - tailwind is entirely class based, but fights hard against the "cascading" in cascading style sheets?
- asimpletune 5y ago
  Maybe I'm not using the right terminology - definitely not an expert - but I think Tailwind is "utility based". When I said side step issues with class-based natured of CSS, I meant there's really no way to leverage the cascading nature of CSS using tailwind. You don't even really write css in tailwind. Because of this you get code duplication, but your styling is super portable. This, I think, is the nature of using a utility based framework. You can literally copy and paste almost anything and it will probably work, because the specificity doesn't depend on any sort of class hierarchy or make any assumptions about the structure of your css classes. They're basically inline styles but use class names that are designed to be more useful than just writing css inline. Basically a light amount of editorialization. But like I said I don't really know, so if someone knows a better way to word what I'm trying to say please correct me. I think the tailwind creator said something like "the canonical way of writing 'modular' CSS just doesn't work" (I'm paraphrasing but something to this effect).
  - e12e 5y ago
    Sounds like we agree - you don't mean classes, you mean issues of cascading and specificity. See eg: https://alistapart.com/article/braces-to-pixels/ https://alistapart.com/article/braces-to-pixels/ for a brief overview / recap. The "other" options to utility/tailwind approach is to avoid classes, and use semantic html (easier in HTML5, where you can just decide you'll have an <article> with <lede> and <section>s) or heavily customized css classes (like bootstrap). Main difference between tailwind and bootstrap, is that bootstrap still assumes you'll have some container-elements that wrap other elements - while theoretically tailwind styles every element in isolation. (sort of)

deleted 5y ago

[deleted]

e12e 5y ago

> You also sidestep a lot of issues with class-based nature of CSS, which just complicates the learning experience. I'm not sure I follow - tailwind is entirely class based, but fights hard against the "cascading" in cascading style sheets?

asimpletune 5y ago
Maybe I'm not using the right terminology - definitely not an expert - but I think Tailwind is "utility based". When I said side step issues with class-based natured of CSS, I meant there's really no way to leverage the cascading nature of CSS using tailwind. You don't even really write css in tailwind. Because of this you get code duplication, but your styling is super portable. This, I think, is the nature of using a utility based framework. You can literally copy and paste almost anything and it will probably work, because the specificity doesn't depend on any sort of class hierarchy or make any assumptions about the structure of your css classes. They're basically inline styles but use class names that are designed to be more useful than just writing css inline. Basically a light amount of editorialization. But like I said I don't really know, so if someone knows a better way to word what I'm trying to say please correct me. I think the tailwind creator said something like "the canonical way of writing 'modular' CSS just doesn't work" (I'm paraphrasing but something to this effect).
- e12e 5y ago
  Sounds like we agree - you don't mean classes, you mean issues of cascading and specificity. See eg: https://alistapart.com/article/braces-to-pixels/ https://alistapart.com/article/braces-to-pixels/ for a brief overview / recap. The "other" options to utility/tailwind approach is to avoid classes, and use semantic html (easier in HTML5, where you can just decide you'll have an <article> with <lede> and <section>s) or heavily customized css classes (like bootstrap). Main difference between tailwind and bootstrap, is that bootstrap still assumes you'll have some container-elements that wrap other elements - while theoretically tailwind styles every element in isolation. (sort of)