Ruby on Rails - Scaffoldとi18nを使用し簡単なアプリを作る手順
簡単なマスターメンテナンス画面を作成したい場合
Scaffoldを使用することが多いかと思います。
が、自動生成されるメッセージやリンクは英語なので
多くの場合(特に仕事だと)日本語化する必要があるかと思います。
今回はScaffoldとi18nを使用し、日本語対応をした簡単なアプリを作る手順について
書きたいと思います。
ちなみにi18nは国際化対応するためのものなので、日本語に限らず使用できます。
以下、「bookscaffold」というアプリを作成した手順です。
特に記述が無い場合、太字はコマンドだと思ってください。
OSはCentOS6.0、ruby 1.9.3p125、Rails 3.2.8を使用しました。
1.アプリ作成
・アプリを作成する。
rails new bookscaffold
・rails s をすると以下のエラーとなる。
Could not find a JavaScript runtime.
・このエラーに対応するため、Gemfileに以下の2行を追加する。
gem 'therubyracer'
gem 'execjs'
・デバッグ実行したい場合、Gemfileの以下の行をコメントから外す。
gem 'debugger'
・Gemfileに追加したパッケージをインストールする。
bundle install
・rails sでアプリを起動し、http://localhost:3000にアクセスできることを確認する。
2.scaffold
・scaffold(雛形)を作成する。
rails g scaffold book isbn:string title:string publisher:string page:integer price:integer released:date description:string
・データベースにテーブルを作成する。
rake db:migrate
・rails s でアプリを起動し、http://localhost:3000/booksにアクセスできることを確認する。
3.バリデーション
・model/book.rbに以下を追加する。
validates :isbn, :page, :price, :publisher, :title, presence: true
4.日本語化
・Gemfileに以下の2行を追加する。
gem 'i18n_generators'
・Gemfileに追加したパッケージをインストールする。
bundle install
・日本語化対応ファイルを作成する。
rails g i18n ja
Overwrite するか訊いてくるので『Y』と入力。
・config/locales/translation_ja.ymlを編集する。
ja:
activerecord:
models:
book: book #gattributes:
book:
description: 内容紹介
isbn: ISBN
page: ページ
price: 価格
publisher: 出版社
released: 出版日
title: タイトル
label: #一覧画面で必要
book: #モデル毎に階層化しておく。
description: 内容紹介
isbn: ISBN
page: ページ
price: 価格
publisher: 出版社
released: 出版日
title: タイトル
List: 書籍一覧
New: 新規書籍
Editing: 書籍編集
link:
New: 追加
Show: 表示
Edit: 編集
Destroy: 削除
Back: 前画面
button:
Create: 新規登録実行
Update: 更新実行
message:
SaveError: 件のエラーが発生しました。
DeleteConfirm: 削除しますか?
拡張子の通りyaml形式となっており、階層化できる。
自分はモデル特有のモノと、「追加」「削除」など共通で使用しそうなものは階層を分けた。
・viewを編集する。
画面やメッセージにtranslation_ja.ymlで定義した値を表示するため、viewを編集する。
<h1><%= t('label.book.Editing') %></h1><%= render 'form' %>
<%= link_to t('link.Show'), @book %> |
<%= link_to t('link.Back'), books_path %>
上記の例では、i18nのt()ヘルパーメソッドを使用し
translation_ja.ymlの「書籍編集」をタイトルに、「表示」「前画面」をリンクに表示している。
・日本語化した画面
こんな感じになります。
以上です。