Supercharging Trix Editor with Rails Generators 🚀

March 31, 2025

As developers, we often find ourselves automating repetitive tasks—whether setting up configurations, scaffolding files, or adding custom features. Rails generators are a powerful tool to streamline this process, making development more efficient and consistent.

This article is part one of a three-part series on building a Rails gem to enhance Trix Editor with AI-powered features. The first step is setting up the Rails generator to make integration seamless.

Do you want to empower your application using artificial intelligence?

Let’s explore how AI can enhance your Rails projects! Contact me here: Get in Touch

Introducing Trix Genius

I’m currently working on Trix Genius , a Rails gem designed to bring AI-powered enhancements to Trix Editor. The goal is to improve the editing experience by integrating smart text correction, formatting, and other AI-driven tools.

With a simple command, the generator:

Creates an initializer to configure API keys and settings.

Adds a Stimulus controller to handle new AI-powered Trix features.

Ensures proper JS dependencies are in place.

The code for this feature is available on GitHub: Trix Genius – Generator Branch

Leveraging Rails Generators

Rails provides a structured way to generate files and set up configurations. In Trix Genius , I created a generator at:

lib/generators/trix_genius/install_generator.rb

Here’s how it works:

require "rails/generators"

module TrixGenius
  module Generators
    class InstallGenerator < Rails::Generators::Base
      source_root File.expand_path("templates", __dir__ )

      def create_initializer
        initializer "trix_genius.rb", <<~RUBY
          TrixGenius.configure do |config|
            config.deepseek_api_key = ENV['DEEPSEEK_API_KEY']
          end
        RUBY
      end

      def create_stimulus_controller
        copy_file "trix_genius_controller.js", "app/javascript/controllers/trix_genius_controller.js"
      end
    end
  end
end

When a developer runs:

rails g trix_genius:install

It automatically: Adds an initializer at config/initializers/trix_genius.rb Installs a Stimulus controller for enhanced editor functionality

Adding AI-Powered Buttons to Trix

A key feature of Trix Genius is an AI-powered button that corrects text inside the editor. This is achieved using StimulusJS and a simple button injection:

import { Controller } from "@hotwired/stimulus";

export default class extends Controller {
  connect() {
    addEventListener("trix-initialize", (event) => {
      const trixEditor = event.target;
      const aiButton = document.createElement("button");
      aiButton.innerText = "AI Correct";
      aiButton.classList.add("trix-button");
      document.querySelector(".trix-button-group--text-tools").appendChild(aiButton);

      aiButton.addEventListener("click", () => {
        this.correctOrthography(trixEditor);
      });
    });
  }

  async correctOrthography(trixEditor) {
    const content = trixEditor.editor.getDocument().toString();
    const response = await fetch("/orthography/correct", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({ text: content }),
    });
    const result = await response.json();
    trixEditor.editor.loadHTML(result.corrected_text);
  }
}

What’s Next?

This is part one of a three-part series on building a gem to enhance Trix Editor with AI capabilities in Ruby on Rails.

Part 1: Rails Generator (this article) – Setting up the gem and automating installation.

Part 2: Expanding AI Capabilities – Adding more smart editing features and API integrations.

Part 3: Packaging and Publishing the Gem – Finalizing, testing, and releasing the gem.

You can check out the full code and contribute at: GitHub – Trix Genius (Generator Branch)

I’m excited to see how this gem evolves. If you’re interested in Rails generators or improving rich text editing in Rails, let’s connect and share ideas!

What are your thoughts on leveraging Rails generators for automation? Would love to hear your experiences!