Rails 投稿一覧ページ作成
今日は昨日に引き続きTwitterクローンアプリの作成をやりましたが、どうでもいいところでつまづいたりして投稿の新規作成(ProgateでいうところのRails Ⅲ章)までしか出来ませんでした…泣
今日実装出来たのは、
- 投稿一覧ページの作成
- 投稿詳細ページの作成
- 新規投稿ページの作成
その中から今日は復習も兼ねて投稿一覧ページ作成の一連のの流れを書いていきます(ターミナルで行うコマンドは青色で書きます)
最初に
昨日の続きでルーティングは
get 'profile' => 'profile#index'
get 'about' => 'profile#about'
コントローラは
def index
end
def about
end
ビューはindex.html.erbのみになります。
これらはトップページを表示するためのものになります。
投稿一覧ページ
投稿一覧ページを作成する際に、まず新しいコントローラを作る必要があるのでターミナルで
rails g controller posts index
と入力します
そうするとposts/index のルーティング、コントローラ、ビューが作成されて、投稿一覧を作成するための土台が出来ました。
そうすると今度は投稿の情報を送信して保存したり、引き出したりするためのDB(データベース)にマイグレーションファイルの作成をする必要があります
こちらを入力したら、DBの変更が行われたのでDBの変更があった場合は忘れずに
rails db:migrate
を入力しこれで投稿の情報が表示出来る準備が整いました
投稿の作成はターミナルで
rails console
を起動し、
post1(好きな変数) = Post.new(content(カラム名): '好きなものを代入する')
を入力し、
post1.save
を入力して投稿を保存します
DBを扱う時はデータの変更がある度に保存コマンドを入力してください(ファイルを上書き保存する際のcommand+Sのように)
次はDBに保存された投稿データを全て取得するためにまずコントローラに
def index
@posts = Post.all
end
と定義します。
そして投稿が一覧で表示されるようにビューの'posts/index.html.erbファイルに
<% @posts.each do |post| %>
<div 〜 >
<%= post.content %>
</div>
<% end %>
を入力したら投稿一覧は完成です！
(post.contentのcontentはここではDBに保存されてるカラム名で情報の中身を表しています)
写真や画像が無いせいでわかりにくくてすみません😔
一応今日の記事は備忘録的なものなので…(言い訳)
もし気が向いたらProgateのRailsチュートリアルを全て書いていきたいです
本日も読んでくださりありがとうございました！
ではまた明日
追伸
本当はⅤ章の投稿情報の編集&削除まで実装したかったですが、出来なかった言い訳を聞いてください。
- 睡眠不足により途中から集中が出来なかった
- HTML&CSSが思った通り書けずに時間が凄くかかった
- サイトデザインを考えだすとこれまた時間がとてもかかる
HTML&CSSとかはLPですらまともなものを作れないので模写とかして練習する必要がありますね…
(特に苦手なのは親要素と子要素によるあらゆる数値の指定やポジションの変更とか)
