Rails Webook

自社のECを開発している会社で働いています。Rails情報やサービスを成長させる方法を書いていきます

Railsにgulpを統合させる

Railsでgulpを使ってアセットファイルの管理する環境を構築します。gulpでsass/scssのコンパイル、ES6のコンパイル(babel, webpack)、gulpの便利プラグイン(変更監視、画面リロード、通知)、ミニファイ、ダイジェスト付与をできるようにします。そして、gulp…

RailsでReact.jsをサーバーレンダリングする

react-railsを使いReact.jsをサーバーレンダリングする方法を説明します。サーバーレンダリングすることで、初期値をHTMLの初期レンダー時に渡せるようになるので、ロード中による画面のばたつきや、ロード中といった表示をなくせます。

RailsでReactを使ってメッセージボックスアプリを作成

Railsに簡単にReact.jsを統合できるreact-raisというgemを使い、RailsでReact.jsを使う方法を説明します。

RailsでElasticsearch: サジェスト (Suggest) 機能でオートコンプリート

RailsでElasticsearchのサジェスト機能を使用してオートコンプリート機能を実装します。

RailsでElasticsearch: ハイライト(Highlight)

RailsでElasticsearchを使ってハイライト(Highlight)機能を実装します。Elasticsearchのhighlightキーを指定することでハイライトを実施できます。

RailsでElasticsearch: アグリゲーション(ファセット)と Post Filter

RailsでElasticsearchを使って、アグリゲーション(ファセット)と Post Filter を使ってファセット機能を実装します。 「アグリゲーション」は、SQLでいうGROUP BYのようなもので、最小値、最大値、平均値などを求めたり、カテゴリ毎の数を数えたりなどドキ…

RailsでElasticsearch: ソート機能を実装

RailsでElasticsearchのソート機能を実装します。Elasticsearchではsortキーでソートをするキーを指定します。

RailsでElasticsearch: ページネーションと1ページの表示件数を実装

RailsでElasticsearchを使って「ページネーションを実装します。また、1ページの表示件数を変更できるようにします。Railsのページネーションで有名なgemのkaminariを使って実装します。

RailsでElasticsearch: 全文検索を実装

RailsでElasticsearchを使ってレストラン検索アプリを作成、店名、住所、カテゴリなどからレストランを全文検索できるようにします。また、フィルタ(filter)(filter)も使って検索条件を指定することで、閉店している店舗も含めて検索できるようにします。

Phoenix入門3 - WebSocketのチャット機能

Phoenixでチャット機能を実装します。Phoenixでソケット、チャネル、トークン、API作成、モデルのアソシエーションなどを行っていきます。

Phoenix入門2 - Phonixで認証機能

Phoenixでユーザ登録、ログイン、ログアウトといった認証機能を実装します。 Userモデル作成、マイグレーション、外部ライブラリの使用、ヘルパー関数の定義と利用などWebアプリケーションを作るための基本的な箇所を説明します。

Phoenix入門1 - Hello Phoenix

Phonixとは、elixerという言語で書かれたWebフレームワークです。APIやリアルタイムストリーミングに特化し、大規模かつスケーラブルで高可用性で早いという特徴があります。 この記事では、Phonix環境のセットアップから、静的ページを作成、表示させます。

リファクタリング: デメテルの法則(Law of Demeter, LoD)

デメテルの法則は、オブジェクト指向の設計におけるガイドラインで、簡潔にいうと「直接の友達とだけ話すこと」ができるようにするということです。 デメテルの法則に違反しているソースコードとそれの対処する方法を説明します。

Rubyテクニック: Rubyの通常の引数とキーワード引数の違い

Ruby2.0からキーワード引数が導入され、Ruby2.1からRequiredキーワード引数が導入されました。 Rubyの通常の引数とキーワード引数のメリット、デメリット、どういうときにキーワード引数を使ったほうが良さそうかということをまとめました。 Rubyの通常の引…

ChefでRails環境を構築(Ruby+Nginx+Unicorn+PostgreSQL+Redis+Fluentd)

ローカルの仮想マシンにChefでRails環境を構築する方法を説明します。環境は、CentOS 6.6、Ruby(rbenv)、Nginx、Unicorn、PostgreSQL、Redis、Fluentd(td-agent)を使っています。

Vagrant入門。簡単にローカル環境に仮想マシン(VM)を作る

Vagrantを使うことで本当に簡単に仮想マシン(VM)をローカル環境に作成できます。 主な利用用途としては、開発用マシンをVagrantで作成できるようにしておくことで、同じ構成(OS、ミドルウェア、バージョンなど)の開発マシンを開発メンバーに配布することが…

いまさらながらRails4.1から導入されたEnumが便利なのでまとめてみた

