Decided to support the Tailwind CSS team today any purchased a license for their UI kit. (The underlying css is open source but they sell licenses to access ready made components and layouts to speed up dev time)
Now obviously this isn’t production ready but managed to make a simple login system with a basic dashboard. I just prefer the UI so much more than bootstrap.
Screen Recording 2021-02-10 at 21.37.31
Buyer beware, most native Wappler components will not work, you will spend the majority of time in code view and this isn’t for beginners.
Will be exploring more in the next few weeks. Was simple to install via npm.
Ideally I’d like to be installing this as a PostCSS plugin but I haven’t had chance to explore that route yet.
Tailwind is pretty awesome if you need more customization than a Bootstrap primary button. It’s also super fast to code up good looking pages because you’re just attaching utility classes on the fly and rarely have to look at CSS anymore. Bonus points for not having to remember any class names.
That being said, I’m not sure how it would fit within the Wappler model and for larger projects. It just feels like inline style all over again and your HTML starts to get bloated really fast
If you are ok with having everything on your HTML and changing all the py-3 text-gray-300 across all your files down the line (maybe @apply makes it easier), then you’ll like it. The way I see it is Tailwind makes you fast the beginning by giving you a head start and a convention, but it slows you down when your project becomes substantial.
Personal take: if you are an agency/freelancer pumping out websites daily, I recommend it. If you are working on a component-based architecture for the longer term, it’s not suitable. I actually removed Tailwind from a large project when I moved to more structured React components and never looked back. But I guess it makes Tailwind a good name
Ya I too don’t really like the fact that the html is littered with class names. The default configuration compressed down is only 72kB and also love the purge feature too. Should be interesting to see if Wappler supports webpack natively and then Tailwind would fit in nicely.
It’s a shame but it’ll be a while before Wappler integrated other front-end frameworks.
I also like tailwind and as you know I have the FR open. But if you have a thorough think about it what is the added benefit for Wappler? I can clearly see the benefit for those of us that are in the code view the great majority of the time.
But for those who use the UI 100% of the time Wappler already abstracts them from having to remember classes. Therefore using utility classes or not is not a matter they care about.
From a design perspective there is no difference between what bootstrap and tailwind can generate. All in all it's just CSS and the final design depends on the designer.
The library is not as bloated that is true, but there are tools out there to strip out unneeded css from it like purgecss, drops or uncss. Additionally now that Bootstrap 5 has ditched jquery I'm assuming the bundle size also got reduced.
All in all, would there be much of a difference between tailwind and bootstrap 5+purgeCSS in a Wappler context?
But great that you are supporting them. Things look good on their side:
We're also about to cross $2 million in revenue from Tailwind UI, our first commercial Tailwind CSS product which was released about 5 months ago — a bit under two years after the very first Tailwind CSS release.
They mentioned that with App Connect extensibility feature it would be possible. I don't think they will integrate any other frameworks besides bootstrap. Known waters for them.
I guess they will leave other options for us to develop through extensions.
