Hotwireとは（Rails初学者の備忘録）

Rails7からデフォルトで使えるようになった「Hotwire」について、自分用のメモ。

Hotwireとは？

JavaScriptを書かずに、SPA（シングルページアプリケーション）のような体験ができるRailsの仕組み。
JSをたくさん書かなくても、Railsでサクサク動くWebアプリを作れるらしい。

※今のところはTurbo + Stimulusを指すことが多いみたいです。

JavaScriptをほぼ書かずに、インタラクティブなUIを実現するためのライブラリ。

最小限のJavaScriptで、HTMLに意味を持たせて動きをつけるライブラリ。

<div data-controller="hello">
  <button data-action="click->hello#greet">Greet</button>
</div>

上記コードは、「hello」という名前のStimulusコントローラーを使って、ボタンがクリックされたときにgreetという関数を呼び出す、という意味。

対応するJavaScript（例：hello_controller.js)はこんな感じ

import { Controller } from "@hotwired/stimulus"

export default class extends Controller {
  greet() {
    alert("こんにちは。Stimulusです。");
  }
}

クリックするとアラートが出る。HTMLとJavaScriptが分離されている。

モバイルアプリ（ネイティブ）向けのHotwire技術。
まだ情報が少ないみたいです。

用語	ざっくり説明
Hotwire	モダンなWebをRailsで作るための仕組み
Turbo	JavaScriptほぼ書かずに高速な画面切り替えを実現
Turbo Drive	ページ遷移を爆速にする
Turbo Frames	ページの一部だけを更新
Turbo Streams	サーバーからの変更を即時反映
Turbo Native	モバイルアプリ用（WebViewベース）
Stimulus	スッキリ書けるJavaScriptフレームワーク
Strada	モバイルアプリ用（未発表らしい）

以上、自分用のHotwireメモでした📘
知識が浅いため、TurboやStimulusを少しずつ使ってみて、扱えるようにしたいです。