Ruby on Rails Ⅳ 4章 プロフィール画像を表示しよう
20170305@home Progate | プログラミングの入門なら基礎から学べるProgate[プロゲート]
目次
画像を表示しよう
ゴールは、ユーザがプロフィール画像を登録して、ユーザのページで表示できるようになること。
image_tag
画像を表示するにはimage_tag
ヘルパーを使う。画像ファイル名を指定すると、app/assets/images
の中にある画像を表示しれくれる。
→さらにフォルダを分けたりしたら、どうなる?
画像を保存する準備をしよう
ユーザごとにプロフィール画像を登録できるよう、userテーブルにimageカラムを追加する。
画像はpublicフォルダを作ってそちらに保存する。
画像をアップロードするしくみ
file_field
ヘルパーを使う。よく見る「ファイルを選択」ボタンの付いているアレが実現できる。
画像を保存しよう
スライドが「コードはこうです。」でさらっと流れてしまった。。
インスタンスメソッドを定義しよう
画像を保存するコードを、createでもupdateでも使いたいので、インスタンスメソッドとして定義する。
ここで「あれ?コードを使いまわしたいときに使うのはパーシャルじゃなかったの?」という疑問が出そう。
- パーシャル:ビューファイルのコードの一部分を抜き出したもの
- インスタンスメソッド:そのインスタンスに対していろんな場所で使いたい共通処理だから、モデルの中でメソッドとして定義すればいい
かと。
(こういう点を頭でわかったつもりで放置しないで、後輩に説明できるレベルで理解するのが大事な気がした)
プロフィール画像を表示しよう
ユーザ一覧で、画像を登録しているユーザはその画像を、登録していないユーザはデフォルト画像を表示する。
ヘルパーを作る
ユーザが画像を登録しているかどうかで出し分ける部分のコード、毎回書くのは面倒。
画像表示は複数箇所で行いたいので、ビューで使う画像表示部分のコードをヘルパーにまとめる。
※「何度も使うコードは一つにまとめる」という目的を果たすために、パーシャルなのかインスタンスメソッドなのかヘルパーなのか、説明が欲しいところ。 端折ってるけど、多分説明必要。
今回作ったimage_for
が受け取るのはユーザーオブジェクト。途中まで間違えてimageを受け取ろうとしていた。
今回の勉強時間:43分 累計勉強時間:11時間27分
Ruby on Rails Ⅳ 3章 renderを使いこなそう
20170305@home Progate | プログラミングの入門なら基礎から学べるProgate[プロゲート]
目次
パーシャルにオブジェクトを渡そう
まず「パーシャルってなんだっけ?」を思い出す。
Ruby on Rails Ⅲ 2章 scaffoldのコードに近付けよう(2) - 10000hの技術メモ
共通するコードをパーシャルにまとめておいて、別の場所から呼び出せる。そうなると当然、パラメータを渡したくなる。
パーシャルへのオブジェクトの渡し方
<% @notes.each do |note| %> <%= render 'notes/note', note: note %> <%end %>
noteという単語がたくさん出てくるので、どのnoteが何を表しているのか意識しましょう。
↑確かに初見だからかものすごく困ってます(もっとわかりやすく名前変えるというのはできないんでしょうか・・・)
renderの特殊な使い方
- 配列のrender
※これ要復習。
今回の勉強時間:15分 累計勉強時間:10時間44分
Ruby on Rails Ⅳ 2章 ユーザーと投稿を結びつけよう
20170305@home Progate | プログラミングの入門なら基礎から学べるProgate[プロゲート]
目次
migration
ユーザーと投稿を結びつけたい。ユーザーはidを持っているので、notes
テーブルにuser_id
カラムがあれば判別できるはず。
migrationとは
データベースのテーブルやカラムなどの構造を変更できる仕組み
rails g migration add_user_id_to_notes user_id:integer
を実行すると、migrationファイルが生成される。
上の例だと、user_id
カラムをnotes
テーブルに追加する、というmigrationファイルが自動生成される。
ファイル名自体は任意なので、このフォーマットに従わずに作ることも可能。
rake db:migrate
rake db:migrate
を実行すると、migrationファイルの中身をDBに反映できる。
いままで実行していたのは、rails g model
やrails g scaffolr
で自動生成されたmigrationファイルをDBに反映するためだった。
user_idを保存しよう
フォームでnoteを作成する際に、user_idも一緒に入力・送信できるようにする。
note作成時にuser_idを必須にするよう、コントロールを変更。ストロングパラメータを思い出す。バリデーションも。
ユーザーの投稿一覧を表示しよう
userのshowページに、そのuserの投稿一覧を表示する。
whereメソッド
@notes = Note.where(user_id: @user.id)
一対多
has_many
とbelongs_to
(※これ便利だけどちゃんと理解しないといけないやつだ。他のも読んで理解)
一対多もそうだし、ファイル間のデータの受け渡しがまだまだ難しい。@付け忘れたりする。
今回の勉強時間:35分 累計勉強時間:10時間29分 (10時間突破!)
Ruby on Rails Ⅳ 1章 ユーザーをscaffoldしよう
20170304@home Progate | プログラミングの入門なら基礎から学べるProgate[プロゲート]
目次
ユーザーをscaffoldしよう
(scafflodする、は動詞なんだ・・・。)
ユーザを作成する
$ rails g scaffold User name:string email:string $ rake db:migrate
ユーザを作ったら、あとはユーザーページを作ったりログイン機能つけたりログイン時のバリデーションとかするんだろうな、とこの時点で想像。
これだけでユーザの追加・編集・削除が出来るように。確かにscaffold便利。
ユーザーのバリデーション
name
, email
の値が存在する場合に保存するようにする。
また、uniqueness
を使って、同じメールアドレスのユーザが登録されないようにする。
validates :name, presence: true validates :email, presence: true, uniqueness: true
短いけどキリが良いのでここまで。
今回の勉強時間:10分 累計勉強時間:9時間54分
Ruby on Rails Ⅲ 2章 scaffoldのコードに近付けよう(2)
20170303@home Progate | プログラミングの入門なら基礎から学べるProgate[プロゲート]
目次
form_for
form_for
ヘルパーを使うと、form_tag
ヘルパーを使うときと比べてより簡単に作ることができる・・・?
form_for
の書き方は
<%= form_for(インスタンス) do |f| %> <% end %>
f
のところは、こう書く。
form_forの中身を書こう
`form_forの中身のフォームも、ヘルパーで簡単に書けるらしい。
例えば
<%= form_for(@note) do |f| %> タイトル <%= f.text_field :title, class: "form-control" %> 内容 <%= f.text_area :content, class: "form-control" %> <%= f.submit "保存", class: "btn" %> <% end %>
パーシャルを作ろう
小林製薬のパーシャルデント 消臭洗浄 108錠 入れ歯洗浄剤 部分入れ歯用
- メディア: ヘルスケア&ケア用品
new.html.erb
では@note
がデータベースに保存されていなかった。(これから新規に作るので)
→じゃあedit.html.erb
だったら?既存の@note
のタイトルとコンテンツを引っ張ってこないといけない。
form_for
の引数オブジェクトが既にDBに保存されている場合、create
アクションではなくupdate
アクションへのパスが自動的に設定される。
つまり、editのほうでは何か違った書き方をしなければいけないわけではない。
そのため、new.html.erb
とedit.html.erb
のコードのうち、form_for
の部分が全く一緒になる。それならまとめたい。
そこでパーシャル
ビューファイルのコードの重複を取り除いたり、見やすくしたりするために、コードの一部分を抜き出したファイルのことを「パーシャル」と呼びます。
なるほど。
- パーシャルのファイル名はアンダーバーから始まる。
- パーシャルはrenderメソッドで
render 'フォルダ名/パーシャル名'
で。
updateメソッド
フォームの送信先のupdateアクション、scaffoldで生成されたほうはupdateメソッドを使っている。
updateメソッドは
update(title: 値, content: 値)
のように、引数にハッシュをとることができる。
クリアー。
今回の勉強時間:45分 累計勉強時間:9時間44分
Ruby on Rails Ⅲ 2章 scaffoldのコードに近付けよう(1)〜サクセスメッセージを表示しよう
20170302@home Progate | プログラミングの入門なら基礎から学べるProgate[プロゲート]
目次
サクセスメッセージを表示しよう
投稿が成功したらメッセージを出す。
やり方は、redirect_to
の第二引数にnotice
を指定する。
ということは、notice
以外にも色々あるんだろうなーと思い、さらっとググる。
まだやれるけど、章が終わってキリがいいのでココまで。
今回の勉強時間:7分 累計勉強時間:8時間59分(おしい!!)
Ruby on Rails Ⅲ 2章 scaffoldのコードに近付けよう(1)〜フォームに初期値を入れよう - エラーメッセージを表示しよう
20170301@home Progate | プログラミングの入門なら基礎から学べるProgate[プロゲート]
目次
フォームに初期値を入れよう
前にやった気もするけれども、今回は「バリデーションチェックを通らなかったときに、さっき入力していた値をフォームに入れておこう」という趣旨。
saveに失敗した時の初期値
createアクションで@noteに値がセットされているので、@note.title
で初期値を表示できる。
newアクションを経由した場合の初期値
newアクションで中身が空の@noteを定義する
・・・演習がコピペで終わった
エラーメッセージを表示しよう
何がダメでやり直しさせられてるのか、ユーザにお知らせしたい。
バリデーション失敗時、エラーメッセージは同時に作られる。(!)
内容は
@note.errors.full_messages
に入っている。
取得の仕方
<% @note.errors.full_messages.each do |message | %> <%= message %>
こんな感じ。
full_messages
以外のメソッドはどんなのがあるの?という疑問が出て少し調べたのでメモ。
参考:Active Record バリデーション | Rails ガイド
「エラーが一つでもあれば表示する」の書き方
<% if @note.errors.any? %> <% end %>
エラーメッセージを出すと、「なんかそれっぽいものが出来てきた」という気になれるので良い感じ。 見た目もbootstrapで綺麗だし。
今回の勉強時間:16分 累計勉強時間:8時間52分