2012-05-13

　おひさしぶりの更新です。
　こっちのブログは技術ブログにしちゃおうと思います。

ひがしのてらこや。とは

　このウェブサイトです。http://higashinoterakoya.herokuapp.com/
　僕が友達といっしょに作った、ゲーム制作サークルです。

　今までは、更新のたびにHTMLを書き直して、Windows7にデフォルトで入ってるFTP接続機能でfc2のウェブサイトサービスにアップロードしてたのですが、編集も転送もけっこうめんどくさくて、更新ペースはかなり遅かったです。月に1回、あるかどうか、というくらいでした。

　そこで、リニューアルを機会に更新を楽にしようと思って、ブラウザ上で記事を編集できるシステムを作りました。ふつうのユーザーにとっては関係ないけれど、管理者（僕と友人）にとっては便利になりました。

　コードはGitHubに上げてあります。こちら。 https://github.com/katryo/higashinoterakoya

実現したこと

IDをパスワードでログイン・ログアウトできる
ログインすると、記事を編集できる
記事はデータベース（PostgreSQL）で管理
「過去の記事」ページで、これまでの記事を最新10件まで一覧にして表示できる
記事は新しい順に自動的に並べられる
記事にはすべて投稿日時が併記される
最新の記事は、トップページに自動的に表示される

……ということを実現しました。

どういう風に作ったか

　RailsによるアジャイルWebアプリケーション開発第4版

　の第14章「タスクI：ログイン」通りに作りました。

　……。
　ほとんどこの本の言うとおりそのままです。この本を読んで、書いてある通りに写経して作るとよいと思います。
　でもまあ、工夫したところがないわけでもなくて、

工夫したところ

　RailsによるアジャイルWebアプリケーション開発第4版を手元に、ここからは読んでほしいです。

投稿時刻通りに記事が並ぶようにした

　記事を作成するページは、RailsによるアジャイルWebアプリケーション開発第4版でいうところのProductページと同じ作り方をしています。63ページに書いてある、

Rails generate scaffold Product title:string description:text image_url:string price:decimal

のかわりに

Rails generate scaffold Article title:string description:text

として、Articleコントローラとビューをscaffoldします。image_urlやpriceはいらないです。
このあとは本通りにArticleを作ってくのですが、記事の並ぶ順番を日時通りにソートするために、ちょっと手を加えます。

Articleコントローラのindexメソッドが、http://higashinoterakoya.herokuapp.com/articlesページを開いたときの動向を指示しているのですけど、ここで、

  def index
    @articles = Article.order("created_at DESC")

    respond_to do |format|
      format.html # index.html.erb
      format.json { render json: @articles }
    end
  end

　と、("created_at DESC")を書き加えて、投稿日時が新しい順番に並べています。
　/articlesページの編集できないバージョンであり、非管理者ユーザーが見るページである/archivesのコントローラでも、同様の処理をして、投稿日時で並べています。
　created_atというヘルパーメソッドは、Rails3に標準で入ってるので新たに設定する必要はないです。

　@articlesには記事全体が順序正しく並び、@articleには1つ1つの記事が入ります。1文字違いで別のものなので気をつけましょう。

投稿日時を表示させた

  <h4>
      投稿日時：
      <%= article.created_at %>
      </h4>

　とapp/view/articles/index.html.erbとapp/view/archives/index.html.erbに書き入れただけです。ただ、初期設定のままだと世界標準時になってしまうので、config/application.rbに

config.time_zone = 'Tokyo'

　と書き込みます。これで日本時間で表示される！

markdown記法を導入

　RailsによるアジャイルWebアプリケーション開発第4版のProductページのように作り終えても、トップページ（本ではstore#indexにrootを通しているのでapp/views/store/index.html.erb）でdescriptionを表示するタグはsanitizeされているので、記事を書くときにHTMLのタグを書いたり、改行したりしても無視されます。
　これだと不便なので、書いた記事をmarkdown記法で解釈してくれるように機能を加えました。

　使ったのは、redcarpetです。
　Railscastにあるチュートリアル通りに導入しました。これです。 http://railscasts.com/episodes/272-markdown-with-redcarpet?language=ja&view=asciicast
　このRailscast通りにすれば導入はできるので、ここでは詳しくは書きません。

　ただし、ここで注意すべきところがあります。
　redcarpet、ver2以降だと動きません。このRailscastチュートリアルはver1系列のredcarpetが対象のようで、うっかりGemfileにgem 'redcarpet'とだけ書くと、動きません。
　なので、今回はredcarpetのバージョンを1.17.2に指定して、Gemfilesには

gem 'redcarpet', '1.17.2'

と書きましょう。

　コードはGitHubに上げてあります。こちら。 https://github.com/katryo/higashinoterakoya

次回予告

　生まれて初めて作ったウェブサービス「にせほボタン( http://nisehobutton.heroku.com/ )」の作り方メモを次回は書きます。
　見直してみたら、いらないコードとか試しに書いてみたメソッドとかが多かったので、リファクタリングし直してから投稿します。

はてダの更新も続けると約束したな、あれは嘘だ

ウェブページ「ひがしのてらこや。」にログイン機