フタミノブログ

マーケティングから技術まで色々

ActionController::RoutingError (No route matches [GET] "/images/bx_loader.gif"): の対処法

f:id:nimi0370376:20171114235245p:plain

Ruby on RailsjQueryプラグインを利用している時に下記のようなエラーが出ることがあります。

続きを読む

KPIの意味とマーケティング施策の考え方について

f:id:nimi0370376:20171112005254p:plain

最近得た学びについて久々にブログに書きます。

最近得た学びは主に2つあって、1つはチームや企業でKPIを設定する意味とマーケティング施策の考え方です。

続きを読む

「Python3とOpenCVで射影変換と面積計算を行う」を投稿しました

ご無沙汰です。

最近研究でOpenCVとPython3を使っており、コードを書いたのでqiitaに投稿しておきました。

 

qiita.com

 

とりあえず、pythonopencvで画像の色素抽出をして面積計算をするのがゴールとなっています。

 

斜めから撮っちゃったけどまっすぐに直したいなあって時は見てみてください!

Mercari Tech Conf 2017(MTC17)に行ってきた!

f:id:nimi0370376:20171002005540p:plain

 

こんばんは!

2017年9月30日に六本木で開催されたMercari Tech Conf 2017(MTC17)に行ってきました!

参加は一般人が2000円で学生が無料でした。この記事では、MTC17で学んだことやどんな感じだったかをシェアしていきます。

ちなみに基調講演のスライドは下記からご覧いただけます。

 

メルカリは色々ハックされている

f:id:nimi0370376:20171002010133p:plain

 

まず今回のMTCでもっとも学びが多かったのは技術的な側面より、組織作り的な側面でした。メルカリのマネジメント、開発、デザイン、プロセスは多様な面でハック(最適化)されており、見習う点が多いと感じました。

 

まずデザイン面で言うとメルカリの各国のUIの違いです。メルカリは各国ごとに異なるUI・UXを提供しており、ソースコードも異なるものをある一定のところから書き直すらしいです。

 

ちなみに日本限定なのはメルカリチャンネルやメルカリボックスがあるそうです。MTCでは日米のUI比較ブースも用意されていました。

f:id:nimi0370376:20171002010542j:plain

 

 

開発におけるユーザー目線と開発者目線

f:id:nimi0370376:20171002010750p:plain

 

メルカリの開発には、開発者目線とユーザー目線の二つを取り入れながらバランスを取っていました。リリース当初のメルカリには検索機能がなかったらしいです。

 

そこで上記のような二つの視点から必要になった時に実装しようとなったようです。ユーザー目線はよく聞きますが、開発者目線からも腹落ちする感覚は結構大事なのでしょう。

 

 

新しい技術を取り入れる

f:id:nimi0370376:20171002010957j:plain

 

メルカリは開発チームを横断的にする反面、Scalable、Elasticableにするために新しい技術の取り入れを頻繁に行っているそうです。機械学習は現在すでに導入されており、今後も利用の幅を広げていきたいのだとか。

 

またBlockChainなどもやりたいとおしゃっていました。メルカリのプロダクトは日々進化していることを実感できました。

 

上記写真は、機械学習のブースですね。実際にどんなセグメントで機械学習をしているのかをソースコードと共に出展してありました。

 

間違いがおきても大丈夫な仕組みづくり

f:id:nimi0370376:20171002011358p:plain

 

メルカリがここまで成長してきたのには、問題解決のシステムも整備されているからだと言えます。

 

上記のスライドは東京中央銀行(半沢直樹)とメルカリの問題解決に対する概要ですね。

とにかくミスが起きるのを責めずに、原因究明から行われます。そしてそれに対してシステムを整えてあげるのが大切なんですね。

 

上記のようなシステムが整備されていれば新しい技術を取り入れても安心できますね。

 

 

 

Mercari Tech Confから見るこれからのメルカリ

f:id:nimi0370376:20171002011710j:plain

 

今回のMTCでは他にも画像認識の話やUKチームの発足術などが講演されていました。また、隣接されたサブブースでは実際にメルカリ社員の方とお話ができたり、自動テスト(SET)を見学できたりとメルカリを身近に感じられるイベントになっていました。

