Elasticsearchのデータを簡単にimport/exportする

最近、Kibana と Elasticsearch と Fluentd の組み合わせでログを可視化するの見かけたので僕も試してみました。とても簡単に可視化できて素晴らしいですね〜 :D

ただ、開発環境で Elasticsearch のデータを作るのはメンドクサイです。うーん、何か良い方法は無いものかと探していたら、elasticsearch-knapsack (ナップサック!!!1) という Elasticsearch のデータを import/export してくれる gem を見つけました。これは便利そう！！

これを使って、本番環境のデータをちょろっと手元にコピーしてみました。



まずエクスポートから。github で書かれている通り、エクスポートさせたいサーバ側で knapsack をインストールします（要再起動）。

/usr/local/share/elasticsearch/bin/plugin --install knapsack --url http://bit.ly/17cn710

そしたら手元からおもむろにこんな感じの POST を投げれば、サーバ側の /usr/local/share/elasticsearch ディレクトリに test1_test2.tar.gz というファイルが出来ているはず！これだけで _index が test1、_type が test2 のデータがまるっとエクスポートされます。

curl -XPOST yourdomain:9200/test1/test2/_export

次に、インポートです。ローカルにも同様に knapsack をインストールして（要再起動）

/usr/local/Cellar/elasticsearch/0.90.7/bin/plugin --install knapsack --url http://bit.ly/17cn710 --install knapsack --url http://bit.ly/17cn710

ローカルに先ほどの test1_test2.tar.gz ファイルを持ってきて、Elasticsearch を起動してるパスにファイルを置きおもむろに POST。

curl -XPOST localhost:9200/test1/test2/_import

すると、なんとこれだけで簡単にデータがインポートされました。いえーい。

今、AngularJSというフレームワークがヤバい

先週の土曜日、ランサーズさんで行われた 第３弾　週末ランサーズ に参加して個人的に今アツい AngularJS について話してきました。

AngularJS は ng-repeat が便利だったり、コードの見通しが良くなるなどいろいろなメリットがあると思うのでうまく使えば大変メリットがあると思います。特に、データの状態（要素の追加・削除や、状態のon/off など）を制御すればそれに合わせて view の表示はすべて AngularJS がやってくれるというのは素晴らしいですね。

ちなみに、以下の資料の中で ng-app とか ng-repeat とか出てきますが（これは directive と呼ばれます）、この ng というのは AngularJS の２文字目と３文字目を表しています。また、この名前の付け方は結構自由で、先頭に x- や data- を付けても良いし、区切り文字も : とか _ でも問題無いですー（以下のように処理されるため）。

http://docs.angularjs.org/guide/directive

Strip x- and data- from the front of the element/attributes.
Convert the :, -, or _-delimited name to camelCase.

AngularJS を Rails 等とがっつり組み合わせて使うときには、Rails は JSON を返すだけにして DOM の構築なんかはすべて AngularJS でやるというのが良いのかもしれません（データを Rails と AngularJS の両方で扱うことになってしまうので）。が、僕の場合には途中から導入したというのもあって、そこまで AngularJS を全力で使うという感じではなく、選択肢の追加・削除や、要素の出し分けのような jQuery でやるとめんどくさいし後々バグリそうだなーというところにちょこちょこと使うという方針でやってます。

しばらく使ってみた感想としては、一度作るだけなら jQuery でも AngularJS でもあまり変わらない（というか jQuery の方が慣れてるし簡単かな。AngularJS は学習コスト掛かるし）ですが、後々の運用を考えるとバグが出にくそうな AngularJS が良いかな〜という感じです :)

その他の Tips としては、jQuery 側から AngularJS を呼びたいときには $apply を使うとかですね。AngularJS でうまくイベントが bind 出来ないとか、jQuery plugin の関数を呼びたいみたいなときには便利です。

# .upload が何か変化したら nowLoading を true にする

$(document).on 'change', '.upload', ->
  $scope.$apply ->
    $scope.nowLoading = true
  $(@).upload url, { token: token }, callback, 'json'

