人生57日目
HAGIRE(3)
今日はdeviseとActive Storageにいじめられた。
privateメソッドのテスト
「send」メソッドを使う。
equire 'test_helper' class UserTest < ActiveSupport::TestCase def setup @maehara = users(:maehara) @konishi = users(:konishi) end test "followとunfollowの動作確認" do assert_not @maehara.send(:following?, @konishi) @maehara.send(:follow, @konishi) assert @maehara.send(:following?, @konishi) @maehara.send(:unfollow, @konishi) assert_not @maehara.send(:following?, @konishi) end end
deviseがあるとuserモデル下が全部privateになるっぽかった。
follow機能のテストもかけたし、Railsチュートリアルでsendの存在を知っててよかった。
ActiveStorageでattached?がfalseになる（2019年9月14日追記）
画像自体はハッシュ化されてるのに何でだろうと思ってたら解決した。と思ったらしてなかった。
class BuriburipostsController < ApplicationController def create @buriburipost = current_user.buriburiposts.build(buriburipost_params) #このままだと画像なしで投稿するとエラーになる @buriburipost.pictures.attach(params[:buriburipost][:pictures]) if @buriburipost.save flash[:success] = "投稿しました！" redirect_to root_url else render "static_pages/home" end end
以下のようにするとうまくいく。
def create @buriburipost = current_user.buriburiposts.build(buriburipost_params) if pictures = params[:buriburipost][:pictures] @buriburipost.pictures.attach(pictures) @buriburipost.save flash[:success] = '投稿しました！' redirect_to root_url elsif @buriburipost.save flash[:success] = '投稿しました！' redirect_to root_url else render 'static_pages/home' end end
最初のコードだと、picturesが必ずattachされてしまうので、例えばビューで
<% if post.pictures.attaced? %> <%= image_tag post.pictures %> <% end %>
のようにしている場合でも条件式がtrueになって、image_tagのリンクが空のため例外が発生する。
「attachする＝画像が存在している」っていうことらしい。
「画像アップロードしなければpicturesはnilだし関連付けされない」と思っていたけど、「pictures」には「関連付けされているかどうかを確認するための情報」が入っているため、nilにはならない。
そのため、if @buriburipost.pictures.nil?のようにして条件分岐ができない。（ここで3時間くらいハマった）
「Active Storageで指定したカラムは毎回関連付けされるため空にならない。」ということっぽい。
そこで、if pictures = params[:buriburipost][:pictures]として、picturesの中身とフォームの送信情報を比較して、一致していればattachする、一致しない場合はそのままsaveするようにしたら期待通りに動いた。
しかもこれ最初に読んでたQiitaに親切にも書いてくれてた。ほんと恥ずかしい。
【Rails 5.2】 Active Storageの使い方 - Qiita
要素の配置も終わってきたので、あと機能を１つ追加すればHTMLとCSSに取りかかれそう。頑張ろう。
あ、認可モデルがまだできてない。そもそも設計って難しすぎないか？なにも作ったことないから、なにが必要なのかもわからず、一応書き出してはいるものの抜けが多い。
人生56日目
HAGIRE(2)
Buriburipost modelを作成。アソシエートも問題なし。
CarrierWaveで画像アップロードを試そうとしたが、ActiveStorageとかいうものがあったのでせっかくなので使ってみた。
外部ライブラリ使わずにアップロードできるってすごいなあ。
紆余曲折を経てAWSのS3にアップロードできるようになった。
今日お世話になったサイト
いつも忘れる「Railsのgenerateコマンド」の備忘録 - maeharinの日記 deviseで作成したUserモデルにusernameカラムを追加してDBへ登録できるようにする - Qiita 【Rails 5.2】 Active Storageの使い方 - Qiita 【Rails】Herokuで画像を投稿できるようにする方法（ActiveStorage + Amazon S3） - Qiita git add - Gitコマンド | WWWクリエイターズ
人生55日目
HAGIRE.(1)
静的ページを作ってdevice gemを導入した。
これ頭おかしいよ強力すぎる。
一瞬でログイン機能を実装してしまった。
強力すぎて内部がどうなっているかわからないので、好きなように弄りにくいのが難点。
特にflashメッセージのコントロールが普通にはできないため、常にページ上部に余白が発生してしまう。
なので、一旦諦めてエラーメッセージなどは自分で定義したものを使うことにした。
あと、強力すぎるのでまずはdeviseを導入してから他の部分作るべきですね。
名前つきルートもチュートリアルとはずいぶん違ってしまうようなので、$ rails routesしながら確認していこう。
Bootstrap
これも便利すぎる。最初はフルスクラッチで書いてたからなあ。
だんだん慣れてきて、仕組みがわかってきた。
グリッドレイアウトは以前サイトを作った時に触っていたので、Bootstrapのグリッドの使い方も分かって楽しい。
特にこちらはheightを自動調節してくれたり、要素と要素の隙間をいい感じに取ってくれるので強い。
画像に緑の枠があるのは、containerクラスがわかりやすいように、borderを指定しているためです。
本文が決まってない部分にはクラス名を入れて、動きがわかりやすいようにしてます。
containerのなかの要素は、
<div class="container"> <div class="row"> <div class="col-xs-6 col-lg-4"> <div class="box"> <p> 健康な人のうんちは80％が水分で、残る20％のうち3分の1が食べカス、3分の1が生きた腸内細菌、3分の1が剥がれた腸粘膜です。 <br> だから、うんちを見れば健康状態がわかる。 <br> 自分の出したうんちがどうだったか確認しましょう。 </p> </div> </div> <div class="col-xs-6 col-lg-4"> <div class="box">col-xs-6 col-lg-4</div> </div> <div class="col-xs-12 col-lg-4"> <div class="box">col-xs-12 col-lg-4</div> </div> </div> </div>
このようにカラムを指定しているクラスの中にboxクラスを作って、そこにborderを適用することで各要素の大きさがわかります。（茶色い枠のこと） 自分で書くのって本当に楽しい！
早速Gitでやらかす
git cleanしたら必要なものまで消えちゃって作り直す羽目になった。マジで気をつけよう・・・。
まとめ
Git気をつける
Bootstrapすごい
Devise怖い
HAGIRE.（定期更新）
HAGIREとは
「うんちの歯ぎれ報告サイト」
排便から、健康を考えるきっかけを作る。
動機
うんちのこと真面目に考えたことなかったので。（快食快便）
機能（実装予定）
- 投稿機能
短い文章を投稿できる。ツイートみたいなもの。 - フォロー機能
ユーザーをフォローすることで自分の投稿一覧にフォローしたユーザーの投稿を表示。 - HAGIRE機能
投稿に歯ぎれ具合を含めることができる。
HAGIREアイコンをクリックして選択する。
選択したHAGIREアイコンに応じて、投稿の背景が変わる。 - HAGIRE一覧機能
HAGIREアイコンそれぞれにカラーを設定し、確認できる。
Gitのコミットすると緑が付くやつみたいなのを実装したい。
データモデル
| user | ||||||||
|---|---|---|---|---|---|---|---|---|
| id | name | password-digest | image | activate | activated_at | activation-digest | reset-digest | |
| int | str | str | str | str | boolean | datetime | str | str |
| buriburipost | ||||||||
|---|---|---|---|---|---|---|---|---|
| id | user_id | content | picture | hagire | ||||
| int | int | text | str | int | ||||
| Relationship | ||||||||
|---|---|---|---|---|---|---|---|---|
| following_id | followed_id | |||||||
| int | int | |||||||
HAGIRE機能の実装方法
HTML(erb)内でif文使って分岐？
となるとHAGIREアイコンの数*3行ほどコードが長くなるのでスマートじゃない気がする。
要検討。
いしゅー
何か問題が起きたらここに記す