とにかくメルカリは当たり前のことをシステム化していくのが上手だなと感じました。

  • Go Bold
  • All for One
  • Be Professional

の3つの指標から本当に必要なものやチャレンジングな精神を忘れず、パッケージング化してシステムに組み込んでいました。これはメルカリがこれからもスタートアップユニコーンであり続ける最大の武器だなと思いました。

 

今後もメルカリの動向に注目し、吸収できるところはしていきたいと感じました。

【Rails5】Acts-as-taggable-onとRansackを一緒に使用する

f:id:nimi0370376:20170924013942p:plain

Railsタグ機能の実装とスコープ機能を利用した時にハマったのでここにメモ残しておきます。

やりたいこと

上記の2点をやりたいと思っていました。
また、Ransackを利用した検索機能も利用していました。後述しますがこのRansackでハマりました…

Acts-as-taggable-onを利用したタグ機能実装

タグ機能の実装に関してはここを参照しました。

Gemfile

gem 'acts-as-taggable-on'

routes.rb

get 'tags/:tag', to: 'articles#index', as: :tag

articles_controller.rb

def index
    if params[:tag]
      @articles = Article.tagged_with(params[:tag])
    else
      @articles = Article.all
    end
    @articles = @search_articles.order(created_at: :desc).page(params[:page])
end

index.html+pc.erb

<% @search_articles.each_with_index do|article,i|%>
# 省略
            <div class="tag">
              <span>
              <%= raw(article.tag_list.map { |t| link_to t, tag_path(t) }.join(' / ')) %>
              </span>
            </div>

<%end%>
<div class="paginate">
  <%= paginate @articles%>
</div>


# 以下略

以上のようになっていました。 実際これでデータベースを作って、formを整えればタグ機能は実装できます。

記事の絞り込みができない

実は上記の実装だと記事の絞り込みができません。 タグをクリックしても記事一覧のままです。

主な原因は下記

  • indexアクションで@articlesを呼び出しているのに、indexでは@search_articlesを呼び出してる

なぜこんな簡単なことに気がつかなかったのか… つまりビューとコントローラーを下記のように書き換えればOK

articles_controller.rb

  def index
    if params[:tag]
      @search_articles = Article.tagged_with(params[:tag])
    else
      @search_articles = Article.all
    end
    @search_articles = @search_articles.order(created_at: :desc).page(params[:page])
  end

index.html+pc.erb

# 省略

<div class="paginate">
  <%= paginate @search_articles%>
</div>

最初から@search_articlesにそれぞれ入れてあげます。 ビューファイルでは@search_articlesを呼び出してあげればいいです。

@search_articlesを使う理由

そもそも最初から教科書通り@articlesにオブジェクトを格納していけばこんな不具合は起こりません。 @search_articlesを使用する理由は、ransackというgemを利用しているからです。

ransackはRailsで検索機能を実装する際に使うGemです。ransackを実装する際に@search_articlesにしていたのです。 全部Gemから実装しようとする場合には気をつけましょう。

今回の学び

今回の不都合は、

  • 全部Gemで実装を済ませようとしたこと
  • コントローラーの実装を適当にしてた

の2点から起こったと言えます。

railsのgemは非常に便利ですが、頼る際にはある程度gem以外の実装方法も少し考えておきましょう。 頼りすぎるといざという時にハマります…

ブログを設立してから1年が経った

今日でこのブログを立ち上げてから一年が経過した。ちょうど一年前の今日、多分日曜日だったと思うけど、ブログをやろうと思って立ち上げた。

 

理由はたくさんあった。一番はスタートアップ関連の情報発信と自分への備忘録を作ろうと思ったからだった。

 

他にもはてなブログのフォントが綺麗で好きだったので、乗り換えたいと思ったのもあった。いろいろ書いてきて、いろいろ思い返して様々な思いが巡っている。

 

一番は「成長したなー」という思い。本当に一年前のブログを読み返すと恥ずかしくなってくる。それくらい何も考えないで生きていた証拠だと思う。

 

同時にそれくらい考える力と様々な知識をこの1年間でつけることができたのは非常に大きかったと思う。RubyPythonマーケティング、決算、ファイナンスSEO、メディア、と他にも考える力などがある。

 

