見出し画像

Railsプロジェクト作成

プロジェクトを作成し、データベースへのカラムの保存方法や更新方法であるCREDのやり方を学んでいきたいと思う。

モデル操作

Railsコンソール
Linuxコマンドのようにその場でタイプすることで実行する方法
Rails c
[1] pry(main)>は、ターミナルの$に相当する「プロンプト」と呼ばれるもので、自動的に出力される

モデルを作成、更新、削除する

・new
モデルを作成していきます。モデルの作成は、newメソッドで行うことができる
[1] pry(main)> user = User.new
=> #<User:0x007fb84e6a47b8
id: nil,
name: nil,
email: nil,
created_at: nil,
updated_at: nil
newメソッドを引数(パラメータ)なしで実行した場合は、全てのカラムにnilが入ったオブジェクトが返ってくる
newメソッドは引数にカラムを渡すことも可能
・save
newメソッドで生成したモデルは、そのままではデータベースに保存されないデータベースに保存するためには、saveメソッドを実行する必要
先ほどのUser.newに続けて、以下のコードを実行
[3] pry(main)> user.save
(0.2ms) BEGIN
SQL (3.3ms) INSERT INTO `users` (`name`, `email`, `created_at`, `updated_at`) VALUES ('test', 'test@test', '2017-10-17 11:02:09', '2017-10-17 11:02:09')
(1.3ms) COMMIT
=> true
saveメソッドは、* saveに成功するとtrue* saveに失敗するとfalse
・create
createメソッドでは、モデルの生成と保存を同時に実行
newメソッドとsaveメソッドの合わさったもの
・update
updateメソッドは、データを更新
・destroy
destroyメソッドは、データを削除

モデルを検索する

・find
findメソッドはモデルをidで検索
・find_by
id以外のカラムで検索を行うためには、find_byメソッド
User.find_by(name: 'test2')
・all
allメソッドは、全てのレコードを取得
User.all

登録フォームを作る

Userの登録フォームを作っていく
app/views/users/new.html.erb
<div class="users-new-wrapper">
<div class="container">
<div class="row">
<div class="col-md-offset-4 col-md-4 users-new-container">
<h1 class="text-center text-white">Sign up</h1>
<%= form_for @user do |f| %>
<div class="form-group">
<%= f.label :name, class: 'text-white' %>
<%= f.text_field :name, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :email, class: 'text-white' %>
<%= f.text_field :email, class: 'form-control' %>
</div>
<%= f.submit "登録", class: 'btn-block btn-white' %>
<% end %>
<%= link_to 'ログインはこちら', '#',class: 'text-white' %>
</div>
</div>
</div>
</div>


app/assets/stylesheets/custom.scss
.form-control {
height: 45px;
}
.users-new-wrapper {
width: 100vw;
height: 100vh;
background-image: image-url('bg-top.png');
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background-color: #464646 ;
.users-new-container {
padding-top: 220px;
.form-group {
margin-bottom: 20px;
}
}
}

ユーザーの新規作成ページへ飛ぶように、トップページにある「Sign up」のリンクを変更
app/views/pages/index.html.erb
<div class="top-hero-wrapper text-center">
<div class="container top-hero-container">
<h1 class="text-white">Make you Happy</h1>
<h2 class="text-white">Pictgram is a service that you can post photos.</h2>
<div class="row">
<div class="col-md-offset-3 col-md-3">
<%= link_to 'Sign up', new_user_path, class: 'btn btn-block btn-white' %>
</div>
<div class="col-md-3">
<%= link_to 'Log in', '#',class: 'btn btn-block btn-white' %>
</div>
</div>
</div>
</div>

フロント側のコードは完了

form_for

formを作るためのメソッド
form_for モデルオブジェクト do |f|
end
のように「form_for モデル do |f|」と「end」で囲うことで、そのモデルのフォームを作成可能
form_forで入力したデータを送信するには
f.submit
を使用
エラーが起きるのは
form_forに渡しているインスタンス変数(@user)が存在していないため、サーバー側のコードを変更
app/controllers/users_controller.rb
class UsersController < ApplicationController
def new
@user = User.new
end
def create
end
end
form_forでUserに紐付いたformを作りたいので、Userをインスタンス変数に保存する必要
config/routes.rb
Rails.application.routes.draw do
root 'pages#index'
get 'pages/help'
resources :users
end

resources :users

このコードは結果として以下のようなルーティングが一括生成される
HTTP動詞
URL コントローラー#アクション
GET | users | users#index |
GET | users/new | users#new |
POST | users | users#create |
GET | users/:id | users#show |
GET | users/:id/edit | users#edit |
PATCH | users/:id | users#update |
DELETE | users/:id | users#delete |
一覧、詳細、作成、更新、削除といったWebサービスに必要なルーティングが一括で生成

レコードの保存

先ほど述べたようにsaveメソッドを使用しないとレコードは保存されない
createアクションの中で、saveメソッドを呼び出す必要
app/controllers/users_controller.rb
def create
@user = User.new(name: params[:user][:name], email: params[:user][:email])
if @user.save
redirect_to root_path
else
render :new
end
end
・redirect_to
redirect_toメソッドは、指定したPATH(URL)に転送
PATHはターミナルで、rails routesコマンドをタイプして表示される一覧から、Prefixに_pathをつけたもの
root(/)に転送させたい場合は
redirect_to root_path
users#editに転送させたい場合は
redirect_to edit_user_path
・render
rednerで呼び出すViewを指定
if @user.save
redirect_to root_path
else
render :new
end
上記のコードだと@user.saveが失敗すると、render :newが走り、newアクションのviewが読み込まれ
・params
paramsは、viewでフォームに入力された情報が入っている変数のこと
・binding.pryで値を確かめる
paramsの値を「binding.pry」を使用して、確認します。binidng.pryは、そのコード部分で処理を止めるための機能

モデルの作成を行うためのメソッドを学んだ。resources :usersは便利でルーティングやPrefixまで基本的なところを包含してくれるが、慣れていないのでホワイトリスト形式で全て記載した方がいいなと個人的には思いました。
主流派スマートに再生可能な方が好まれていくので、このやり方に慣れていきたいと思う。
データベースの中身を閲覧しながら何が入っているかを確認する必要があるので、間違えないようにしていきたい。

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