RBUI (former PhlexUI) 🚀

A UI component library, crafted precisely for Ruby devs who want to stay organized and build modern apps, fast. ✨ Use this to build your own component library 🛠️

About RBUI 📚

RBUI is a UI component library designed to let Ruby developers create modern, fast, and organized applications. 💎

Key Features:

Built for Speed ⚡: RBUI leverages Phlex, which is up to 12x faster than traditional Rails ERB templates.
Stunning UI 🎨: Design beautiful, streamlined, and customizable UIs that sell your app effortlessly.
Stay Organized 📁: Keep your UI components well-organized and easy to manage.
Customer-Centric UX 🧑‍💼: Create memorable app experiences for your users.
Completely Customizable 🔧: Full control over the design of all components.
Minimal Dependencies 🍃: Uses custom-built Stimulus.js controllers to keep your app lean.
Reuse with Ease ♻️: Build components once and use them seamlessly across your project.

How to Use:

Find the perfect component 🔍: Browse live-embedded components on our documentation page.
Copy the snippet 📋: Easily copy code snippets for quick implementation.
Make it yours 🎨: Customize components using Tailwind utility classes to fit your specific needs.

Installation 🚀

1. Install the gem

bundle add rbui

or add it to your Gemfile:

gem "rbui"

2. Run the installer:

bin/rails g rbui:install

3. Done! 🎉

Documentation 📖

Visit https://rbui.dev/docs/introduction to view the full documentation, including:

Detailed component guides
Themes
Lookbook
Getting started guide

Speed Comparison 🏎️

RBUI, powered by Phlex, outperforms traditional methods:

Phlex: Baseline 🏁
ViewComponent: 5.57x slower 🐢
ERB Templates: 12.08x slower 🐌

Huge thanks to @KonnorRogers for running these tests 🙏

Importmap notes:

If you run into importmap issues this stackoverflow question might help: https://stackoverflow.com/questions/70548841/how-to-add-custom-js-file-to-new-rails-7-project/72855705

License 📜

Licensed under the MIT license.

ruby-ui / ruby_ui

readme