AngularJS に興味を持った方は以下のサイトを見てみると理解が早いかもしれません。動画で見れると理解も早いしとても良い時代ですね＞＜

AngularJS入門 (全12回) - プログラミングならドットインストール
AngularJS Video Tutorials, Workshops, and Training @eggheadio

RubyからTwilioを触ってみたので簡単な使い方を書いておく #edhack

先週の土曜日、EdTech Hackathon vol.1 に参加しました。（楽しかったので第二回もやりたい！）

いくつかテーマが用意されていたんですが、その中のひとつに最近興味を持っていた Twilio があったので Twilio を使ってみることにしました。Twilio を使うと、Webから電話を掛けたり、応答メッセージを制御することが簡単に 出来ます！



で、せっかく使ってみたので簡単な使い方を書いておきますね。前提として Twilio にユーザ登録して ACCOUNT_SID や AUTH_TOKEN は取得済みとします。また、Ruby から触るなら twilio-ruby という gem が便利なのでこれを使った話です。

def call
  client = Twilio::REST::Client.new(ACCOUNT_SID, AUTH_TOKEN)

  client.account.calls.create(
    from: '+8150xxxxxxxx',
    to: '+8190xxxxxxxx',
    url: 'http://xxx.heroku.com/callback'
  )
end

まず、電話を掛けるならたったこれだけです。それぞれのオプションの意味は以下の通り。

from: 着信元の電話番号 ( Twilio で取得できる)
to: 着信先の電話番号 (電話を掛けたい番号、つまりあなたの電話番号とか)
url: ここに置いた XML で応答メッセージを指定できる

次に、XML ですが、こんな感じで生成します。動的に作らずに適当な XML を置いておくだけでも大丈夫です。最近は XML ってあんまり書くこと無いなー。

# http://xxx.heroku.com/callback

def callback
  xml = Builder::XmlMarkup.new(indent: 2)

  render xml: xml.Response {
    xml.Gather(action: 'http://xxx.heroku.com/receive', numDigits: 1, timeout: 10) do
      xml.Say('番号を入力してください', voice: 'woman', language: 'ja-JP')
    end
    xml.Say('何も入力されませんでした', voice: 'woman', language: 'ja-JP')
  end
end

# 生成される XML

<Response>
  <Gather action="http://xxx.heroku.com/receive" numDigits="1" timeout="10">
    <Say voice="woman" language="ja-JP">番号を入力してください</Say>
  </Gather>
  <Say voice="woman" language="ja-JP">何も入力されませんでした</Say>
</Response>

この例だと、まず「番号を入力してください」という応答メッセージが流れます。１とか２とか押すアレです。タイムアウトしたときには「何も入力されませんでした」という応答メッセージを流してみました。

ここまで来たらあとちょっと。最後に入力された数字を処理しましょう。実は Gather という要素で action という属性を指定していて、入力された内容はここに送られてきます。それを受け取るだけです。Digits というパラメータで送られてくるので、

# http://xxx.heroku.com/receive

def receive
  xml = Builder::XmlMarkup.new(indent: 2)

  render xml: xml.Response {
    xml.Say("あなたが押したのは #{params[:Digits]} です", voice: 'woman', language: 'ja-JP')
  }
end

こんな風にするだけ！簡単ですねぇ。すごく簡単に電話を掛けることができて感動しました。他にも SMS 送ったりとかもできるので興味のある方は見てみてください〜 :D

Railsでモデルをto_jsonするときにデータを追加するオプション

データの形式を変換するために to_json 使って

@user.to_json
#=> "{\"id\":1,\"name\":\"sasata299\"}"

とかすることってあると思うんですが、モデルのカラム (column) に無いデータを追加するにはどうしたらいいんだろうと思った雨の木曜日。

調べてみると、こういうときには methods という引数で任意のメソッドを指定すればいいんですね。point という値を持たせたい場合にはこんな感じ。なるほどなるほどー。

@user.to_json(methods: :point)
#=> "{\"id\":1,\"name\":\"sasata299\",\"point\":100}"

他にも only とか except とか include とかありますね。 :)
to_json (ActiveRecord::Serialization) - APIdock

