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

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

今回はRailsとは直接関係のないお話です。日記本文をHikiDocの文法で記述できるようにして、本文の表現力を高めます。

HikiDocを使う

HikiDocはRubyで書かれたテキストをHTMLに変換するツールです。決められた記法に基づいて記述されたテキストからHTMLをジェネレートすることができます。

HikiDocの文法はHTMLよりずっとシンプルです。ブログの原稿の作成では、手で直接HTMLを書かず、このような変換ツールの文法で記述するのが一般的です。

hikidoc.rbをlibにコピーする

http://projects.netlab.jp/hikidoc/?FrontPage.jaからhikidoc.rbを入手して、プロジェクトのlibディレクトリにコピーします。libディレクトリにコピーしたRubyスクリプトはrequreで読み込むことができます。

EntryモデルにHTMLのジェネレート機能を追加する

Entryモデルを次のように修正します。

app/models/entry.rb

require 'hikidoc'

class Entry < ActiveRecord::Base
  def to_html
    HikiDoc.to_html(body, :level => 3)
  end
end

Entryモデルを定義しているEntryクラスにto_htmlメソッドを追加しています。to_htmlメソッドは、HikiDocライブラリを用いて記事の本文をHTMLに変換した文字列を返します。Entryモデルでは記事の本文がbodyフィールドに格納されているので、bodyというメソッドでDBに格納されているテキストを取得することができます。

ビューの修正

次にビューを修正します。これまではbodyの戻り値をそのまま記事の本文として埋め込んでいましたが、to_htmlメソッドを使って本文をHTMLに変換した文字列を表示するように修正します。

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><%= entry.to_html %></div> <!-- ←この行を書き換える -->
    <%=link_to 'permalink', :controller => 'entries', :action => 'show', :id => entry %>
    <hr />
  </div>
<% end %>

ついでにパーマリンクのリンク先であるentries/showの方のビューも次のように修正しておきます。

app/views/entries/show.html.erb

<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><%= @entry.to_html %></div>
</div>

<% if logged_in? %>
  <%= link_to 'Edit', edit_entry_path(@entry) %> |
  <%= link_to 'Back', entries_path %>
<% end %>

書きこみテスト

HikiDocの文法を使って本文を書き込んで見ましょう。例えば次のような本文を書き込んでみてください。

パラグラフ

* リスト
* リスト
* リスト

# リスト
# リスト
# リスト

このようなテキストを書き込めば、HTMLに変換された結果が表示されるのを確認できると思います。