Rails 5.1とBootstrapで作るシンプルな検索機能のテンプレ


Rails 5.1とTwitter Bootstrapをつかったアプリケーションに検索機能をつけました。個人的忘備録で、手順のメモを書いておきます。


😀 ControllerにSearchアクションを追加

Controller側にsearch用のアクションを追加します。

class ArticlesController < ApplicationController
def search
@articles = Article.search(params[:qkeyword])
end
end

🎉 Modelにsearchメソッドを追加

Modelにsearchメソッドを追加します。今回はtitlecontentをLIKEで検索する例です。

class Article < ApplicationRecord
scope :search, (->(word) { where('title LIKE ? OR content LIKE ?',
"%#{sanitize_sql_like(word)}%",
"%#{sanitize_sql_like(word)}%") })
end

🚌 Viewに検索フォームを追加

ERBを使っている場合はこちら。

<% form_tag search_articles_path, method: :get do %>
<%= text_field_tag :search, params[:keyword] %>
<%= submit_tag '検索' %>
<% end %>

HAMLを使っている場合はこちら。

= form_tag search_articles_path, method: :get do
= text_field_tag :search, params[:keyword]
= submit_tag "検索"

🐞 config/routes.rbにSearchを追加

Rails.application.routes.draw do
resources :articles do
collection do
get 'search' => 'articles#search'
end
end
end

コーディングは以上です。結果はこんな感じになると思います。

どうぶつの森 QRコードまとめ 検索ボックス

😸 補足:Elasticsearch

このサンプルは簡易的に検索機能を実装したいときに有効ですが、サービスで本格的に提供する場合はElasticsearchを使うのが一般的です。

Elasticsearchを使ったRailsサンプルアプリケーションの作成

🚕 参考リンク

📚 おすすめの書籍

🖥 サーバについて

このブログでは「Cloud Garage」さんのDev Assist Program(開発者向けインスタンス無償提供制度)でお借りしたサーバで技術検証しています。 Dev Assist Programは、開発者や開発コミュニティ、スタートアップ企業の方が1GBメモリのインスタンス3台を1年間無料で借りれる心強い制度です!(有償でも1,480円/月と格安)