Railsのfields_forを使ったnested attributesなデータの追加や削除をAngularJSでやっちゃおうという話

ユーザ登録時に併せて言語の習得レベルを設定する、みたいな場合を考えます。

= form_for :user do |f|

  ..(snip)..

  # ここから
  .form
    = f.fields_for :user_languages do |form|
      %p
        = form.label :language_id, '言語'
        = link_to 'Remove', 'javascript:void(0)'
        = form.collection_select :language_id, Language.all, :id, :name

      %p
        レベル
        - Level.all.each do |level|
          = form.radio_button :level_id, level.id
          = form.label "level_id_#{level.id}", level.name
  # ここまで

  = link_to 'Add', 'javascript:void(0)'

これ自体は Rails を使っていれば fields_for 使ってさくっと処理できるから良いんですが、こういうときにありがちなのが、複数の言語の習得レベルをまとめて設定するための

「 .form 要素を追加したり削除したり出来るようにしてほしい」

みたいな要望です。これ、fields_for を使ってるとつらいと思うんですよね。。なぜなら、生成される要素の id が user_user_languages_attributes_0_level_id_1 とか、name が user[user_languages_attributes][0][level_id] とかなってるからです。.form 要素が複雑だったら泣けます。

パッと思いつくのは「この .form 要素を clone してきて、id とか name を良い感じに書き換える」みたいな方法じゃないでしょうか。まぁこれでももちろんうまくいくと思います。が、めんどくさいです。

2個目以降には削除ボタン付けたりとか、3個まで作って真ん中を消したときにインデックス部分が0と2になっちゃわないようにしたりとか5個になったら追加ボタン出さないようにしたりとか（以下略 しかもデザイン変更とかで DOM が変わったらすぐ動かなくなったりして生きるのが辛い感じになることが容易に想像できます。(´*ω*｀)

そこで、今回は Google の作っている AngularJS というフレームワークを利用してみました。AngularJS とは簡単に言うと、何か変更を加えたときにそれを検知して、画面を再度 render してくれるものです。こんな感じ（※これは AngularJS じゃないけどこんなイメージw）



# html

%div{ ng_controller: 'LanguageCtrl' }
  %div{ ng_repeat: 'language in languages' }
    .form
      = f.fields_for :user_languages, child_index: '{{$index}}' do |form|
        %p
          = form.label :language_id, '言語'
          = link_to 'Remove', 'javascript:void(0)', ng_click: 'remove($index)', ng_show: '!$first'
          = form.collection_select :language_id, Language.all, :id, :name

        %p
          レベル
          - Level.all.each do |level|
            = form.radio_button :level_id, level.id, id: "user_user_languages_attributes_{{$index}}_level_id_#{level.id}"
            %label{ for: "user_user_languages_attributes_{{$index}}_level_id_#{level.id}" }= t("learning_level.#{level.name}")

    = link_to 'Add', 'javascript:void(0)', ng_click: 'add()'

# coffeescript

window.LanguageCtrl = ($scope) ->
  $scope.languages = [{}]

  $scope.add = ->
    $scope.languages.push {}

  $scope.remove = (index) ->
    $scope.languages.splice index, 1

たったこれだけです。説明は省きますが、追加ボタンを押すと要素が追加されて、それを AngularJS が検知し、画面を再度 render してくれます。書くのは若干手間かもしれないですが、DOM に依存しないしバグが出にくそう。

fields_for のオプションとして child_index を使うと生成される要素のインデックスが指定できるっていうのがポイントですかね。こんなイメージ。

child_index: 3
# => user_user_languages_attributes_3_level_id_1

child_index: 8
# => user_user_languages_attributes_8_level_id_1

ラジオボタンの id とか、そのラベル部分で $index がうまく置換されなかったので直接指定したりしてごにょごにょしたりしてます。あと、AngularJS の module とか使ったりした方が良いんだろうと思いますがとりあえず公開します。参考になれば！＞＜

なんか名字と名前入れたらフルネームがすぐに表示されるみたいな簡単なサンプルはいっぱいあるんだけど、複雑な例になると全然見つからないのが辛い。。実用的なサンプルが見たいよー。