見出し画像

サービスに非同期通信の機能をさらに追加した(Rails)

今日は制作しているサービスに組み込まれているコメント機能とレコメンド機能を非同期通信にする実装を行なった。

1、コメント機能を非同期通信に

画像1

ここは特に難しい点はなくスムーズに実装することができた。

コメントが保存されたとき(create.js,erb)は"create"という文字列を渡し、
コメントが削除されたとき(destroy.js.erb)は"delete"という文字を渡すようにしている。

そしてそれぞれの文字列が渡される部分テンプレートで以下の条件分岐を用意し、メッセージが切り替わるようにした。

<% if message == "create" %>
   <div class="flex rounded-md border-2 border-green-500">
     <p class="mx-2">コメントを投稿しました</p>
   </div>
 <% elsif message == "delete" %>
   <div class="flex rounded-md border-2 border-red-500">
     <p class="mx-2">コメントを削除しました</p>
   </div>
 <% end %>

2、レコメンド機能を非同期通信に

画像2

この機能はログインユーザーが投稿した加工の依頼について、
その投稿とマッチしそうな他のユーザーを紹介する機能だ。

依頼には遂行に必要な加工技術と納品場所が登録されていて、
ユーザーのプロイールでは得意技術と所在地が登録されている。

依頼で必要な加工技術を得意としているユーザー、且つ依頼で指定されている納品場所に所在地があるユーザーを検索して紹介する。
※納品場所や所在地は都道府県単位で登録されている

今回実装したのは、ログインユーザーが自身の投稿した依頼を選び、選択によって表示するおすすめユーザーの表示を変えるものだ。

ちなみにログインユーザーが検索したい依頼を選択するときに契約済みの依頼は表示させないようにしている。ここで初めてrejectメソッドを学んだ。

@none_contract_jobs = @user_posted_jobs.reject{ | job | @contracts.include?( job.id ) }

ログインユーザーが投稿した依頼の配列(@user_posted_jobs)から、
それぞれの依頼のidを抜き取り{ | job |     (  job.id ) }
契約済みのidが入っている箱(@contracts)を使って、
契約済みのidが含まれていれば @contracts.include?( job.id )
排除する(reject) という流れになっている。

配列に対して繰り返しメソッドを使用しないのでとても便利だと思った。

恐らく配列に対して使えるRailsのメソッドはたくさんあるはずだと思うので、非同期通信の過程で様々なメソッドを覚えたいと感じた。

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