fv17の日記 - Coding Every Day

Webエンジニアの備忘用ブログです。主にWeb界隈の技術に関して書いています。

Rails - ビュー

Railsでtypeahead.jsを使ってオートコンプリート機能を実装する

Railsでtypeahead.jsを使ったオートコンプリート機能(入力補完機能)の実装手順 https://www.virment.com/rails-typeahead-autocomplete/ typeahead.jsのGithub https://github.com/twitter/typeahead.js/ 実装例 http://twitter.github.io/typeahead.js/ex…

Rails - content_tagの使い方

content_tagメモ before <div class="alert alert-<%= message_type %>"><%= message %></div> after <%= content_tag(:div, message, class: "alert alert-#{message_type}") %>

【パーシャル】:collectionオプションによる複数オブジェクトのレンダリング

パーシャルにオブジェクトの複数形を渡し、見やすいコードにする 基本の使い方 collectionオプションにより、コレクションのメンバごとにパーシャルをレンダリングする <%= render partial: "product", collection: @products %> 具体的な使い方 Before Refa…

SCSSの書き方

基本的な書き方と、自身がハマったところ 基本的な書き方 公式 sass-lang.com日本語かもーんぬの場合はこちら ferret-plus.com 親を参照する場合 例えば、:hoverとかの場合 通常のCSS #logo { float: left; color: #fff; } #logo:hover { color: #fff; text-…

【link_to】imgタグにリンクを貼る方法

<%= link_to image_tag("sample.png", alt: "Sampleの写真"), root_path %>

RailsにBootstrap3およびBootstrap4を導入する方法

gemを入れることですぐにできる。Bootstrap3か4を使うかで利用するgemが異なる。Bootstrap3:bootstrap-sass gem Bootstrap4:bootstrap gem Bootstrap3を導入する Gemfile gem 'bootstrap-sass', '~> 3.3.7' gem 'sass-rails', '>= 3.2' app/assets/stylesh…

【パーシャル】インスタンス変数の直接参照ではなく、localsで値を渡す

なぜlocalsで渡す必要があるのか インスタンス変数を直接使うと、Viewと特定のControllerとの依存が強まり、別の箇所で再利用しにくくなるため。 悪い例 Controller (良い例と同じ) class UsersController < ApplicationController def show @user = User.fi…