読者です 読者をやめる 読者になる 読者になる

エコシステム

http://event.makewith.jp/ のサービスを作ったときに使った各種ツールを紹介します。 Rails、各種ホスティングサービスの恩恵をうけ、なんとか形にすることはできました。これからサービスを作ろうと考えている方の参考になればうれしいです。

ミドルウェア、インフラ周り

  • Ruby
  • Rails4
  • Heroku(+unicorn
  • AWS(RDS、S3)
  • SendGrid
  • CircleCI

を使用しています。herokuは、マニュアルがしっかり書かれているので設定周りで困ったことはありませんでした。heroku最高!!メール送信ではSendGridをフリープランで使用しています。一日200通の制限がありますが、当面は大丈夫そうです。作った後の運用も踏まえ、自分で出来ること、出来ないことを一度考えてから、技術選定をしてあげるとよい思います。

デザイン・フロントエンド関連

デザイナーではないので、一番苦しいフェーズでした。WebフォントやCSSフレームワーク、 フリーアイコン、勉強会でとった写真の素材を活用しなんとかしましたが、一番時間がかかったフェーズです。

WEBフォント(google

https://www.google.com/fonts

フリーアイコン(Font Awesome)

https://github.com/bokmann/font-awesome-rails

アイコン表示のヘルパーを用意してくれます。

CSSフレームワーク(bootstrap)

今回はrails_layoutを使って、大枠のレイアウトを作ってからカスタマイズしていきました。 また、 http://bootsnipp.com/ にてスニペットと本家のマニュアルを参考にしながら、作りたいレイアウトのサンプルをピックアップし当て込んでいきました。bootstrapつらいですが、こういった所は、やはり利点と感じています。

※その他参考にしたサイト
http://railsapps.github.io/twitter-bootstrap-rails.html

pjax

https://github.com/kossnocorp/jquery.turbolinks

rails4からturbolinksがデフォルトで導入されていますが、onloadイベントが発火されない問題があるため、上記Gemをいれて解消しています。その他問題がいくつかあるようなのですが、今のところはそのまま利用しています。

ページ更新の進捗

https://github.com/caarlos0/nprogress-rails

youtubeライクにページ更新の進捗が表示されます。(ページ上部に表示される、ニョキニョキー、クルクルクルーのところです。)herokuなのでページ表示に少し時間かかる、また、pjaxの遷移だと更新を待っている間に少し違和感が出てしまうため、更新の進捗状況を表示した方がよさそうです。

フォーム

https://github.com/plataformatec/simple_form

イベント新規作成画面などで利用しています。

入力補助

日付

https://github.com/Nerian/bootstrap-datepicker-rails

時刻

https://github.com/tispratik/bootstrap-timepicker-rails

イベント新規作成画面で使っています。カレンダーからの日付入力、時間のところは上下キーを押すと時刻が入ります。

機能関連 ・認証

普通のログインと、facebook認証で使っています。https://github.com/plataformatec/devise/wiki/OmniAuth:-Overview deviseでの連携の仕方が記載してあるので、参考にしてみてください。

ページング

https://github.com/amatsuda/kaminari

bootstrapのviewを作成するジェネレーターも用意されています。

マークダウン表示

https://github.com/vmg/redcarpet

イベント登録時に記載する内容はmarkdownの整形ルールを採用しています。

タグ

https://github.com/mbleigh/acts-as-taggable-on

イベントにつけるタグはこれを利用しています。

画像アップロード

https://github.com/thoughtbot/paperclip

s3へアップロードするインターフェースも用意されています。 が、今回herokuを使って運用しているため、画像アップロードする際にかなり時間がかかってしまいます。http://qiita.com/anoworl/items/35e75a20e70d2ad0f658 に書いている通り、herokuの場合はダイレクトでs3にアップロードする仕組みを作ってあげたほうがよいと思います。

URL

https://github.com/norman/friendly_id

カテゴリ別イベント一覧ページのURLで利用しています。 ユーザー名でアクセスすると、その人の情報を表示させるような利用シーンが一般的だと思います。

テスト・デバック関連

group :test do 
  gem 'spring-commands-rspec' 
  gem 'database_cleaner' 
  gem 'launchy' 
  gem 'factory_girl_rails' 
  gem 'simplecov' 
  gem 'simplecov-rcov' 
  gem 'coveralls', require: false 
  gem 'capybara' 
  gem 'rspec-parameterized', git: 'git@github.com:tomykaira/rspec-parameterized.git' 
end 

group :development, :test do 
  gem 'pry-rails' 
  gem 'pry-doc' 
  gem 'pry-remote' 
  gem 'rspec-rails' 
  gem 'mailcatcher' 
  gem 'marginalia' 
end 

紹介がめんどくさくなってきたので、その部分のgem貼ります。各種リードミーをよんでみてください。

その他

デコレーター

https://github.com/amatsuda/active_decorator

viewがすっきりする

初期データの投入

https://github.com/mbleigh/seed-fu

どーん

環境変数管理

https://github.com/laserlemon/figaro

ヤムラー

パフォーマンス、死活監視

http://newrelic.com/

ちぇけらちょ

そんじゃーね!1