Railsの前にSinatraをやろう #4

Sinatra

Sinatraでテンプレートを使う方法（Railsの前にSinatraをやろう #2）の続き。

テンプレートで共通部分をまとめる

layout.erbを使うと、viewsディレクトリのファイルに共通するヘッダーなどをまとめることができる。viewsディレクトリの中にlayout.erbを置く。

├ test.rb
├ public
　└── style.css
├ views
　└── index.erb
　└── contact.erb
　└── layout.erb

たとえば、以下のような index.erb と contact.erb があったとする。

<index.erb>

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Sinatra Practice</title>
  </head>
  <body>
    <!-- ここより上は共通 -->
    <h1>Sinatra Practice</h1>
    <p>現在、<%= @now %>です。</p>
    <!-- ここから下は共通 -->
  </body>
</html>

<contact.erb>

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Sinatra Practice</title>
  </head>
  <body>
    <!-- ここより上は共通 -->
    <h1>お問い合わせ</h1>
    <p>○○○○○○○○○</p>
    <!-- ここから下は共通 -->
  </body>
</html>

layout.erbに共通する部分を書き、各ページで異なる部分は<%= yield %>とする。

bodyの<h1>より上は全ページ共通で、<h1>以降がページごとに異なるという場合は以下のようになる。

<layout.erb>

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Sinatra Practice</title>
  </head>
  <body>
    <!-- ここより上は共通 -->
    <%= yield %>
    <!-- ここから下は共通 -->
  </body>
</html>

index.erb など他のファイルには、yieldに入る部分だけを書けばいい。

<index.erb>

<!-- index.erb 独自の内容 -->
<h1>Sinatra Practice</h1>
<p>現在、<%= @now %>です。</p>

<contact.erb>

<!-- contact.erb 独自の内容 -->
<h1>お問い合わせ</h1>
<p>○○○○○○○○○</p>

<test.rb>

get "/" do
  @now = Time.now
  erb :index
end

get "/contact" do
  erb :contact
end

rbファイルの書き方は、layout.erb を使わないときと同じ。layout.erb は特に呼び出したりする必要はない。viewsディレクトリに入れておけばOK。

ページ数が多いときなどに便利。

参考：Sinatra 入門 - Qiita