2.2. ブログづくりで学ぶCRUDアプリケーション¶

2.2.1. CRUDとは¶

CRUDとは Create/Read/Update/Delete の略称です。 多くのWebアプリケーション(特に管理系のアプリケーション)はCRUDで構成されています。

ブログアプリケーションの場合、記事は以下CRUDを持ちます。

• Create

  • ブログ記事の新規作成

• Read

  • ブログ記事一覧の表示・ブログ記事の表示

• Update

  • 作成したブログ記事の更新

• Destroy

  • 作成したブログ記事の削除

2.2.2. Railsアプリケーションの新規作成¶

Railsで新しいブログアプリケーションを作成しましょう。 データベースにはmysqlを利用しますので、あらかじめmysqlが使える状態にしておいてください。

まずはrailsコマンドがコンソールで使える状態にします。次のgem install コマンドでrailsをインストールします。

gem install rails

rails導入後に次のコマンドで新規railsアプリケーションを作成します。

rails new hello_blog --database=mysql

hello_blog はアプリケーションの名前です。アプリケーションには好きな名前をつけましょう。

2.2.3. アプリケーションサーバを起動する¶

新しいRailsアプリケーションを作成したので、アプリケーションサーバを起動してみましょう。 作成したhello_blogディレクトリ内に移動し、ターミナルから次のコマンドを入力します。

cd hello_blog  # 新しく作成したhello_blogプロジェクト内に移動する
bundle exec rails server

コマンドを実行するときは、先頭にbundle execコマンドをつけましょう。 bundle exec をつけると、プロジェクト内のGemfileに指定した環境でコマンドを実行することができます。

Rails5.2では、Pumaというアプリケーションサーバが起動します。 サーバを起動したら、ブラウザから http://0.0.0.0:3000 にアクセスします。 次の画面が表示されたら、正常にアプリケーションサーバが起動できています。

アプリケーションサーバを停止するには、 Ctrl + C を押します。

2.2.4. 記事一覧表示用コントローラとビューを作成する¶

http://0.0.0.0:3000/articles/index にアクセスしたら、ブログ記事一覧をブラウザに表示させたいところですが、 まずはブラウザ上にHello Worldを表示するプログラムを作りましょう。 この機能を実現するためには、ルーティングとコントローラとビューを作成する必要があります。

まずはコントローラとビューを作成しましょう。 コントローラとビューを1から全て記述して作成することもできますが、 Railsでは次のコマンドでコントローラとビューの初期テンプレートを自動生成することができます。

bundle exec rails generate controller articles index

rails generate controller コマンドでコントローラを自動生成します。 articles は コントローラの名前です。Railsでは基本的にコントローラ名は複数形で定義します。

indexは生成したいアクション名です。アクションは基本的に index/show/new/create/edit/update/destroy の7つを使います。 リソースの一覧を表現するときには、indexを利用します。

コマンドを実行すると、次のようにファイルが自動生成されます。

$ bundle exec rails generate controller articles index

      create  app/controllers/articles_controller.rb
       route  get 'articles/index'
      invoke  erb
      create    app/views/articles
      create    app/views/articles/index.html.erb
      invoke  test_unit
      create    test/controllers/articles_controller_test.rb
      invoke  helper
      create    app/helpers/articles_helper.rb
      invoke    test_unit
      invoke  assets
      invoke    coffee
      create      app/assets/javascripts/articles.coffee
      invoke    scss
      create      app/assets/stylesheets/articles.scss

多くのファイルが自動的に生成されましたが、今回見るべきなのはルーティングとコントローラ、そしてビューの部分です。

create app/controllers/articles_controller.rb

と出力されていますが、これはarticles controllerが自動的に作成されたことを表しています。

route get 'articles/index'

という出力がありますが、これはconfig/routes.rb にルーティングの定義が自動追加されたということを表しています。 ルーティングについては、次節で詳しく学びます。

create    app/views/articles/index.html.erb

という出力は、app/views/articles/index.html.erb が自動生成されたことを表しています。

次にコントローラとビューの定義を詳しくみていきましょう。

app/controllers/articles_controller.rb は次のように定義されています。

class ArticlesController < ApplicationController
  def index
  end
end

Railsのコントローラは必ずApplicationControllerを継承する必要があります。

次に index ですが、特に何も定義はありません。 今回はブラウザにHello Worldと表示させたいので、indexアクションでビューを呼び出す必要があります。 よって次のようなコードでも動かすことができます。

class ArticlesController < ApplicationController
  def index
    # app/views/articles/index.html.erb にあるビューを呼び出す
    render "articles/index.html.erb"
  end
end

しかし、render "articles/index.html.erb" の行は記述しなくても動作します。

これは、アクションの最後に明確なビュー指定がない場合は、Railsが自動的に app/views/articles/index.html.erb を探して出力してくれるためです。ただし、コントローラ名/アクションとビューのファイルパスは合わせておく必要があります。

ArticlesController#index (= ArticlesControllerのindexアクション) ならば、 render省略時は app/views/articles/index.html.erb を自動的に探して利用してくれます。 例えば ProductsController#new というコントローラ/アクションを定義した場合は、 render省略時はapp/views/products/new.html.erb を利用します。

Railsでは 設定より規約(CoC) というアプローチを採用しています。 前述したように、ファイルの配置場所やコントローラ名/ビューの名前の付け方に一定の規則をもたせることで、コードの記述量を減らすことができます。

次にapp/views/articles/index.html.erb を見てみます。 ビューは今回は ERB(eRuby) と呼ばれる、HTMLにRubyスクリプトを埋め込むことができるテンプレートライブラリを使って記述します。

Hello Worldと表示したいだけなら、特にRubyスクリプトを入れ込む必要はないので、以下のようにindex.html.erbを編集します。

<p>Hello World</p>

ブラウザで http://0.0.0.0:3000/articles/index にアクセスしてみましょう。

2.2.5. ルーティングを理解する¶

RailsのルーティングはRESTfulなインターフェースを簡単に定義できるように作られています。

2.2.6. データベースから記事を取得する¶

2.2.7. 記事一覧を表示する¶

<%= %> と <% %> の違い

2.2.8. 記事詳細を表示する¶

2.2.9. 画面から記事新規作成をできるようにする¶

2.2.10. 画面から記事の更新ができるようにする¶

2.2.11. 画面から記事を削除する¶

2.2.12. デザインを整える¶

Layoutの説明

2.2.13. まとめ¶

足りない機能

• Validation