Rails4.1から導入されたEnumの挙動について忘れることがあるので簡単にまとめました。 enumの定義、enumを定義したことにより使える便利なメソッドなどをまとめました。

RailsでRoarを使ってAPIサーバーとAPIクライアントを作る

RoarはRepresenterを使ってRESTなAPIをパース、レンダーすることができるgemです。 つまり、Roarを使うことで、RailsでJSONを返すAPIサーバーを作成したり、逆に、APIサーバーにアクセスするAPIクライアントをRubyで作れます。

フォーム画面でページから離れるときにJavascript(JS)の警告を出す

上記のように、フォーム画面でページから離れるときにJavascript(JS)の警告を出す方法を説明します。実際の動作は次のリンクから確認できます。 ページを離れる時に警告を出す - jsfiddle

Postgresqlのデータ型一覧とRailsのマイグレーションの指定方法

Postgresqlの各データ型とRailsのマイグレーションでの指定方法をまとめました。数値データ型、通貨型、文字型、日付/時刻データ型、論理値データ型についてまとめました。

RailsでActiveRecord/Arelを使って複雑なSELECT文を実行する方法

Rails(ActiveRecord/Arel)で複雑なSELECT文を実行する方法をまとめました。 メリット、デメリットや使いどころなどまとめ途中なのであしからずお願いします。

RubyでSeleniumを使ってサクッとスタンドアローンなブラウザテストを作成する

RubyでSeleniumを使ってスタンドアローンなブラウザテストをする方法を説明します。テスティングフレームワークにはRSpec、SeleniumにアクセスするためにCapybaraをつかうことで簡単にテストがかけます。

RailsでDraperを使ってプレゼンテーション層(デコレーター)を実装する

DraperはRailsのプレゼンテーション層の役割を担うgemです。プレゼンテーション層の必要性、実装方法について説明します。Draperはデコレーター(他にはプレゼンター、ビューモデルなどと呼ばれます)であり、ビューとモデルの中間に位置し、モデルやビュー…

たった10分でGoogle AdSenseの広告収入を2倍にした方法

たった10分で簡単に広告収入を2倍にすることができました。 対象者として、ブログなどで少し広告収入が稼げたらいいな、まとめサイトなど広告収入がメインの収益などといった方を対象としています。

jQueryによるDOM操作をまとめてみた

jQueryを使うことでブラウザ間の違いを吸収しながらも、簡易にDOM操作のJavaScriptコードを記載することができます。よく使われるjQueryのDOM操作のメソッドをまとめました。

jQueryの疎結合なイベント処理

jQueryを使ってイベント処理の登録と削除方法、登録できるイベントの一覧を説明します。 また、JavaScriptはイベントを通してHTMLと結びついているので、イベントハンドラのコーディングと修正に多くの時間を使います。 そのため、イベントハンドラとアプリ…

jQueryによるAjax処理

jQueryの$.getメソッドと$.postメソッドの使い方を説明します。

JavaScriptで設定データをコードと分離する