これらは言葉で表すと非常に長くなるからまた今度とする。

 

もう一つはこの1年間でやり残したことたくさんあるなーって感じです。やりたいことリストをここに宣言しておきます。

 

 

どれくらいできるか分からないけどこの1年間以上のスピードで走り抜きたいと思う。

特に最後の方のやつは自分の力がどれくらい通用するかを見てみたい。

ぼーっとしてたら負けるので、驕ることなく頑張ります。

引き続きこのブログをよろしくお願いします。

 

 

 

最後に最近Ruby on Railsでリリースしたプロダクトを紹介します。

実は2017年の初めに雛形は出来上がってたのですが、SQLiteで作ったが故にデプロイできず1から作り直しました。

 

MOMIJI」です。たまに更新します。

 

f:id:nimi0370376:20170918203507p:plain

 

https://tranquil-hollows-79901.herokuapp.com/

heroku × Railsでメディア運営をする(Cloudinary編)

f:id:nimi0370376:20170914012022j:plain

最近herokuを利用してメディアの運営を始めました。 Railsで作成して、herokuの無料プランで運営していく方針です。

その中で記事を投稿していくのですが、サムネイルの画像が消えてしまうという事態に陥ったので原因と解決方法を残しておきます。

herokuだと画像がアップロードできない

現象

herokuでデプロイ後に記事投稿を試みますが、画像がいつまでたっても表示されません。 もっと言えば、pushするたびに画像が消える…

これを解決しようと色々な方法を模索しました。

解決方法

qiita.com

まあこれですね。 簡単に説明するとherokuだとアップロード先を指定できてないので、外部のデータベースを用意してあげる必要があるらしいです。

ただし、AWSとかだとEC2なのですがherokuはなかなか難しい。

そこでCloudinaryが登場するわけです。 railsから簡単に設定できて、無料というのが嬉しいです。

heroku × Cloudinaryの使用方法

1. herokuにアドオンを追加

railsからアドオンをherokuに追加する必要があります。

$heroku addons:add cloudinary:starter

または、herokuのページから直接追加することも可能です。

f:id:nimi0370376:20170914012747p:plain

herokuのResourcesからいけます。 starterにしないと料金が発生するので注意してください。

また、ここでherokuにクレジットカードを追加してくれと言われることがあります。 基本的にお金はかからないと思うので追加しておいて大丈夫でしょう。

どうしても不安という方は、後から紹介するcloudinaryのストレージを確認しながら使用してください。

2. Cloudinaryを開いてymlをダウンロード

Cloudinaryをherokuから開くとdashboardに飛ぶと思います。 次にymlをダウンロードするのですが、これが非常にわかりにくいです。

f:id:nimi0370376:20170914013931p:plain

Account detailのところのYMLの文字をクリックすると自動的にダウンロードが始まります。

3. Railsから設定を行う

さあ、後もう少しです。

Railsのconfig 以下に先ほどのymlを入れます。

Config / cloudinary.ymlってことです。

---
development:
  cloud_name: abcdefgh
  api_key: '123456789'
  api_secret: xxxxxxxxxxxxxxxxx
  enhance_image_tag: true
  static_image_support: false
production:
  cloud_name: abcdefgh
  api_key: '123456789'
  api_secret: xxxxxxxxxxxxxxxxx
  enhance_image_tag: true
  static_image_support: true
test:
  cloud_name: abcdefgh
  api_key: '123456789'
  api_secret: xxxxxxxxxxxxxxxxx
  enhance_image_tag: true
  static_image_support: false

ちなみにcloud_nameとapi_keyとapi_secretはdashboardのところに書いてあります。

4. pushして利用

$ git add .
$ git commit -m "yml added"
$ git push heroku branch_name

いつもの奴を打ってください。

これで利用可能になります。 うまくアップロードできてるとcloudinaryのdashboardに画像と容量が表示されているはずです。 このcloudinaryかなり容量がありますので基本的には無料プランで大丈夫です。

f:id:nimi0370376:20170914014528p:plain

こんなのもありますので、もしピンチの時はシェアしてあげてください笑