Most of us doing frontend have heard about Shadcn UI at this point. It’s a CLI that provides a set number of components (based on React and Tailwind) and other supporting code for building UIs, but instead of being a traditional UI library, it helps you copy paste the base components into your project so you can make them your own.
It has gotten very popular and IMO strikes a nice balance between pre-baked UI lib and the flexibility of changing the source easily. I feel it fits the ReScript mindset well.
I think that a Shadcn setup that covers most of Shadcn UI would be a big boost to the ReScript ecosystem. It’d be a quick and easy way to add high quality UI components to your app, and at the same time be maintainable since you own the component fully after adding it to your project. You just maintain it like any other component in your project.
Making a ReScript version of Shadcn
Shadcn is a set of ~50 or so components, based on various well established UI component “libs” like Radix UI.
Shadcn has the concept of registries. It’s a way of setting up your own repository of base components, including all the files needed for each. We could set up our own registry for ReScript. That registry could then contain all the base components, with the addition of ReScript bindings for each component.
With a little bit of conf in your project, you could then use it like this:
npx shadcn@canary add rescript/button
And it would install everything needed to use the component in your repo, including ReScript bindings.
How we can do this
Essentially, the work involved here would be:
- Do some basic setup for the registry itself, including guidelines for quality assurance of the bindings etc
- Create bindings for each of the ~50 components
Point 1 is easy to just bootstrap. And, if we are a couple who are interested in this, point 2 shouldn’t be that difficult either. It’d just be a matter of getting the work done.
Interested?
Key here is to gather up a few people who are interested in doing the initial work. There’s some prior art with Radix bindings etc if you search GitHub, so we wouldn’t be starting completely from scratch. But still, it’ll be some initial effort.
This will only work if we’re a few willing and able who go together share the initial workload. So, are you interested in helping out with creating the initial bindings? Please post in this thread!
