Ruby on Rails5 Ⅱ

投稿一覧ページを作成しよう
postsコントローラの作成
rails generate controller
一覧ページを作成する時は、indexというアクション名を使用することが一般的なので、indexアクションを用意しましょう。
今回は新しくpostsコントローラを作成するので、左の図のようなコマンドを実行することで、作成することができます。
また、「rails generate controller」は「rails g controller」と省略することができます。

rails generate controller posts index

変数を使って表示しよう
viewファイル内で
変数を定義する
erb<% %>
index.html.erbのようなerbという形式のファイルでは、以下の図のように<% %>で囲むことで、HTMLファイルの中にRubyのコードを記述することができます。「erb」とは「Embedded Ruby（埋め込みRuby）」の略です。

埋め込むRubyコードをブラウザに表示したい場合には、以下の図のように
<% %>ではなく、<%= %>を用います。

<% %>と<%= %>
<%= %><% %>
ここまでで学んだように、<% %>や<%= %>の中にRubyのコードを書くことができます。
<% %>の場合は何も表示されないので、変数の定義などに用います。
一方<%= %>の場合では、Rubyコードの中身が表示されるため、変数の値などを実際にページ内に表示したい場合に用います。

<% post1 = "今日からProgateでRailsの勉強するよー！" %>
<% post2 = "投稿一覧ページ作成中！" %>

each文で表示しよう
配列を用意しよう
配列
以下の図のように、変数postsを用意し、それぞれの投稿データが入っている配列を代入しましょう。
配列ですので、コンマで要素を区切ることを忘れないようにしましょう。
また、Rubyのコードは以下の図のように、複数行に渡って書くことができます。

<% posts = [ "今日からProgateでRailsの勉強するよー！", "投稿一覧ページ作成中！" ] %>

@変数
変数@
通常、アクションで定義した変数をビューで使用することはできません。
しかし、変数名を「@」から始めることでこの変数は特殊な変数となり、ビューファイルでも使用することができます。
ですので、アクションで定義したビュー用の変数には「@」をつけ忘れないようにしましょう。

class PostsController < ApplicationController def index # viewで定義していた配列postsを@postsという変数名で定義してください @posts = [ "今日からProgateでRailsの勉強するよー！", "投稿一覧ページ作成中！" ] end end データベースの仕組み テーブルレコードカラム データベースは下の図のような表でデータを管理しています。その表のことを「テーブル」と呼びます。下の図は投稿データを扱うための「postsテーブル」で、横の行が１つ１つの投稿データになっています。 また、縦の列のことを「カラム」、1行ずつのデータのことを「レコード」と呼びます。 テーブル作成の準備 マイグレーションファイルrails g model まずは、マイグレーションファイルと呼ばれる、データベースに変更を指示するためのファイルを作成しましょう。右の図のようなpostsテーブルを作成するマイグレーションファイルは「rails g model Post content:text」というコマンドで作成することができます。 また、「text」は「長い文字列」を意味しており、contentカラムにどのようなデータが入るかを意味しています。 マイグレーションファイルが作成される場所 マイグレーションファイル 先ほどのコマンドを実行すると、下の図のようにdb/migrateフォルダの下にマイグレーションファイルが作成されます。 ファイルには右の図のようなデータベースへの変更内容が定義されていますが、コマンドによって自動生成されたものなのでここでは理解する必要はありません。 rails db:migrate マイグレーションエラー Railsでは、データベースに反映されていないマイグレーションファイルが存在する状態で、どこかのページにアクセスすると以下のようなマイグレーションエラーが発生してしまいます。そのため、マイグレーションファイルを作成した場合は必ず「rails db:migrate」を実行する必要があります。 Postモデル ApplicationRecordモデル 「rails g model」コマンドによって、Postモデルが定義されたファイル「post.rb」が、app/modelsフォルダの中に作成されています。 ファイルの中には、右の図のようにApplicationRecordクラスを継承する Postクラスが定義されています。 このようにApplicationRecordを継承したクラスをモデルと呼びます。 rails g modelコマンドのまとめ rails g modelrails db:migrate ここで改めて「rails g model」コマンドについて見てみましょう。 「rails g model Post ...」の「Post」の部分には、実はモデル名を指定します。 そして、このコマンドによって、以下の2つのファイルが作成されます。 ・app/modelsフォルダにモデルが定義されたファイル ・db/migrateフォルダにマイグレーションファイル rails consoleの使い方（１） rails console ターミナル上で「rails console」と入力し実行（Enter）することで、コンソールを起動することができます。コンソールを起動した状態で、「1+1」を実行すると、その実行結果が表示されます。 また、「quit」を実行すると、コンソールを終了することができます。 saveメソッド save 作成したPostインスタンスをpostsテーブルに保存するには、saveメソッドを使います。saveメソッドを使うことができるのはPostモデルがApplicationRecordを継承しているためです。 rails console post1 = Post.new(content: "今日からProgateでRailsの勉強するよー！") post1.save post2 = Post.new(content: "投稿一覧ページ作成中！") post2.save quit テーブルから投稿データを取り出そう post = Post.first post.content 配列のデータから投稿内容を取り出す Post.all[0] で取得したデータは、Post.first で取得したときと同じ形のデータなので、 Post.all[0].content とすることで、投稿内容を取得することができるぞ。 posts = Post.all posts[0].content posts[1].content post3 = Post.new(content: "やっぱりプログラミングは楽しい！") post3.save 共通のレイアウトをまとめる Railsでは、「views/layouts/application.html.erb」に共通のHTMLを書いておくことができます。 初期状態でも、タグやタグなどの共通部分はこちらに書かれています。今回は、以下の図のように、ここにヘッダーを追加し、どのページでも共通のヘッダーが表示されるようにしましょう。

レイアウトの仕組み
ビューyieldレイアウト
ここで、共通のレイアウトの仕組みについて見てみましょう。「views/layouts/application.html.erb」には<%= yield %>というコードがあります。top.html.erbなどの各ビューファイルは、この<%= yield %>の部分に代入され、application.html.erbの一部としてブラウザに表示されていました。この仕組みによって、ヘッダーなどの共通のレイアウトを1つにまとめることができます。

link_toメソッド
Rails ではlink_toというメソッドを使うとタグを作成することができるぞ。 link_to メソッドは Ruby のコードなので、「<%=%>」で囲むことに注意するのじゃ。
右の図のように、第一引数に表示する文字を、第二引数に URLを書くことでリンクが作成されるぞ。