People keep talking about shadcn/ui, so I just created some reusable React...
People keep talking about shadcn/ui, so I just created some reusable React components with it.
My impressions:
✅ It’s fast to get started with Next, Vite, etc.
✅ Handy setup CLI prompts me with preferences.
✅ It generates components via a CLI, then I own the code. So it's easy to customize.
✅ The generated components have thoughtful built-in color variants, sizes (such as big vs small button), etc.
✅ It’s opinionated. The generated components use Radix UI (a proven, accessible foundation), and Tailwind for styles.
✅ The generated components are robust. They handle refs, set displayName, and include TypeScript types that extend the proper type.
If you’re creating reusable components with React and Tailwind, this is a compelling foundation.
Great work @shadcn!
Here's the Button component it generates 👇
That said, every approach has its tradeoffs.
Here's a couple downsides I see:
🚫 It’s a niche tool. If I am not using Tailwind this isn’t for me. If I want to use a different component library instead of Radix, this isn’t for me.
🚫It’s a high-level abstraction that depends on quite a few packages in addition to Tailwind and Radix UI such as class-varianace-authority (styling variants), Lucide (icons), and more. Since the components are generated once, if there are bug fixes or enhancements later, I won’t get them. And if there are breaking changes to these dependencies in the future, it's my responsibility.
These downsides aren't a dealbreaker, just something to consider before diving in.