Railsで作る最も簡単なブログシステム(2)

Railsで作る最も簡単なブログシステム(1) - dan5yaの日記の続きです。

ジェネレートコマンドの意味

前回はRailsプロジェクトを作った後に、次のコマンドを実行しました。

ruby script/generate scaffold Entry title:string body:text created_at:datetime

これはscaffold（足場）という雛形を作るコマンドです。

コマンドの先頭部分を見てください。実はこれはrubyコマンドを使ってRuby スクリプトを実行しています。

ruby script/generate

上の部分だけを見れば、script/generateというソースファイルを実行しているように見えます。事実その通りで、後ろに続く文字列はオプションに過ぎません。

script/generateは、いろんな雛形を生成するスクリプトです。script/generateの使い方は、次のようにすると大体わかります。

ruby script/generate --help

これでscript/generateスクリプトのヘルプが表示できます。表示されるヘルプの「Installed Generators」のところを見ると、使用できるジェネレーターを確認できます。ここには「scaffold」も含まれています。

オプションの1つ目には、ジェネレータを指定します。上では「scaffold」を指定しました。次のようにすると「scaffold」についてのヘルプを表示できます。

ruby script/generate scaffold --help

このヘルプでも確認できますが、scaffoldに続くオプションは、モデル名とフィールド情報です。フィールド情報は省略可能です。

ruby script/generate scaffold Entry title:string body:text created_at:datetime
                               ↑         ↑         ↑            ↑
                            モデル名    フィールド情報

モデル名はEntryとしています。
また、次のようなフィールド情報をオプションに指定しています。

title:string body:text created_at:datetime

上のフィールド情報から、次のようなカラムがDBのentriesテーブルに作成されることになります。

||!カラム名  ||!カラム型 || 備考
|| title     || string   || 記事のタイトル
|| body      || body     || 記事の本文
|| created_at|| datetime || 記事の作成日時

上記のテーブル情報は、Migration定義ファイルに記録されています。具体的には、ジェネレートコマンドを実行したときに生成されたdb/migrate/001_create_entries.rbに書かれています。Migrateion定義ファイルの内容は「rake db:migrate」コマンドを実行したときに、DBに反映されます。

レイアウトの作成

次にレイアウトファイルを作成します。

新規にapp/views/layouts/application.html.erbというファイルを作成し、以下のような内容で保存してください。

app/views/layouts/application.html.erb

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
  <title>Pipin: <%= controller.controller_name %></title>
  <%= stylesheet_link_tag 'scaffold' %>
  <%= stylesheet_link_tag 'base' %>
</head>
<body>
<div class="main">

<h1>Pipin</h1>

<div class="header-menus">
  <%= link_to 'Home', :controller => 'home', :action => '' %>
  <%= link_to 'Archive', :controller => 'home', :action => 'archive' %>
  <%= link_to 'About', :controller => 'home', :action => 'about' %>
  <%= link_to '日記を書く', :controller => 'entries', :action => 'new' %>
  <%= link_to '管理', :controller => 'entries', :action => '' %>
  <%= link_to 'ログアウト', :controller => 'users', :action => 'logout' %>
</div>

<p style="color: green"><%= flash[:notice] %></p>

<%= yield  %>

</div>
</body>
</html>

scaffoldをジェネレートした時に、app/views/layouts/entries.html.erbというファイルが作成されているはずです。すべてのページのレイアウトでapplication.html.erbを使いたいので、こちらは削除してください。

レイアウトファイルが準備できたら、もう一度ブラウザから次のURLにアクセスしてください。

http://localhost:3000/entries

TODO.SS /entries

いくつかのメニューが追加されているはずです。「日記を書く」「管理以外」のリンクは、まだ有効になっていないので、クリックしてもまだページを開くことは出来ません。

トップページを作る

「Home」画面を作ります。Home画面は、ブログのトップページです。最終的にはこのページを開くと最新の記事を5件表示されるようにします。

新しくHomeコントローラを作成します。コマンドプロンプト（シェル）から次のコマンドを実行してください。

ruby script/generate controller Home index

これでHomeコントローラーがジェネレートされました。

ブラウザから次のURLにアクセスしてください。

http://localhost:3000/home

TODO.SS /home

ブラウザで開いた画面には「Find me in app/views/home/index.html.erb」と表示されています。app/views/home/index.html.erbをエディタで開いてみてください。今ブラウザで開いている画面は、このファイルの中身です。このビューファイルを書き換えると、ブラウザで表示されているページの内容が書き換わります。

app/views/home/index.html.erbを次のように書き換えてください。

app/views/home/index.html.erb

<% for entry in @entries %>
  <div class="entry">
    <div class="date">
      <%= entry.created_at.year %>年<%= entry.created_at.month %>月<%= entry.created_at.day %>日
    </div>
    <h2><%=h entry.title %></h2>
    <div><%=h entry.body %></div>
    <%=link_to 'permalink', :controller => 'entries', :action => 'show', :id => entry %>
  </div>
<% end %>

上のビューファイルは、@entriesという変数を必要としているので、コントローラこの@entriesを準備する必要があります。app/controllers/home_controller.rbを開いて、indexメソッドの中に次の1行を書き込んでください。

class HomeController < ApplicationController

  def index
    @entries = Entry.find(:all, :order => "created_at DESC")    # この行を追加する
  end
end

ブラウザから次のURLをリロードしてください。

http://localhost:3000/home

TODO.SS /home

記事が登録されていれば、記事が日付の新しい順に表示されるはずです。（記事は「日記を書く」をクリックすれば作成できます。）

コントローラのジェネレートについては、次のコマンドで表示されるヘルプを参考にすることができます。

ruby script/generate controller --help

まとめ

ここまでに作ったものをブラウザで確認すると、かなりブログっぽくなったのがわかると思います。

今回の作業をまとめます。

レイアウトの作成
1. app/views/layouts/application.html.erb を作成する（共通レイアウト）
2. app/views/layouts/entries.html.erb を削除する
3. ブラウザで確認 → http://localhost:3000/entries
トップページの作成
1. Homeコントローラの作成。コマンド実行 → ruby script/generate controller Home index
2. app/views/home/index.html.erb を書き換える（トップページのビュー）
3. app/controllers/home_controller.rb に1行追記する（トップページのアクション）
4. ブラウザで確認 → http://localhost:3000/home

レイアウトとトップページが作成されました。

Railsで作る最も簡単なブログシステム(3) - dan5yaの日記に続きます。