心はいつもAirPucci (空元気でもいいから)

毎日がPucciを着ているような気分

RailsTutorial4.0を高速で復習する。10.2章。

   


10.2マイクロポストを表示する、です。

ポストの投稿ではなく、表示だけを先に作ります。

仕様の確認

ユーザープロファイルページ(userのshow)にポストを表示する。

10.2.1ユーザー表示ページの拡張、です。

テストを書く

リスト10.16 ユーザーのshowページでマイクロポストが表示されていることをテストする。
spec/requests/user_pages_spec.rb

require 'spec_helper'

describe "User pages" do
略
  describe "profile page" do
    let(:user) { FactoryGirl.create(:user) }
    let!(:m1) { FactoryGirl.create(:micropost, user: user, content: "Foo") }
    let!(:m2) { FactoryGirl.create(:micropost, user: user, content: "Bar") }

    before { visit user_path(user) }

    it { should have_content(user.name) }
    it { should have_title(user.name) }

    describe "microposts" do
      it { should have_content(m1.content) }
      it { should have_content(m2.content) }
      it { should have_content(user.microposts.count) }
    end
  end
略
end

実装する

リスト10.17 ユーザーのshow画面にマイクロポストを追加する。
app/views/users/show.html.erb

<% provide(:title, @user.name) %>
<div class="row">
略
  <aside>
略
  </aside>
  <div class="span8">
    <% if @user.microposts.any? %>
      <h3>Microposts (<%= @user.microposts.count %>)</h3>
      <ol class="microposts">
        <%= render @microposts %>
      </ol>
      <%= will_paginate @microposts %>
    <% end %>
  </div>
</div>

リスト10.18 1つのマイクロポストを表示するパーシャル。
app/views/microposts/_micropost.html.erb

<li>
  <span class="content"><%= micropost.content %></span>
  <span class="timestamp">
    Posted <%= time_ago_in_words(micropost.created_at) %> ago.
  </span>
</li>

リスト10.19 @micropostsインスタンス変数をユーザーshowアクションに追加する。
app/controllers/users_controller.rb

class UsersController < ApplicationController
略
  def show
    @user = User.find(params[:id])
    @microposts = @user.microposts.paginate(page: params[:page])
  end
略
end

テストはパスします。

10.2.2マイクロポストのサンプル、です。

マイクロポストのデータが無いので試験用に6人分、マイクロポストのデータを作成します。

リスト10.20 サンプルデータにマイクロポスト用のコードを追加する。
lib/tasks/sample_data.rake

namespace :db do
  desc "Fill database with sample data"
  task populate: :environment do
略
    users = User.all(limit: 6)
    50.times do
      content = Faker::Lorem.sentence(5)
      users.each { |user| user.microposts.create!(content: content) }
    end
  end
end
bundle exec rake db:reset
bundle exec rake db:populate
bundle exec rake test:prepare

リスト10.21 マイクロポスト用のCSS (この章全般にわたって使用するCSSも含む)
app/assets/stylesheets/custom.css.scss

.
.
.
/* microposts */

.microposts {
list-style: none;
margin: 10px 0 0 0;

li {
padding: 10px 0;
border-top: 1px solid #e8e8e8;
}
}
.content {
display: block;
}
.timestamp {
color: $grayLight;
}
.gravatar {
float: left;
margin-right: 10px;
}
aside {
textarea {
height: 100px;
margin-bottom: 5px;
}
}

いったんコミットし、次は
10.3マイクロポストを操作する
です。

 - テクニカル ,

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  関連記事

使ったらダメなiPhoneケーブル

iPhoneのApple純正ケーブルって、はげやすくないですか?iPhone5用 …

RailsTutorial4.0を高速で復習する。8.2.1章。

8.2.1[このアカウント設定を保存する]、です。 RailsTutorial4 …

no image
RailsTutorial4.0を高速で復習する。11.2.3章。

11.2.3「フォローしているユーザー」ページと「フォロワー」ページ、です。 仕 …

no image
電源が入らない!MacBookAirが真っ黒になりました。

iPhoneを買ったばかりの頃、iPhoneのメーラーを立ち上げても中身が表示さ …

no image
RailsTutorial4.0を高速で復習する。6.5章。

演習1問目。 リスト6.20の、メールアドレスを小文字に変換するコードに対するテ …

画面キャプチャ系extension

現在メインブラウザはchromeを利用しています。画面キャプチャextensio …

パーフェクトRuby 3章制御構造/メソッド/組み込み関数 3-2 基本的な制御構造

p75 3-2 基本的な制御構造 条件分岐、繰り返し、ジャンプ構文について 3- …

no image
プログラミングから離れた理由を思い出した

私は転職が多く5社で正社員で経験しています。全部IT系なのだけど全部職種が違いま …

no image
iPhone充電3回分?大容量バッテリーで残念がなくなりました

iPhoneは便利なので、一日中使いっ放しの日がよくあります。iPhoneがあれ …

no image
RailsTutorial4.0を高速で復習する。9.1.2章。

9.1.2編集の失敗、です。 テストを書きます リスト9.9 ユーザーupdat …