👀

【Rails】View(ビュー)の構成ファイルを読み解く

2023/01/21に公開

〜目的のビューファイルにたどり着けるように〜

実務で初めにrailsを用いた既存のコードを読む際、ビューで使われているファイルがどこにあるのかよくわからないということがありました。その原因はレイアウトや複数の部分テンプレートが用いられていたからです。この記事ではプログラミング初学者が上司から「このページの文言直しといて」と言われた時、素早く対象ページの記述があるビューファイルにたどり着けるようにビューの構成を読み解いていきます。


railsの基礎的なビューファイル表示の流れ

railsの基本的な流れとして、リクエストが実行され、ルーティング→コントローラー(+モデル)→ビューファイルと表示されるのはrails初心者でもご存知の通りかと思いますが、念の為に軽く説明しておきます。
例えば、app/controllersディレクトリにあるquestions_controller.rbのindexアクションが呼ばれる時app/views/questions/index.html.erbが表示されます。

(例)questions_controller.rb
class QuestionsController < ApplicationController
  def index
  end
end

この時レイアウトを特に設定していなければ、基本的には、app/views/layoutsディレクトリのapplication.rbが適応され、以下のようなファイルの<%= yield %>の部分に、先ほどのindex.html.erbというビューファイルが埋め込まれるような構成になります。

(例)application.rb
<!DOCTYPE html>
<html>
  <head>
    <title>FirstApp</title>
    <%= 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>
    <%= yield %>
  </body>
</html>

以下がこの時のビュー構成のイメージ図です。これがrailsの最もシンプルな形のビューの構成となるかと思います。

図①

レイアウトと部分テンプレートを使用している時の構成

次に、指定のレイアウトや部分テンプレートが用いられるとビューの構成はどのようになるのでしょうか?例として以下のようなイメージ図になります。ちょっとややこしくなりましたね。ページの文言等を修正するために、その内容がどのファイルに書かれているのかをたどっていきましょう。


図②

URLから推測

上の図②のリクエストURLからたどります。ページにはURLがあるのでそれを確認することはすぐできますね。図②ではドメインの後のquestions/indexからviews/questions/index.html.erbがそのページで表示されるビューファイルということと、questionsコントローラーが動作することが推測できるはずです。

ビューファイルから推測

次にindex.html.erbのファイルの中を見てみましょう。中にrenderが使われている場合は部分テンプレートが用いられている可能性があります。他で使いまわしたいビューファイルのコードがある場合などに部分テンプレートは用いられますよね。renderを見つけたら、そのrenderに部分テンプレートのファイル名が書いてあります。以下のようなコードならindex.html.erbと同じディレクトリに_menu.html.erbという「_(アンダースコア)」のついたファイルがあるはずです。

index.html.erb
<%= render partial: 'menu' %>

違うディレクトリにある場合はそのディレクトリへのパスも書いてあるはずなので、結局renderを見ればこの部分に埋め込まれる部分テンプレートがどこにあるファイルかということがわかります。

部分テンプレートについて以下リンクのpikawakaさんが非常にわかりやすかったので、詳しくはこちらを見てみてください。
【Rails】 部分テンプレートの使い方を徹底解説!

コントローラーから推測

リクエストによってquestions_controller.rbというコントローラーが動く時、返すビューのレイアウトはどうやって決まるのでしょうか?
views/layoutsディレクトリにquestions.html.erbというレイアウトファイルがあれば、このファイルがレイアウトとして適応されます。つまりコントローラーの名前と一致するファイルがlayoutsディレクトリに存在すれば、そのファイルがレイアウトになるということです。
ただ、コントローラーの名前と一致するファイルが存在しなくても特定のレイアウトが適応される場合があります。それは、コントローラーが他のクラスを継承している場合です。先ほどの例で言うと、questions.html.erbというファイルがlayoutsディレクトリになくても、他のクラスを継承していた場合には、そのクラスのファイル名とlayoutsディレクトリを見て、使用されるレイアウトファイルがどれかを考える必要があるということです。

questions_controller.rb
class QuestionsController < ApplicationController

questions.html.erbが存在しない時に、application.html.erbがレイアウトと使用されるのは、上記のようにApplicationControllerを継承しているからなのですね。
こちらも以下のPikawakaさんのページが非常にわかりやすいです。
【Rails】 layoutメソッドの使い方と使い所とは?

まとめ

実際はもっと色々なパターンがあるかと思いますが、これで大体ビューを構成するファイルの場所が見つけられるようになったのではないでしょうか。特にレイアウトに関しては、ビューファイルにどのレイアウトが適応されるかということを私もしっかり理解できていませんでした。railsはルールに則って作れば、コードの記述量を減らすことができますが、そのルールを知らないまま、コードを読むと訳がわからなくなるということもありますので、私も気をつけてやっていきたいと思いました。

Discussion