Docs
Installation

Installation

Create a new Rails app

Rails UI is designed for brand new Ruby on Rails applications.

Pre-requisites

chevron-down

Before installing the gem, ensure both your node and yarn versions are up to date for best results.

Using something like nvm helps managing node versions less of a chore. I like to use homebrew for yarn and periodically run brew upgrade yarn.

Using the latest versions of these libraries allows additional scripts to run and insert build scripts dynamically to your app. TL;DR; The more up to date your version the less manual configuration you'll need to do.

rails new my_app_name

You might be tempted to pass options when creating a new app to install a CSS framework or JavaScript framework. We recommend waiting to do this until completing all configuration steps.

All other options related to tests, skipping APIs, database types, and more can be passed.

During the install, Rails UI automatically adds Tailwind CSS (in a similar manner as the cssbundling-rails and jsbundling-rails Ruby gems with some tweaks) thus making the optional flags unnecessary. esbuild is the default bundling solution for JavaScript.

Install the gem

Add the railsui gem to your Gemfile.

# Gemfile
gem "railsui", github: "getrailsui/railsui"

Run the bundle install command to fetch the new gem and its assets.

bundle install

If you're a new or existing subscriber, check your account dashboard for detailed instructions to gain access to the premium version of Rails UI.

Run the installer

Once installed, Rails UI includes several tasks and generators. Run the install task to kick things off.

This task is responsible for setting the foundation for Rails UI, which includes assets, templates, template-specific pages, and more.

What happens during installation?

chevron-down

Installing Rails UI is a quick process that goes something like this:

  1. Install the gem
  2. Run the installer rails railsui:install
  3. Boot your server and load the Rails UI landing page and click "Configure app"
  4. Set a application name, support email and choose a template.
  5. Optionally install pre-designed pages bundled with your chosen template.
  6. 🏄‍♀️ Done!

Dependencies included by default

Gems

We keep the gem list simple because Rails UI focuses less on core application logic.

Icons

For all Rails UI applications we leverage heroicons. These icons cover a lot of basis and come in multiple variants which is useful for different design problems.

It's recommended to stick with one library of icons and one variant for better consistency.

Summarized installation details

Setup and Configuration

  • Install and configure Devise for authentication.
  • Add first_name, last_name, and admin columns to the User model.
  • Include pre-designed authentication and mailer views for Devise to save loads of time.

User model

  • Add name_of_person and avatar attributes.
  • Leverage avatars for user accounts.
  • Use the name_of_person gem for flexible user references.

JavaScript

  • Replace importmaps with esbuild as the default JavaScript build engine.

ActiveStorage and ActionText

  • Add ActiveStorage and ActionText support for rich text editing.

Frontend Tools

  • Use Stimulus.js for JavaScript functionality.
  • Install custom scaffolds and generators based on installed template.
  • Tailwind CSS for styles.

Email Templates

  • Include a custom mailer layout and helpers for easy email design and coding.
  • Provide pre-built email templates (minimal, promotional, transactional) and Devise email support.
rails railsui:install

Boot the app

Boot the new app and visit the root path (localhost:3000). This should present a new page with some actions to areas related to Rails UI.

bin/dev
Rails UI start page

From there, you may proceed to configure your app.

Getting started Configuration

On this page