Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

franken-ui.dev

Post reply on HN
Print view View original

141–150 of 193 posts

Re: HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

#141

Post by bibstha »

This is exactly what I was looking for. I love Stripe's UI and I was looking for a library of unified components that I can copy paste with my Rails app. Then I saw shadcn and was disappointed that it was only for React.

I'm mostly a backend developer and TailwindCSS really enabled me to be bold with working with frontend CSS. So far I've been copy pasting examples from Tailwind or Flowbite. But "franken" really looks much closer to what I was looking for, a cleaner opinionated unified interfaces that I can put together, works with Tailwind and can be used with Rails.

Thanks for the work on this.

Re: HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

#142

Post by camillovisini »

bibstha wrote: post #141

This is exactly what I was looking for. I love Stripe's UI and I was looking for a library of unified components that I can copy paste with my Rails app. Then I saw shadcn and was disappointed that it was only for React. I'm mostly a backend developer and TailwindCSS really enabled me to be bold with working with frontend CSS. So far I've been copy pasting examples from Tailwind or Flowbite. But "franken" really look…

Maybe this is also interesting for you: https://github.com/aviflombaum/shadcn-rails

Re: HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

#143

Post by eddd-ddde »

Frotag wrote: post #127
tbeseda wrote: post #123

Earlier quoted context omitted.

I'd really like a set of elements like this that is truly HTML + CSS. Vanilla. Layer on some _optional_ JS for some enhancements. But this franken element requires JavaScript to even render. Same for the tooltip, leader, cover, totop, ++ components; all of which can be done with HTML and CSS. Fine, write your HTML is JS, but that isn't "HTML first". edit: I stand corrected. the form will render without JS. The tab el…

DaisyUI offers zero-JS components https://daisyui.com/ I used it for a small form + search result list recently and it works well enough for simple / static stuff. But I think I'll still be reaching for a JS lib first since I'd miss things like inputs-with-autocomplete too much.

DaisyUI is a blessing when working on qwik projects, since there is an emphasis on eliminating hydration.

It would seem that all other libraries want js for something as simple as a drop-down.

Re: HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

#144

Post by jillesvangurp »

afavour wrote: post #119

> framework-agnostic > Franken UI is a Tailwind CSS plugin :|

I guess they mean Javascript framework agnostic. We use kotlin-js with Tailwind for our frontend. Actually works really nicely. So, this might be interesting for us.

Re: HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

#145

Post by ffsm8 »

emseetech wrote: post #130
afavour wrote: post #128

Earlier quoted context omitted.

Yeah I know it’s crotchety old man territory but I find CSS absolutely fine to work with these days, now that we have variables etc. Every time I’ve added PostCSS, Tailwind or whatever I’ve found my build times jump a ton and I don’t get a whole lot of use out of it. Plain CSS and containerisation provided by Svelte (or the forthcoming scope stuff) is more than enough for me.

CSS is a dream these days. I understand why it’s intimidating for devs because it’s not meant for engineers it’s meant for designer so it has a wildly different set of assumptions and expectations. But learning it is 100% worth it. Tailwind is like an ORM. I get the appeal but if you know SQL /CSS it’s just going to get in the way.

This is ridiculous. Tailwind css is a utility "framework", which generates configured css classes to set 1-2 css attributes each. The only reason it adds a build step is that it wants to tree-shake all unused classes to keep your bundle size as small as possible and let you configure which classes are available for generation.

Even the documentation makes it extremely clear which properties are set by which class (the default ones anyway).

As an actual example: how completely braindead do you have to be to not know which properties are set from looking at the official documentation? https://tailwindcss.com/docs/overscroll-behavior

Your comparison to an ORM would work for things like Bulma, bootstrap and pretty much all component libraries, including TailwindUI. It's completely nonsensical for tailwindcss

You've either never actually looked into tailwind css and are purely talking out of your ass or are just repeating this opinion from someone that did such.

Disliking tailwind css is fine, and there are perfectly fine reasons to not use it. But your argument is just plain dumb.

Re: HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

#146

Post by blooalien »

rzmmm wrote: post #140
TheRealPomax wrote: post #121

This is definitely not HTML first, though. This is TS first, JS second, CSS third, and only then, HTML last. I'm all for clean frameworks, but this is very far removed from the idea of putting HTML first.

The extreme version of HTML first: classless CSS libraries. IMO every web developer should be aware that these are sometimes a great option https://github.com/dbohdan/classless-css

I'ma huge fan of these. They often have a built in CSS "reset" and then nice base styling for all the HTML elements most folks typically use in a website. Overlay a tiny little bit of custom CSS to "make it your own", and you're off to the races!

Re: HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

#148

Post by nullandvoid »

emseetech wrote: post #130
afavour wrote: post #128

Earlier quoted context omitted.

Yeah I know it’s crotchety old man territory but I find CSS absolutely fine to work with these days, now that we have variables etc. Every time I’ve added PostCSS, Tailwind or whatever I’ve found my build times jump a ton and I don’t get a whole lot of use out of it. Plain CSS and containerisation provided by Svelte (or the forthcoming scope stuff) is more than enough for me.

CSS is a dream these days. I understand why it’s intimidating for devs because it’s not meant for engineers it’s meant for designer so it has a wildly different set of assumptions and expectations. But learning it is 100% worth it. Tailwind is like an ORM. I get the appeal but if you know SQL /CSS it’s just going to get in the way.

For me it's not intimidating, it's just time consuming. I can create / iterate twice as fast when I'm styling inline with my HTML. It could be with tailwind, or other utility based libraries - tailwind has just done it the best from my experience.

Re: HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

#149

Post by lelanthran »

sveltecult wrote: post #125
TheRealPomax wrote: post #121

This is definitely not HTML first, though. This is TS first, JS second, CSS third, and only then, HTML last. I'm all for clean frameworks, but this is very far removed from the idea of putting HTML first.

Let me disagree. This is HTML-first because you can always grab the compiled CSS and optionally, compiled JS and reference it in your plain HTML file via and it will work just fine. The TypeScript and Tailwind insanities are just there for easier development and my convenience. ;) Maybe soon, someone will publish the compiled CSS. IDK

> This is HTML-first because you can always grab the compiled CSS and optionally, compiled JS and reference it in your plain HTML file via and it will work just fine.

But this is true for almost every web thing, and every web framework - you can just grab the final outputs and stick it into your web page.

So either your thing is "HTML-first", but so is everything else, or your thing is not "HTML-first", and some other things are.

> Maybe soon, someone will publish the compiled CSS.

So, until then, not only is this not HTML-first, it's not HTML at all.

To me (and maybe others), there's a difference between web development and Node/npm.

They are not one and the same.

Re: HTML-first, framework-agnostic implementation of shadcn/UI – franken/UI

#150

Post by lelanthran »

708733454927516 wrote: post #131
hanniabu wrote: post #122

Foolish of me to think "HTML-first" meant it wouldn't require nodejs/npm and that dependency hell.

Thanks for that. Good to know I wasn't the only one...

> Thanks for that. Good to know I wasn't the only one...

I'm also glad I'm not the only one.

I may, however, be the only one to be annoyed at what looks like a rug-pull:

"Here, come see this thing I made that doesn't require $FOO!"

> Requirements: $FOO

Post reply on HN