##【ゴール】
raty.jsを使用して星付きのランキング機能の実装　view表示まで

##【メリット】
■　UXの向上
■　javascript理解度向上

##【開発環境】
■ Mac OS catalina
■ Ruby on Rails (5.2.4.2)
■ Virtual Box:6.1
■ Vagrant: 2.2.7

##【実装】

###1.githubからretyのソースを持ってくる
　※こちらのソースコードから
　※ファイルは2点、①"jquey-raty.js"のファイル　,　②"image"全て

###2.jquery追記
　※　”//= require jquery”を追記しないと読み込まれません
　※　"star"　に対して発火するよう定義
　※　”/assets/star-off.png"で画像の場所を指定

javascripts/application.js

//= require jquery  

　　　（中略）

$(function () {
  $('#star').raty({　　　
    size: 36,
    starOff: "/assets/star-off.png",
    starOn: "/assets/star-on.png",
    scoreName: "score"
  });
});

###3.view追記
　※　””ファイルを読み込む
　※　"id=star"で上記のJavaScriptの記述へ情報を渡してあげる

views/application.html.erb

<body>
  <script src="assets/jquery.raty.js"></script>
  <div id="star"></div>
  <%= yield %>
</body>

以上