Ruby & Rails

Welcome to the Ruby & Rails wiki page. This page provides an overview of the Ruby programming language, its most prominent web framework, Ruby on Rails, and guidelines for developer training and development practices. It also covers how to integrate JavaScript behavior using Stimulus.

---

Overview of Ruby

Ruby is a powerful, object-oriented programming language. Designed for versatility, it runs on *nix systems and serves as an effective backend language for various web architectures (such as Sinatra-based backend applications).

---

The Ruby on Rails Framework

While Ruby is a highly capable language on its own, it is most closely associated with its most famous framework, Ruby on Rails (often simply referred to as Rails).

• Maturity & Security: Rails is a mature framework designed for building secure web applications.
• Documentation: The framework is well-supported and officially documented.
• Active Ecosystem: Rails and other Ruby gems (software packages) are updated frequently to ensure security and stability.

---

Key Benefits & Capabilities

• Rapid & Iterative Development: Combining the Ruby language with the Rails framework enables highly rapid and iterative development cycles.
• Extensibility: For performance or system-level enhancements, developers can write Rust code directly within a Ruby on Rails application.

---

Integrating JavaScript with Stimulus

Stimulus is a JavaScript framework designed to enhance existing HTML, not replace it. In a Rails application, the server renders the HTML first, and Stimulus then attaches small pieces of behavior to that HTML via data-* attributes.

Mental Model: HTML Calls JavaScript

Unlike frameworks where JavaScript renders HTML, Stimulus operates on the principle that server-rendered HTML is the source of truth, and JavaScript adds behavior to it.

• React: JavaScript renders HTML.
• Stimulus: HTML calls JavaScript.

Stimulus is DOM-oriented and does not attempt to "own" the DOM, differentiating it from frameworks like React.

Usage in Rails Views

Rails views opt into Stimulus using the data-controller attribute. Multiple controllers can be attached to a single element.

Example:

<%= form_with model: @report_provider,
  method: :put,
  data: {
    controller: "dirty-state verify-section",
    action: "change->dirty-state#markDirty input->dirty-state#markDirty submit->dirty-state#reset"
  } do |form| %>
  ...
<% end %>

This renders to HTML as:

<form
  data-controller="dirty-state verify-section"
  data-action="change->dirty-state#markDirty input->dirty-state#markDirty submit->dirty-state#reset">
  ...
</form>

Stimulus scans the DOM, identifies the data-controller attributes, and instantiates the corresponding JavaScript controller classes (e.g., app/javascript/controllers/dirty_state_controller.js for data-controller="dirty-state").

Actions

The data-action attribute connects DOM events to specific controller methods.

Example:

data: { action: "click->dirty-state#interceptNav" }

This configuration means: "When this element is clicked, call the interceptNav() method on the dirty-state controller."

Controller Method Example:

interceptNav(event) {
  if (!this.isDirty) return;

  event.preventDefault();
  this.pendingHref = event.currentTarget.href;
  this.unsavedModalTarget.querySelector('dialog').showModal();
}

Targets

Targets provide named references to important DOM elements within a controller, simplifying interaction with specific parts of the HTML.

In the View:

<%= form.hidden_field :is_verified_section,
  value: '',
  data: { 'verify-section-target': 'flag' } %>

In the Controller:

export default class extends Controller {
  static targets = ['flag', 'confirmBtn'];

  confirm() {
    this.flagTarget.value = '1';
    this.element.requestSubmit();
  }
}

The data-verify-section-target="flag" attribute in the HTML makes this.flagTarget available within the controller.

Stimulus vs. jQuery

Stimulus shares a philosophical alignment with jQuery in its approach to enhancing HTML with JavaScript behavior.

---

Training and Skill Acquisition

To train developers—including senior developers—effectively in this ecosystem, a structured approach is recommended:

1. Establish a Foundation in Ruby First: A solid foundation in Ruby is highly beneficial for developers. Ruby on Rails should only be introduced after a trainee has acquired a strong understanding of the core Ruby language.
2. Deepen Skills with Specific Resources: Utilizing specific, recommended training materials is advised to further deepen both Ruby and Rails capabilities.
3. Learn Stimulus for Frontend Interactivity: Understanding Stimulus is crucial for adding dynamic behavior to server-rendered HTML within Rails applications.