If you’re not a fan of writing manual css then Tailwindcss can save you a lot of time.
And it’s beautiful. 👌
For further actions, you may consider blocking this person and/or reporting abuse
If you’re not a fan of writing manual css then Tailwindcss can save you a lot of time.
And it’s beautiful. 👌
For further actions, you may consider blocking this person and/or reporting abuse
Top comments (36)
I've become a big fan
Help me understand.
If someone doesn't want to write pure CSS, why would they use Tailwind CSS?
Why don't they just use a no-code tool like Webflow to build a complex website?
Because I feel like Tailwind CSS helps you work 10% faster, but it reduces your flexibility with maybe 60%.
But using some complex no-code website builder helps you work 90% faster, while reducing your flexibility with 60%.
And yes, I know writing code feels cool, we all like to feel like hackers, typing away in our dark terminals.
I'm just trying to understand from a productivity point of view.
I’ve started using WebFlow for my freelance clients and it’s been a nightmare. I’ve used other similar tools such as WordPress and Drupal and in my experience those tools lower both my flexibility and productivity. Also if I need something a bit more complex I’m going to have to end up writing PHP or JS code anyways which takes even more time.
For me personally I use Tailwind more for the responsive styles so I save time by not having to write tons of media queries. I can also configure Tailwind to my liking which adds to its flexibility.
At first, I hated Tailwind CSS but over time fell in love with it! I use it in all my projects now.
Your boilerplaty verbose templates disagree 😅
I have a different take this Kausik 🤔. I have used Tailwindcss, CSS3, MaterialUi, Bootstrap, Bulma and Storybook. Even I have tried the preprocessors of CSS like SASS/SCSS.
Let me share what I learned after so many projects 🤫. These frameworks and preprocessors are always useful when it comes to building any high end component like autocomplete dropdown or a calender. But if you use it on normal components, then don't use it.
It's just not worth it, it would always be overkilling a simple thing and very bad in terms of optimizations. So, if you are a good developer, then you will always know when you are overkilling a simple thing and when you are doing it in the easy way ✌.
Then maybe you should take a try.
A class is a common set of property-value pairs that will be applied to every HTML tag with this class name inside it's class attribute whereas components define visual chunks of your views semantically.
A button will always be a button, right?
Using classes you usually end up with something like:
The btn class would be the basic styling for your buttons, btn-rounded would be a modifier and btn-warning would be a font/color definition.
(Of course you can use "btn rounded warning" but the intellisense will be angry).
Example with styled-components:
You can programatically or conditionally set values into it, even using states, and the Button component will host every possible definition so it's scoped in a single place.
Anytime you need to extend the button component you simply head yourself to the Button component file and that's all.
You can also import base templating configuration set on a JS const/variable, including breakpoint related things for those media queries and so on (break point naming related with pixel range, max-container width, item gap...)
... but then you learn CSS.
I saw other comments and I'd say this
I better write inline css then using tailwind.
BTW, i was one of those who used to use tailwind when it first came out few years ago. So ye don't think I'm saying it all just because i wanted to or by influencing from internet. It's how i genuinely feel
Thats bullshit. You can do it always wrong with ever tool.
Compare these
vs
So tell me, what is better to understand and what is faster?
Obviously the second one, or not?
That sounds like styled-components but with extra-steps.
A component should be as small as the minimum solution they need to provide, not more, not less.
The styles of the component should not, in any case, define how the component should be fragmented.
Even that, it does not make a template chunk les verbose when using Tailwind. It can be a verbose chunk among other verbose chunks or as stand-alone verbose chunk, with the HTML full o' class names like we're back at 1999 using inline styles. It is what it is, though you can like it or not.