I think now the ergonomics are now better - use vite-ruby, inertia.js and your fav design library with rails either with Vue | React | Svelte.
Design System Options for Rails
11–20 of 40 posts
Re: Design System Options for Rails
#12I use TailwindUI for many of my rails projects. Or just grab some Tailwind things from around the web.
Tailwind has really rekindled my joy in creating views.
Re: Design System Options for Rails
#13It’s too bad most UI libraries ate tied to a particular framework like React, Tailwind, etc. instead of self-contained web component elements.
I've had a good experience so far working on an admin dashboard with BeerCSS (and Datastar which is unrelated). It implements a lot of the Material Design stuff and it is opinionated but between the examples on the main site and documentation on GitHub it was pleasant to work with. It's easy to get started too, just add three links in the .
Re: Design System Options for Rails
#14I use TailwindUI for many of my rails projects. Or just grab some Tailwind things from around the web. Tailwind has really rekindled my joy in creating views.
Yes, I have to maybe add a small note that might not be clear. I need something I can include for people in my Rails template. If it's fully commercial, I cannot redistribute it and my customers would need a license.
Re: Design System Options for Rails
#15I came across CSS Zero recently: https://csszero.lazaronixon.com/lookbook/pages/overview which bills itself as an "opinionated front-end starter kit" specifically for Rails and includes Stimulus.js code for JavaScript functionality. It seems the benefits are that it is no build (pure CSS with CSS variables) and easy to modify and extend.
Yes, it's a good one. I'll include csszero in the updated version of the post.
Re: Design System Options for Rails
#16Not to nitpick terminology, but I don't think it's helpful to equate "design system" with component library. A design system is the design tokens used to describe an organization's application(s), and largely independent of the exact technologies. I worked with our UX team at a mixed tech company (Rails, React, mobile) who defined the patterns and tokens, and then my team implemented so that we could use across our s…
You are absolutely right. The perspective is simply a practical question of, can we grab a component library that feature a design system (that we can hopefully update with our preferences).
Re: Design System Options for Rails
#17I'm currently building one called Nitro Kit.
Everyone seems to have their own opinion on what something like this should and should be or do. Nitro Kit is my opinion and I'm getting a lot of joy from using it on my own sites and services.
It's free and open source and, full disclaimer, there's a paid premium offering too.
Here's a video about my reasoning behind building it:
Re: Design System Options for Rails
#18I'm currently building one called Nitro Kit. Everyone seems to have their own opinion on what something like this should and should be or do. Nitro Kit is my opinion and I'm getting a lot of joy from using it on my own sites and services. It's free and open source and, full disclaimer, there's a paid premium offering too. https://nitrokit.dev/ Here's a video about my reasoning behind building it: https://www.youtube.…
I'll add it to the post. I have seen it before but it slipped from my mind.
Re: Design System Options for Rails
#19Not to nitpick terminology, but I don't think it's helpful to equate "design system" with component library. A design system is the design tokens used to describe an organization's application(s), and largely independent of the exact technologies. I worked with our UX team at a mixed tech company (Rails, React, mobile) who defined the patterns and tokens, and then my team implemented so that we could use across our s…
You are absolutely right. The perspective is simply a practical question of, can we grab a component library that feature a design system (that we can hopefully update with our preferences).
Yes this basically why we used Bootstrap. The components and patterns UX wanted to use were a close match for Bootstrap's components, aside from colors, fonts, etc which we then adjusted.
Re: Design System Options for Rails
#20Totally get the struggle — I spent way too many hours figuring which design system should I use for my next project. Ended up creating a site to compare the options: [https://rails.style]. Might help others in the same spot.