良い設計のアプリケーションは、「生きた設定データ」をソースコードのメイン部分と分離し、設定データの変更を容易にし、意図しないバグを含まないようにします。「URL」、「UIに表示される文字列」、「繰り返される一意の値」、「設定(ページごとの項目な…

無料枠内でのHerokuの準備とデプロイ(Mac 10 + Rails 4.2 + MySQL 5.6)

Herokuで無料枠内で使うための準備とデプロイの流れについて簡単にまとめました。 Mac + Ruby 2.2.1 + Rails 4.2 + MySQL 5.6でやりました。

Javascriptのthisの参照先をまとめてみた

JavaScriptのthisは属しているオブジェクトによって参照先が変わります。 コンストラクタ内、オブジェクト内、イベントハンドラ内などのthisの参照先をまとめました。

HTML/CSS/JavaScriptを疎結合にする方法

HTML/CSS/JavaScriptは相互に関係しているが、できる限り依存して複雑にならないようにする方法を説明します。そうすることで、デバッグのしやすさ、コードの理解のしやすさ、保守性があがります。

JavaScriptの少し独特なオブジェクト指向についてまとめてみた

既にJavaやPHPなどオブジェクト指向言語を生業としてやっているが、その感覚でJavaScriptを少し扱っているて、いまいちJavaScript分からないという方を対象に、それらのプログラム言語とは違う、「少し独特なJavaScriptのオブジェクト指向」について説明しま…

RailsでAcitiveJobとDelayedJobを使ってバックグランド処理を行う

DelayedJobでのバックグラウンド処理の実施方法から、ActiveJobとDelayedJobを組み合わせたバックグラウンド処理の実施方法までを説明します。 メール送信、大量データのインポート/エクスポートなど長い時間がかかる処理はバックグラウンドで処理するのが推…

Railsのi18nの基本的な使い方まとめ

Railsでの国際化(i18n: Internationalization)の方法をまとめています。 デフォルトのlocale設定、基本的な翻訳の流れ、翻訳ファイルの作成、localeを動的に変更する方法を説明します。

Railsでacts-as-taggable-onを使ってタグ管理を行う

acts-as-taggable-onはRailsでタグの追加、削除、関連するオブジェクトの取得、タグクラウドなどのタグを管理するためのgemです。 Railsでacts-as-taggable-onでタグ管理を行う方法について説明します。

RailsでCron設定をソース管理する!?wheneverを使ってCronを設定する

Cron設定を行えるgemのwheneverをRailsに導入する方法を説明します。 wheneverはRubyコードでCronの設定を行えるgemです。 これを使うことで、アプリケーションコードとCron設定を一緒にでき、ソース管理ができるのでCron設定の管理が楽になります。

RailsでSonspotを使って全文検索を行う

Sunspotは、オープンソースの全文検索システムのSolr(ソーラー)を使って、幅広い記述でパワフルな全文検索ができるRubyライブラリです。 商用ではSolrを立てる必要があります。開発環境では開発用のSolrサーバーを使います。

Railsでfriendly_idを使って検索エンジンにわかりやすいURLを作成する

friendly_idはURLにActiveRecordのIDを表示していた代わりに、人間や検索エンジンにわかりやすい文字列(slug)を表示するようにできるようにするGemです。 また、slugの変更履歴や他言語対応などの機能もあります。

Railsでawesome_nested_setとjsTreeでインタラクティブにツリー構造を操作する

Railsでawesome_nested_setとjQueryプラグインのjsTreeを使い、ツリー構造の操作(追加、リネーム、削除、変更)のUI/UXを向上させます。

Railsでawesome_nested_setを使って階層構造を作成する

awesome_nested_setとは、モデルを階層構造に管理できるようにするgemです。 フォルダ階層、カテゴリ階層、コメントへのリプライでの階層などツリー構造を表したい箇所で使うと便利です。

RailsでPaperTrailを使って取り消し機能を作成する

PaperTrailとは、モデルの変更(作成/更新/削除)をトラックするgemです。 PaperTrailを使って、モデルの作成/更新/削除の取り消し機能を実装します。

Railsのlink_toメソッドでclass属性を指定する

link_toメソッドでclass属性を指定するには、classオプションを利用します。

rails new時にアプリケーションテンプレートを使って簡単に初期設定をする

Railsの機能の「アプリケーションテンプレート」を使って、簡単にRailsの初期設定をできるようにしました。

rails newしたときの開発を効率化するためにまず行いたい6つの設定まとめ

よくRailsプロジェクトを作るので、Railsプロジェクトを作った後に最初にやっておきたい設定をまとめました。 主に、開発を効率化させるためにやることをまとめてますので、ざざっと眺めて取り入れそうな知識があったら開発効率を上げれるかもしれません。

RailsでAngularJSを使ってTodoアプリを作成 - 9. AngularJS + Railsでソート可能(Sortable)なリストを作成する

「RailsでAngularJSを使ってTodoアプリを作成」の連載9回目です。 RailsとAngularJSを使ってソート可能(Sortable)なリストを作成します。

RailsでAngularJSを使ってTodoアプリを作成 - 8. AngularJSで編集可能(Editable)なフィールドを作成する

「RailsでAngularJSを使ってTodoアプリを作成」の連載8回目です。 AngularJSで編集可能(Editable)なフィールドを作成し、Todoリスト名とTodoの内容を更新できるようにします。

RailsでAngularJSを使ってTodoアプリを作成 - 7. AngularJS + Kaminariでページネーション機能を実装

「RailsでAngularJSを使ってTodoアプリを作成」の連載7回目です。 AngularJSとkaminariを使いページネーションを実装します。

RailsでAngularJSを使ってTodoアプリを作成 - 6. AngularJS + Ransackで検索機能を実装

「RailsでAngularJSを使ってTodoアプリを作成」の連載6回目です。 検索機能を追加するRansackを使って、AngularJSを使ったTodoの動的な検索機能を追加します。

RailsでAngularJSを使ってTodoアプリを作成 - 5. ngRouteでシングルページにする

「RailsでAngularJSを使ってTodoアプリを作成」の連載5回目です。 AngularJSのルーティングモジュールのng-routeで、複数のビューファイルをシングルページとして遷移できるようにします。

RailsでAngularJSを使ってTodoアプリを作成 - 4. ngResource + Rails API化

「RailsでAngularJSを使ってTodoアプリを作成」の連載4回目です。 AngularJSのRESTfulサービスとの通信機能を簡単に実装できるモジュールのngResourceを使い、Railsで作ったAPIにアクセスし、Todoリストを作成/更新/削除を永続化できるようにします。