I’ve been developing websites and web applications with the help of Bootstrap for so long until I found Tailwind CSS as an alternative.
This article is just my opinion about the difference between both top-notch CSS frameworks.
Focus on your template files
Tailwind CSS allows you to focus more on your programming logic on your template files without getting annoyed with styling.
This does not mean that you won’t need your custom CSS code at all. Like Bootstrap, most of every style logic is in the HTML file.
Never ship with the code you don’t need again
Unlike Bootstrap, Tailwind CSS provides the capability of shipping only codes used in the template files with the help of the node module. However, if you include the Tailwind CSS CDN link in your HTML template file, then it’s worst than including the Boostrap CDN since its size is way more than 20MB.
What are the downsides?
Writing multiple class names in your HTML makes your code look messy.
As new to Tailwind CSS, I found myself writing redundant codes and my HTML files looked totally like a mess.
Furthermore, its documentation contains tons of class names which I found difficult to remember and take too much time to learn. If anybody has a trick to remember it faster, why not let me know in the comment below?
Last but not least, I think Tailwind CSS should add more important components to reduce the dense of class names needed in the HTML page in order to create common components.
Alright, if you have other tips, let us know in the comment blow.