I find utility classes good for developer experience. All I have to do is declare my utility classes and look at the output in my browser. Not to mention it provides speed. I really can get things done faster.
The only thing that I am yet to experience is the readability and maintainability concerns which I have outlined in the post as well. But only for complex setups where readability will be effecting the maintainability in a negative way.
it is so important to have a flex class that does nothing but a display: flex
I think it makes sense when you embrace utility classes. Sure, when you take this one piece out of the equation, it might seem odd. But as I mentioned in my blog post, a good thing about Tailwind CSS is that you are still thinking in CSS. So apart from being a slightly shorter version (without which the utility class declarations in your html will be longer, mind you), it makes it readable and make me think in CSS.
For example, if I am to center an element horizontally and vertically with flex, my html class will be div class="flex place-content-center". If you remove flex here, it's not very readable.
Also, a question right back at you would be why not? It's still readable and shorter. How is it doing anything bad? :)
if you then have to customize?
If you need to customise the utility classes, you are not fighting the framework like you would with Bootstrap, bulma and other component based frameworks. Where you will start writing CSS separately with or without SaSS/Less.
With utility classes in Tailwind CSS, you are declaring new values and you are using that as a whole new set of values. And you are not changing flex but rather the values of utility classes like padding values for p-0, p-1, p-2 etc or the values like w-0, w-1 which are for width.
first of all, I love your answer 😁 thanks for your super in-depth opinion. It is what I was looking for, a detailed opinion on the use or not of the frameworks.
"" Also, a question right back at you would be why not? ""
The truth is that I almost completely agree. If you need to go fast in development I love Tailwind because the utility classes allow me to maintain the readability of the code as you say and start from a ready base and display my project in short time.
When I have more time available I prefer to create my own mixins or utility classes in sass so as to keep the readability even more because I know perfectly what I wrote and it is tailored for that site.
When I have more time available I prefer to create my own mixins or utility classes in sass so as to keep the readability even more because I know perfectly what I wrote and it is tailored for that site.
I can understand that. I also have been thinking about my own utility classes with readability in mind using SaSS. Maybe not a component based setup but combining a couple of those utility classes of Tailwind CSS to one for my specific needs. Just haven't had the time recently.
unfortunately the time factor is always recurring in our work
Tell me about it! :D
I will definitely write about it if I do it. I am currently trying to move towards Neovim and Nix package manager for dev stuff. And it is definitely taking priority whenever I get free time! :D
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
nice post! I quote two parts:
"Tailwind CSS is a utility-first CSS framework."
which is why it's my favorite framework 😁
but also:
"Utility classes like flex for display: flex ;, p-2 for padding: 0.5rem; are just examples of utility classes provided by Tailwind CSS."
utility classes are really that useful?
it is so important to have a flex class that does nothing but a display: flex if you then have to customize?
I find utility classes good for developer experience. All I have to do is declare my utility classes and look at the output in my browser. Not to mention it provides speed. I really can get things done faster.
The only thing that I am yet to experience is the readability and maintainability concerns which I have outlined in the post as well. But only for complex setups where readability will be effecting the maintainability in a negative way.
I think it makes sense when you embrace utility classes. Sure, when you take this one piece out of the equation, it might seem odd. But as I mentioned in my blog post, a good thing about Tailwind CSS is that you are still thinking in CSS. So apart from being a slightly shorter version (without which the utility class declarations in your html will be longer, mind you), it makes it readable and make me think in CSS.
For example, if I am to center an element horizontally and vertically with
flex, my html class will bediv class="flex place-content-center". If you removeflexhere, it's not very readable.Also, a question right back at you would be why not? It's still readable and shorter. How is it doing anything bad? :)
If you need to customise the utility classes, you are not fighting the framework like you would with Bootstrap, bulma and other component based frameworks. Where you will start writing CSS separately with or without SaSS/Less.
With utility classes in Tailwind CSS, you are declaring new values and you are using that as a whole new set of values. And you are not changing
flexbut rather the values of utility classes like padding values forp-0,p-1,p-2etc or the values likew-0,w-1which are for width.Hope I answered your question. :)
first of all, I love your answer 😁 thanks for your super in-depth opinion. It is what I was looking for, a detailed opinion on the use or not of the frameworks.
"" Also, a question right back at you would be why not? ""
The truth is that I almost completely agree. If you need to go fast in development I love Tailwind because the utility classes allow me to maintain the readability of the code as you say and start from a ready base and display my project in short time.
When I have more time available I prefer to create my own mixins or utility classes in sass so as to keep the readability even more because I know perfectly what I wrote and it is tailored for that site.
I can understand that. I also have been thinking about my own utility classes with readability in mind using SaSS. Maybe not a component based setup but combining a couple of those utility classes of Tailwind CSS to one for my specific needs. Just haven't had the time recently.
unfortunately the time factor is always recurring in our work, but if you do, let me know how you organized it that now I'm curious 😁
Tell me about it! :D
I will definitely write about it if I do it. I am currently trying to move towards Neovim and Nix package manager for dev stuff. And it is definitely taking priority whenever I get free time! :D