Ruby onRails (PicTweet) ユーザ登録編
ユーザ登録機能を実装する
ユーザ関連の機能はGemを使用する
Twitterなどのウェブサイトにはログイン機能がある
これはユーザに対してアカウントを発行して、そのアカウントでユーザの情報を管理することができる
今回はヘッダーにログインと新規登録のボタンを配置する
ログインすると、ログインボタンがユーザー名に変わり、登録したユーザー名、投稿するボタンのような配置になるようにする
今回はログインしたユーザーのみがツイートの投稿を行えるようにする。ツイートの閲覧に関してはログインしているかどうかに関わらずできるようにする
1Gemをインストールし、サーバーを再起動
Gemとはユーザー管理機能を簡単に実装するもの
Gemファイルの最後の行をGem deviceに変更
所定のディレクトリにいることを確認して、bundle installでGemをインストールする
ここでターミナルでrails sとcontrol+cでサーバーを再起動しておく
2コマンドを利用し、deviceの設定ファイルを作成
rails g device:installで設定ファイルを作成
rails g deviseはdeviceによるユーザー機能の対象を指定することで、モデルとマイグレーションの生成やルーティングの設定をまとめて処理する
実行すると、モデルが生成され、routes.rbにはdeviceに関するパスが追加される
rails g devise usersでコマンドをユーザーに指定する
補足としてdevice_forはユーザー機能に必要な複数のルーティングを一度に生成するdeviceメソッドである
テーブルを作成する
コマンドで作成されたマイグレーションをrails db:migrateで実行する
rails sでローカルサーバーを再起動しておく
3コマンドを利用し、userモデルを作成
4未ログイン時とログイン時でボタンの表示を変える実装をする
5コントローラーにリダイレクトを設定する
リダイレクト処理を以下で用意する
(3行目)before_action :move_to_index, except: [:index, :show]
(42行目)def move_to_index
unless user_signed_in?
redirect_to action: :index
end
end
デバイスのビューを作成する
rails g devise:views
デバイス用のビューを編集する
app/views/devise/sessisons/new.html.erb
app/views/devise/registrations/new.html.erb
ユーザーテーブルにニックネームカラムをstring型で追加するマイグレーションファイルを作成
rails g migration AddNicknameToUsers nickname:string
作成したマイグレーションを実行
rails db:migrate
ニックネームを入力するためのフォーム部分を追加
サインアップ時に入力する情報はパラメーターとしてサーバーに送信される。deviceを使わない通常のリクエストの場合は、コントローラーにストロングパラメーターを記述し、受け取れるパラメーターを制限していた。
deviceも同様にストロングパラメーターをコントローラーに記述する。しかし、deviceの処理を行うコントローラーはGem内に記述されているため、編集できない。
nicknameというキーのパラメーターを新たに許可する。
ログインの有無で表示を変える
Ruby onRails(PicTweet) ツイートの詳細を表示しよう編
showで詳細表示をする
手順
1ツイート詳細画面よルーティングを記述
詳細画面のパスは編集や削除と同じくツイートごとに管理する
idが1の詳細画面は/tweets/1のようなパスになる
resourcesの最後に:showを追加
コードがスッキリするのでonlyオプションの記述を削除する
2ツイート詳細画面へのリンクを作成
下記で詳細画面へリンクするボタンを追加
<li>
<%= link_to '詳細', tweet_path(tweet.id), method: :get %>
</li>
3tweets_controllerにshowアクションを作成
ツイート詳細画面に必要な情報を、データベースから取得するためにshowアクションを定義
このときshowアクションでは、詳細を表示したいツイートの情報をビューに受け渡すだけ
def show
@tweet = Tweet.find(params[:id])
end
4ツイート詳細画面のビューを追加
tweetsコントローラーのshowアクションに対応する「投稿詳細画面」を作っていく
まず必要なビューファイルをつくり、コードを書く
ここで同じコードをメソッドにまとめる
ここではbefore_actionを利用して、edit、showの2つのアクションの前に実行される、set_tweetというメソッドを定義した
before_action :set_tweet,only: [:edit, :show]
そしてeditとshowの中のコードを消した
まとめとして
resourcesは、7つのアクションのルーティングをまとめて設定できるメソッドのこと
before_actionは、コントローラで定義されたアクションが実行される前に、指定した共通の処理を行うことのできるメソッド
Ruby on Rails(PicTweet) ツイートの編集編
ツイートの編集機能を実装します。editとupdateが該当します。
編集の考え方は「editアクションで編集ページを表示」→「updateアクションでデータの更新」といった流れで実装する。
resourcesでeditを追加することで、編集画面への遷移ができる。
次に編集ボタンを投稿ボタンに追加する。
これは削除ボタンと同じようにlink_toメソッドを使用する。
<li>
<%= link_to '編集', edit_tweet_path(tweet.id), method: :get %>
</li>
次にeditアクションをコントローラーに定義する
新規投稿時と異なる点は編集→更新の場合はすでに存在しているレコードを選択して中身を置き換えるという点である。
def edit
@tweet = Tweet.find(params[:id])
end
編集画面のビューを作成する
入力情報の送信先は/tweets/編集するツイートのidとなる。
updateアクションのルーティングを設定する
ツイートを更新する際には、/tweets/<<編集するツイートのID>>にPATCHメソッドでアクセスする
このパスにアクセスした際、tweetsコントローラーのupdateアクションが実行される
このとき、updateアクションのルーティングを設定しておく
このupdateアクションも、destroyアクションと同様、ビューファイルへツイート情報を受け渡す必要がないため、インスタンス変数は使用しない
Ruby on Rails (PicTweet) ツイートを削除編
削除昨日はdestroyが該当する。
実装の流れは以下の通り
1ツイートを削除するためのルーティングを設定
2削除ボタンをビューに追加
3destroyアクションをコントローラーに定義
4削除後のビューの追加
ルーティングの設定
resourcesに:desrtoyを追加して、destroyアクションのルーティングを設定した
次にlink_toメソッドを使用し、削除ボタンを追加した。削除するツイートを区別するために、削除ボタンのぱすにはツイートのIDをパラメーターをもたせる。具体的には/tweets/<<tweetのid>>というぱすにすると、パラメーターとして受けとることができる
HTTPメソッドは、DELETEとし、methodオプションにシンボルで:deleteとするだけ。
今回、destroyアクションは、ツイートを削除するだけで、ビューにツイート情報を受け渡す必要はない。そのため、インスタンス変数ではなくただの変数として置き、destroyメソッドを使用する
def destroy
tweet = Tweet.find(params[:id])
tweet.destroy
end
あとはルーティングとコントローラーの編集が終わったから、最後にビューファイルの追加と編集を行う。これは「削除完了画面」 を作成する。
<div class="contents row">
<div class="success">
<h3>削除が完了しました</h3>
<a class="btn" href="/">投稿一覧に戻る</a>
</div>
</div>
destroyアクションは、ツイートを削除を行うアクションのこと
DELETEはdestroyアクションを動かす際に指定するメソッド
rails routesは、設定されているルーティングを確認するためのコマンドのこと
Ruby on Rails ツイートを保存しよう編
投稿機能を実装する際、ツイートの新規投稿機能を追加する。newで生成、createで保存する。
投稿画面へ遷移するためにNewアクションへのルーティングを設定する
resources = tweets, only: [:index, :new]
次にnewアクションを定義する
def new
end
ツイート投稿はフォーム(form_with)を使用する
ストロングパラメーターは指定したキーを持つパラメーターのみ受けとるよう制限するもの(設定しないと意図しないデータの更新される可能性がある)
requireメソッド
送信したパラメーターの情報をもつparamsが使用できるメソッド。requireはパラメーターからどの取得するか選択する。ストロングパラメーターとして使用する場合、主にモデルを指定する。
Ruby on Rails(PicTweet) ツイートを表示しよう編
- モデルの作成は次の手順です。
モデルの作成→テーブルの作成→ルーティングの作成(コントローラーを動かすため)→コントローラーの作成→ビューの作成(見た目を作る)
モデルはデータベースとのやりとりを担う
この時テーブルはモデルのファイルと一緒に作成される、マイグレーションファイルというテーブル作成時に必要なファイルを使用
rails g model tweetでTweetモデルを作成(tweet.rbというモデルが作成される)
t.に続くのが「型」で:に続くのが「カラム名」
マイグレーションはテーブルの設計図を表す
設計図に従ってテーブルを操作するには rails db:migrateコマンドを使用する
ローカルサーバーを起動するにはrails sを使用
rails cでコンソールを起動
Tweet.create(name:"takashi", text: "Nice to meet you")
などを記述しexitでコンソールを終了する
これでテーブルは作成された
CRUDは
C...生成(sreate)
R...読み取り(Read)
U...更新(Update)
D...削除(Delete)
の略
その中で7つのアクションはindex,show,new,create,edit,update,destroyである
resourcesメソッドは、7つのアクションへのルーティングを自動生成するメソッドのこと