Ruby on Railsで検索・置換アプリを使ってみた




Railsで検索・置換アプリは作れる?

Railsで作ってみたかったのが、

ある文章から「あるキーワード」を検索して別の何かに置き換える

というアプリ。

よくワード系のソフトで実装されている、

検索・置換

に特化したやつですね。

 

僕自身、この「検索・置換」を重宝していて、音声入力で文章を書くときや、imgタグのalt属性に一括でキーワードを挿入するときに頻繁に使っていたのです。

ただ、検索・置換のためにいちいちドキュメントを開くのはめんどくさい・・・・!

 

そこで、「検索・置換」だけのアプリをRailsで作れるか挑戦してみたところ、なんとか完成できたので、その方法をまとめておこうと思います。

Image from Gyazo

 

 

Ruby on Railsを使った検索・置換アプリの作り方

今回のRailsの開発の環境は次のようになっています。

  • Railsのバージョン:5.0.7.2
  • Rubyのバージョン:2.3.1

 

アプリを作成する

まずはRailsアプリの作成からですね。

今回はreplacerというアプリを作りたいので、

$ rails new replacer

でオッケー。

作成したらアプリフォルダのディレクトリに移動します。

$ cd replacer

 

splite3のバージョンを指定

続いて、splite3のバージョン指定しましょう。

Gemファイルの

gem 'sqlite3'

という記述を

gem 'sqlite3', '~> 1.3.6'

に編集してバージョンを指定してあげましょう。

編集が終わったら

$ bundle update

僕の場合、Railsのバージョンが5で、コントローラーを作るために必要でした

 

 

コントローラーを作成する

コントローラーを作っていきましょう。

$ rails g controller words search

今回はwords.controller.rbというコントローラーを作ってみました。

そして、そいつにsearchというアクションも追加しました。

 

ビューファイルを作成する(フォーム作成)

あとはビューファイルの作成ですね。

今回はsearch.html.erbというファイルを作成してみました。

  <h1><a href="/">Replacer</a></h1>
<div class='content'>
  <div id="search-box">
    <h2>検索</h2>

    <%= form_tag('/', method: :get) do %>
        <%= text_field_tag :word, "",  id: "word_search", name: "keyword", placeholder: "検索ワードを打ち込んでください", style: "width: 200px;"%>
<br><br><br>
  <h2>次に変更</h2>
<%= text_field_tag :word, "",  id: "word_search", name: "replace", placeholder: "置換ワードを打ち込んでください", style: "width: 200px;"%>

 <h2>検索対象</h2>
        <%= text_field_tag :content, "",  id: "word_search", name: "content", placeholder: "テキストデータをコピペしてください", maxlength: "8000"   %>

        <br><br><br>


        <button title="置換" type="submit">置換</button>
    <% end %>
  </div>

  </div>

</div>

 

このファイルには、

  1. 検索ワード
  2. 置換ワード
  3. キーワードを置換するテキスト

を入力する3つのフォームが含まれていますね。

 

ルーティング設定

後はルーティング。

Rails.application.routes.draw do
   root to: 'words#search'
end

トップページのルートディレクトリに検索フォーム、さらに置換結果を表示するようにします。

 

コントローラーを編集する

先ほど作成したコントローラーを編集します。

class WordsController < ApplicationController
  def search

    keyword=params[:keyword]
    replace = params[:replace]
    content = params[:content]

    if keyword&&replace&&content
      @output = content.gsub!(/#{keyword}/, replace)

    end

  end
end

 

ビューファイルのフォームから得た3つの値をparmasで取得して、それを@outputというクラス変数に代入します。

そして、その@outputを Ruby の string 型メソッドの gsub!を使って、正規表現にマッチした文字列を置換します。

このメソッドは、

  • 第1引数:正規表現
  • 第2引数:置換したい文字列

を入れます。第1引数のように、スラッシュで囲んでやると、正規表現のオブジェクトができるようですね。

 

ビューファイル編集(出力結果表示)

出力を表示するためのページをビューファイルで作っていきます。

  <h1><a href="/">Replacer</a></h1>
<div class='content'>
  <div id="search-box">
    <h2>検索</h2>

    <%= form_tag('/', method: :get) do %>
        <%= text_field_tag :word, "",  id: "word_search", name: "keyword", placeholder: "検索ワードを打ち込んでください", style: "width: 200px;"%>
<br><br><br>
  <h2>次に変更</h2>
<%= text_field_tag :word, "",  id: "word_search", name: "replace", placeholder: "置換ワードを打ち込んでください", style: "width: 200px;"%>

 <h2>検索対象</h2>
        <%= text_field_tag :content, "",  id: "word_search", name: "content", placeholder: "テキストデータをコピペしてください", maxlength: "8000"   %>

        <br><br><br>


        <button title="置換" type="submit">置換</button>
    <% end %>
  </div>

  </div>
 <textarea rows="100" cols="100"><%=@output%></textarea> 
</div>

<textarea>タグで コントローラーで@outputを挟んでやれば、こんな感じでコピーしやすいように出力できたと思います。

 

 

さあ、Railsで検索・置換アプリを作ってみよう

ここまでやってやると、

検索・置換アプリが作れたと思います。

例えば、

  • 検索ワード:lancer
  • 置換ワード:sworder
  • 検索対象:freelancer

とやってやると、「freesworder」と出力されるわけです。

Image from Gyazo

 

今度はこれを応用し、imgタグのalt属性に一括でキーワードを追加できるアプリを作っていきたいと思います。

 

それでは!

Lin

 

【参考記事】




音生入力で楽にブログを書く技が満載!
ブログ音声入力術

音声入力の使い方から文章を書くコツまで完全網羅。ブログを書きたいすべての人向けの電子書籍