4 ms·

I don't really get Tailwind. Whenever I am looking at a layout, I am doing it in the inspector tools, not in the stylesheet or the html file. I don't care if th

I don't really get Tailwind. Whenever I am looking at a layout, I am doing it in the inspector tools, not in the stylesheet or the html file. I don't care if the class is called top_bar or foo_bar or if the styling is done inline. I do care that is had a border-radius of 10px,. With tailwind I have to somehow know that border-radius is supposed to be "rounded". I have to learn a whole new language and constantly translate back and forth. A lot of people seem to like tailwind though so I am probably missing something.

robacarp 4y ago
> I have to somehow know that border-radius is supposed to be "rounded". Yeah I agree with you there. If you're writing tailwind you have to constantly have the tailwind docs site open.
- danielvaughn 4y ago
  There's a tailwind intellisense plugin. Just type something into a class string and a bunch of suggestions pop up. Makes it incredibly easy - I learned nearly all of Tailwind in like 2 hours this way.
snarkyturtle 4y ago
Except you should be learning a "language" anyway because that's what building a product is about. To use your "rounded" thing as an example: Design systems should have their own definitions of what a "rounded" thing is. The designs also probably have different types of border-radius based on if it's a container element, or a button, or a pill button, etc. So you define those as different types of "rounded". Small, medium, large. Round, rounder, roundest. They could be whatever you want. This way, your team doesn't have to remember that 10px = round, designers or PMs just say "round" and you use the "round" utility class. Or if they don't like styling they can say "hmm what about 'rounder'?" and you use the rounder class. That's what Tailwind aims to solve is to 1) define a common language across the team and 2) make that easily available for the FE dev to implement versus trying to cross-reference what "round" is.

robacarp 4y ago

> I have to somehow know that border-radius is supposed to be "rounded". Yeah I agree with you there. If you're writing tailwind you have to constantly have the tailwind docs site open.

danielvaughn 4y ago
There's a tailwind intellisense plugin. Just type something into a class string and a bunch of suggestions pop up. Makes it incredibly easy - I learned nearly all of Tailwind in like 2 hours this way.

snarkyturtle 4y ago

Except you should be learning a "language" anyway because that's what building a product is about. To use your "rounded" thing as an example: Design systems should have their own definitions of what a "rounded" thing is. The designs also probably have different types of border-radius based on if it's a container element, or a button, or a pill button, etc. So you define those as different types of "rounded". Small, medium, large. Round, rounder, roundest. They could be whatever you want. This way, your team doesn't have to remember that 10px = round, designers or PMs just say "round" and you use the "round" utility class. Or if they don't like styling they can say "hmm what about 'rounder'?" and you use the rounder class. That's what Tailwind aims to solve is to 1) define a common language across the team and 2) make that easily available for the FE dev to implement versus trying to cross-reference what "round" is.