テクノロジー

2017年9月17日

Railsの中のビューについて

Railsの中のビューについて

今回は、Railsのフレームワークの中でビューがどのように呼び出され、また、ビューの中でRubyのコードがどのようにHTMLに変換されているかを解説いたします。

ビューの呼び出し

ビューは、リクエストに対するレスポンスとして返し、ブラウザに表示させるためのファイルのことです。特に指定のない場合、ビューの中にある特定のHTMLファイルが選ばれ、レスポンスとして返されます。

アクションの中に、ビューに対する指定が何も書かれていない場合は アクション名と同じ名前のビューファイル が呼び出されます。
例えばBlogという機能があった時に、blogsコントローラのindexアクションに何も書かれていない場合、 app/views/blogs/index.html.erb という名前のビューファイルが呼び出されます。

class BlogsController < ApplicationController
  def index
  end

  def show
    render :new
  end
end

一方でblogsコントローラのshowアクションには、

render :new

という記述があるので、app/views/blogs/new.html.erb という名前のビューファイルが呼び出されます。

ビューがどのようにHTML変換されるか

今回はapp/views/blogs/show.html.erbの一部を元に説明していきます。

まずはHTMLに変換される前の ビューファイル です。

(app/views/blogs/show.html.erb)

<p>
  <strong>Title:</strong>
  <%= @blog.title %>
</p>

<p>
  <strong>Content:</strong>
  <%= @blog.content %>
</p>

<%= link_to 'Edit', edit_blog_path(@blog) %>
<%= link_to 'Back', blogs_path %>

次にHTML変換後の HTMLソース です。

<p>
  <strong>Title:</strong>
  hoge
</p>

<p>
  <strong>Content:</strong>
  hogehoge
</p>

<a href="/blogs/1228/edit">Edit</a>
<a href="/blogs">Back</a>

さらに詳細に見ていきましょう。

<%= @blog.title %>
<%= @blog.content %>

上記のようにタイトルや内容を表示するところは、以下のように実際の値に変換されます。

hoge
hogehoge

では link_to という構文はどのようにHTML変換されるのでしょうか。

<%= link_to 'Edit', edit_blog_path(@blog) %>
<%= link_to 'Back', blogs_path %>

link_toは以下のように aタグ に変換されます。

<a href="/blogs/1228/edit">Edit</a>
<a href="/blogs">Back</a>

このように <%= %> や <% %> の部分が全て変換されることで、Rubyの記述がHTMLソースとなることを理解していただけたでしょうか?
index.html.erbのような形でファイルを作成することで、HTMLにRubyの機能を適用することができるのです。

DIVE INTO CODEのことをもっと知ってみませんか?