心はいつも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

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

  関連記事

MicrosoftのFutureVision 2019 vs 2011 vs 2010

Wiredで取り上げられたので、今日はMSのFutureVisionが話題でした …

パーフェクトRuby 2章Rubyの基礎 2-6 モジュール

p57 2-6 モジュール 2-6-1モジュールの定義式 モジュールはインスタン …

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

6.3セキュアなパスワードを追加する、です。 パスワードはセキュアであるべきと思 …

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

9.2認可、です。 自分以外の人が自分のProfileを変更できないようにします …

iPad使用前/使用後、雑感。

5/28にiPadがAppleStoreからクロネコヤマトで届けられました。 週 …

no image
railsのエラーメッセージを日本語化

message:で渡すエラーメッセージや、その他いろんな箇所を日本語化します。 …

MacにGUIのSQLite3クライアントを入れる。

ターミナルからコマンドたたけばいいだけですが、DBスキーマをちょっと確認したいと …

no image
ToDoの管理方法

東大生はノートがきれいだとか、、 きれいに書いている暇があったら、頭に書いて覚え …

Objective-C苦節3ヶ月アプリ作れるようになった

このブログairpucci.comのメニューにアプリ開発追加しました。 昨年秋よ …

no image
Rubyの%を使う記法のうち、 %w

Rubyで%を使う記法は、たのるー(たのしいRuby)によると、以下の6通り % …