内容

Rails-ujsとはなんなのか

Rails-ujsとは

Railsの一部のRESTfulな動作や非同期な処理などを実現するために、JavaScriptの送信に関する処理などが書かれたライブラリ！

例えば、Viewヘルパーの form_with の remote: true オプションだったり、 link_to の method: :delete などのオプションを「それっぽく動くように」動作させられるようになる。

どこにあんの

app/javascript/packs/application.js

// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.

import Rails from "@rails/ujs"
import Turbolinks from "turbolinks"
import * as ActiveStorage from "@rails/activestorage"
import "channels"

Rails.start()
Turbolinks.start()
ActiveStorage.start()

これが
ここで呼ばれている

app/views/layouts/application.html.erb

<!DOCTYPE html>
<html>
  <head>
    <title>RailsPractice</title>
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
  </head>
  <body>
    <%= render "shared/header" %>
    <%= render "shared/flash_messages" %>
    <%= yield %>
  </body>
</html>

この部分

<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>

なので、
app/views/admin/layouts/application.html.erb
のようなファイルを作った場合は

<%= csrf_meta_tags %>
    <%= csp_meta_tag %>
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>

この辺をしっかり書いてあげようねって話でした