HotwireのJavaScriptは簡単

Hotwireは入門書レベルのJavaScriptで書ける

Hotwireは入門書程度のJavaScriptで十分に書けます。ReactのようにJavaScriptの高度な理解が要求されることはありません。

  • Hotwireでは高階関数はほとんど使いませんArray.forEach()とかArray.filter()などの初歩的なものを使ってDOM操作はしますが、高階関数を意識することはまずありません。
  • Hotwireではasync awaitやPromise、コールバック等は滅多に書きません
    • Reactでasync await等が必要になるのはほとんどがfetch()というでサーバと通信をするときだけです。それさえなければ、async awaitの必要性は激減します
    • Hotwireの場合は、fetch()はすべてTurboが担当します。そしてTurboは通常はJavaScriptすら必要なく、HTMLの属性を書くだけで十分です。もちろんasync awaitは登場しません

Hotwireの方が入門者、もしくはJavaScriptに特に詳しくないウェブデザイナーにとって優しいライブラリーと言えます。

実際のJavaScript入門書を見てみる

先日、「1冊ですべて身につくJavaScript入門講座」を購入して読んでみました。

この入門書で学習するJavaScriptの範囲は下記のものです。

  • document.querySelector()などのセレクタ
  • element.addEventListener()などのイベント処理
  • element.textContent, element.classListなどのDOM操作
  • 関数の定義の仕方
  • for文、if
  • ArrayObjectへの基本的な値の出し入れ

「これじゃ全然足りない!もっとJavaScriptをちゃんと勉強しないと現場で使えない」とお思いかもしれませんが、私が本サイトで書いているStimulus Controllerはこれでほぼカバーできます。JavaScript classの基本、三項演算子、setInterval()を追加すれば良い程度です。

javascript-intro-book.webp