New to WIP?
We're a group of makers shipping together. We help each other stay accountable and reach our goals.
Apply for accessBack
Question
Do you use / recommend flowbite?
I recently bought and finished reading Refactoring UI, the book by the Tailwind maintainers. I've now started using Tailwind for all my projects, and the question I have is if you also recommend Flowbite?
👋 Join WIP to participate
Yes, I like Flowbite a lot - I reference their website all the time when needing to build a new type of component in Tailwind, and they also have a javascript library you can install for some extra functionality. I usually just take the CSS as-is and code any JS myself since I don't want to add extra dependencies
Oki, so you don't install their package but you follow their guidelines? Sounds very sensible - probably what I'll do.
Yep, exactly.
+1 I prefer to cross reference both Buefy and Flowbite when creating my own base components
Might like www.shadcn-vue.com/
This was really cool. I don't use Vue but I do use Astro so might be worth using this to save me some time.
Getting the JS right is pretty difficult. How much testing are you doing for components?
It’s not so bad. I hook each component up to a Vue event handler (on click etc) and then make sure the component works across desktop and mobile. Chat gpt helps if I can’t figure something out.
Just to understand, are you talking about Flowbite JS snippets, or Tailwind? Or maybe both :)
Flowbite html snippets, but flowbite just gives you components written with tailwind. I take the raw html and hook up event handlers to that
Thank you for clarifying! Much appreciated.
Stuff like dropdown, accordions etc are hard to get right do you have a site with them to test?
Flowbite is great, if you need a little extra on top for http frameworks take a look at github.com/versoly/versoly-ui
It adds the missing pieces like btn-primary, btn-secondary that allow you to code without copy pasting all the time.
Ah, so we’re back to bootstrap haha
Interesting, I always disliked the Bootstrap design for some reason so don't think I'll go down that route.
Flowbite looks a lot like Bootstrap and was based on it. What am I missing?
Bootstrap core was solid and that is why it was heavily used.
The biggest disadvantage was easy customisation, Tailwind fixes that.
Right yeah, I’m just not understanding the point of bootstrap style utility classes if the underlying framework is tailwind. The point behind tailwind and why I find it compelling is to not hide functionality behind a “btn-large” class for example. I’d much rather have code duplication but be able to see exactly how the css will behave by looking at the tailwind classes directly in the html. Going back to bootstrap style classes kind of defeats the purpose for me
Additionally flowbite does not code components in the way you’re describing. It’s just a site that provides tailwind specific example code using the tailwind classes directly
Not sure I get it, you aren't going to duplicate "px-4 py-3" 100 times or you might forget then have to guess. You will create a component.
But what's the point when you can just define it once and not need that extra component.
Sure, whenever I keep repeating the same block I just extract it to a Vue component. At that point I don’t need another framework, the component itself works fine and can be reused
No need for another framework on top of that
We need a word for backend frameworks that render HTML.
If you're using Vue then sure.
Regarding Boostrap, I don't care how the code was organised or named.
Boostrap from a visual design point of view is ugly and not user friendly for the modern screens. Material UI fixed some of that, but there are much better options and standards now, such as Tailwind. I would never bolt on a Boostrap themed UI on anything unless I wanted it to fail.