見出し画像

(2)Railsで簡単なメモアプリを作ってみる

今回はモデルの作成とフォームの作成を行い
実際にデータベースに情報を保存できるようにします。

モデルの作成

rails g model post

スクリーンショット 2020-06-24 8.45.30

migrateファイルやmodel/post.rbが作成されました。
db/migrate/~~_create_posts.rbはデータベースの設計図のようなもので
このファイルの中身を弄ってmigrateコマンドを入力することにより
データベースが定着し、使えるようになります。

db/migrate/20200623234501_create_posts.rb

class CreatePosts < ActiveRecord::Migration[5.2]
 def change
   create_table :posts do |t|
     t.text :content  ・・・ここを追加
     t.timestamps
   end
 end
end
rails db:migrate

スクリーンショット 2020-06-24 8.53.55

このようにcreate_tableとでればOKです。

migrateファイル確認方法

migrateをしたけどカラム名が間違っていた!
型の指定が違った!なんて時はすぐに削除したりするのはNGです。
schema.rbというファイルの中身とデータベースの情報に差異が生まれ
エラーが出てしまうからです。

rails db:rollback
rails db:migrate:status

スクリーンショット 2020-06-24 8.59.01

上記の2つのコマンドをターミナルで入力すると
Statusがdownになっていることが確認できると思います。
これはrails db:create前に戻したよという意味なので
migrateファイルを修正して、もう一度migrateしなおせばOKです。

rails db:migrate

スクリーンショット 2020-06-24 9.01.37

Sequel Proでもpostsテーブルがあることを確認できました。

テーブルにデータを保存する

テーブルにデータを入れる方法はいろいろあります。

・Sequel Proに直接入力
・コンソールから挿入
・seed.rbに記入して流し込む

しかし今回はフォーム作ってそこから入れる方法でいきます。
テスト無しのぶっつけ本番って感じですね。

投稿ページの作成

app/views/memo/new.html.haml

<h1>投稿ページ</h1>
 <%= form_tag('/posts', method: :post) do %> 
 <input type="text" name="content"> 
 <input type="submit" value="投稿する">
<% end %>
<%= link_to 'トップページ', '/' %>

スクリーンショット 2020-06-24 9.14.32

http://localhost:3000/memo/new
こちらにアクセスすると上記のようなフォームができていると思います。
今のままでは、投稿してもデータを定着させる記述がないため
エラーが出てしまいます。

投稿を保存する設定(createアクション)

def create
   Post.create(post_params)
   redirect_to root_path
end

private
def post_params
 params.permit(:content)
end

createアクションで投稿を定着させます。
(post_params)というメソッドをprivate以下に書くことにより
他のアクションでも使い回しが利くようになり、便利です。
redirect_toという記述がありますが
こちらは、保存した後にどこに遷移するかを指定できます。
今回はトップページに戻りたいので、root_pathとしています。

スクリーンショット 2020-06-24 9.36.42

config/routes.rb

Rails.application.routes.draw do
 root to: "memo#index"
 resources :memo, only: [:new, :create]
end

resourcesにcreateを追加します。

app/controllers/memo_controller

def index
   @posts = Post.all
 end

トップページでpostテーブル情報が呼べるように@postsに代入します。
@posts :代入先
Post.all :Postテーブル情報を全て取得

app/views/memo/index.html.erb

<h1>Memo app</h1>
 <% @posts.each do |post| %>
 <ul>
     <li>
       <%= post.content %>
     </li>
 </ul>
<% end %>
<%= link_to '新規投稿', '/memo/new' %>

postテーブルに保存されている内容を全て取り出して表示します。
縦並びに表示したいので、<ul><li>で囲んでいます。
こちらはの表示方法はお好みで大丈夫です。
https://gyazo.com/b55bf707bce8a1bdc4564a81ab6654d0

これで一通りの投稿機能の実装が終わりました。
次回は編集機能を追加したいと思います。

 → (3)Railsで簡単なメモアプリを作ってみる

ここまで読んでいただきありがとうございます。
間違いがあれば指摘していただけると助かります。

この記事が気に入ったらサポートをしてみませんか?