Nice job! I've tried dozens of frameworks with various languages, but always return to Django+Tailwind+HTMX+Alpine.
High five! Close enough to my stack.
Show HN: Basecoat – shadcn/UI components, no React required
41–50 of 79 posts
Re: Show HN: Basecoat – shadcn/UI components, no React required
#42Looks great! One suggestion would be adding a focus trap, such as when a Dialog opens. It's nice to use the tab key to move around the Dialog (inputs and buttons). Currently focus leaves to the page behind. It might be as simple as adding https://alpinejs.dev/plugins/focus#x-trap
Yeah, I looked into it but wanted to avoid adding plugins.
I already do a bit of (simple) focusing here and there, so it shouldn't leave the focus on the background:
https://github.com/hunvreus/basecoat/blob/main/src/js/dialog...
But more complex scenario require you to be specific about the field you want to see focused. I was thinking about allowing you designate the field to focus on.
What would you suggest?
Re: Show HN: Basecoat – shadcn/UI components, no React required
#43Awesome. Using Vue/Tailwind, I'm definitely interested in this. Maybe you could try to add examples of integrations with others frameworks? I'll play with it and give you my 2 cents.
Not sure if you're aware, but there's a well-supported Vue ShadCN library: https://www.shadcn-vue.com/
Yeah, it's excellent.
Re: Show HN: Basecoat – shadcn/UI components, no React required
#44Really great! A major downside of moving from SPA's back to vanilla JS is how much you lose in terms of UI components. I've normally done DaisyUI + Tailwind + Rails but it never feels quite right. Basecoat is a really nice step forward. I have to imagine the author is planning to charge for a premium package at some point, but given that a huge % of development is spent on UI design, I'd be more than happy to pay for…
Glad you like it. Do let me know what you end up building with it.
> I've normally done DaisyUI + Tailwind + Rails but it never feels quite right.
Same here: I could never quite get into Flowbite, Daisy UI, Preline or any of the other many alternatives.
> I have to imagine the author is planning to charge for a premium package at some point,
I did wonder if people would want to buy premium layouts or components. No plan to charge for anything for now though.
Re: Show HN: Basecoat – shadcn/UI components, no React required
#45There’s a huge need for this, thank you! I build server-rendered marketing sites and there’s a huge gulf between the jQuery and React era.
Have you played with Alpine.js before? HTMX?
I think you can get quite far these days WITHOUT React or Vue.js (and I say that as the maintainer of a Next.js/React open source project [1]).
[1]: https://pagescms.org
Re: Show HN: Basecoat – shadcn/UI components, no React required
#46Absolutely love this. Wanted to do this myself but never enough to get started. You're a legend.
Thanks a lot, I got this done over the course of a few weeks and had no idea whether people would find this helpful. Looking forward to seeing others using it in the wild.
Re: Show HN: Basecoat – shadcn/UI components, no React required
#47Why did you decide going old school using Alpine.js instead of using plain vanilla web components?
I did seriously consider it, but again that was about trying to solve the problem in the least opinionated way.
Which is also why I made the Alpine code as unobtrusive as possible.
You can get away with using purely the CSS if you don't need dialogs or combobox. And you can plug your own JS if you decide to do so.
However, I will definitely try and see if I can make a web components version as soon as I have some time.
Re: Show HN: Basecoat – shadcn/UI components, no React required
#48Would you be interested in getting rid of Tailwind and have the styling strictly with SASS mixins?
Yes, I wanted to export it as a raw CSS build and host it on a CDN.
Feel free to watch the project if you want to be notified when I get that out.
Re: Show HN: Basecoat – shadcn/UI components, no React required
#49This is awesome. I did the same and have been using AlpineJS Pines UI library. Been pretty happy with it! But will take a look at this
Pines is really neat. I just don't like the wall of classes, but super neat nonetheless.
Re: Show HN: Basecoat – shadcn/UI components, no React required
#50This is great! The HTMX community needs more friendly UI kits like this.
Are you the HTMX CEO?