2017-05-25

Atomエディタでrubocopを使ってコードの品質を保つ

Atomエディタを使ってRuby on Railsのアプリケーションを開発している人向けの記事です。セットアップから使い方まで書いていきます。

出来ること

コーディング規約に沿ったコードが記述出来ているか簡単に確認出来ます。私はAtomエディタを使っているのでAtomパッケージのlinterとlinter-rubocopを使ってコードをチェックすることにしました。以下の画像のように修正箇所や修正内容が一目で確認できます。

修正箇所が発生している状態の画面

f:id:hattori6789:20170530220855p:plain

青い波線付近へマウスオーバーさせると

> Prefer double…

のように修正内容が表示されます。

出来ること
目次
準備と使い方のまとめ
準備
使い方
- コードをチェックする
- コードを修正する
あとがき
- rubocop導入背景
追記
- コーディングルールを変更しよう（2017/05/29）
- rubocop-linterのパスを設定する？（2017/05/30）
お世話になったサイト

準備と使い方のまとめ

AtomパッケージのLinterとlinter-rubocopをインストール
RubyGemsのrubocopをインストール
Atomでファイルを保存してコードをチェック
Atomのコマンドパレットを開きLinter rubocop: Fix Fileと入力してコードを修正

準備

Atomパッケージをインストールする

Atomの環境設定から以下の２つのパッケージを検索しインストールします。

Linter
linter-rubocop（Linter用プラグイン）

Atomの環境設定画面で検索します。（Atom > Preferences… > Install タブ）

rubocop gemをインストールする

コマンドラインでrubocop gem をインストールします。 $ gem install rubocop

インストール出来たか確認します。現時点でインストールされたrubocopのバージョンは0.48.1でした。

$ rubocop -v
0.48.1

準備補足

ここまでの作業を終えてAtomエディタを開くとrubocopを使うことに必要なパッケージをAtomエディタ誘導してくれるので各パッケージをインストールします。

使い方

コードをチェックする

コードを記述したらcommand + s でファイルを保存します。保存が終了した頃にrubocopが解析したコードで修正した方が良いところを教えてくれます。

コードを修正する

Atomのコマンドパレットを開きLinter rubocop: Fix Fileと入力してコードを修正します。 Atomのコマンドパレットの開くショートカットキーはcommand + Shift + pです。

あとがき

rubocop導入背景

GitHubでプルリクのレビュー依頼した際に「Railsのrubocopではダブルクォート優先になってるのでそのように修正して下さい」とコメントがありました。同じことを繰り返さないように早速rubocopを使って静的なコード解析をすることにした。Atomエディタでrubocopを使ったコード解析はファイルを保存するだけでコードのチェックが出来るため大変便利です。その他のAtomパッケージもあるので、使い勝手や開発が活発かどうか見て改めて選択しても良さそうです。リアルタイムにチェックしてくれるパッケージもあるようです。

追記

コーディングルールを変更しよう（2017/05/29）

Rubocopのコーディングルールをデフォルトから変更したい場合、プロジェクトのルートディレクトリに.rubocop.ymlを作成してルールを書くことで、デフォルトのルールを上書きできます。『Rails rubocop.yml』などで検索すると参考になるページが見つかりそうです。rails/.rubocop.yml at master · rails/rails · GitHub

rubocop-linterのパスを設定する？（2017/05/30）

公式サイトを見ると特に記載がありませんが、RVMでRubyのバージョン管理をしている場合はパスを設定する必要があるようです。 Using RVM 自身の場合はrbenvでRubyのバージョン管理しており、特にパスを設定せずに使えました。

お世話になったサイト

ありがとうございました！

2017-01-20

binding.pryがある行をプロジェクトから一括削除する

背景と課題

Railsで作られたアプリケーションをpry, pry-byebug gemを使用してデバッグしている。複数記述したbinding.pryがある行を、プロジェクトから楽に一括削除したい。

環境

Mac
Atomエディタを使用
エディタの設定はTabが半角スペース二つになるようになっている

解決方法

Atomの一括置換機能と正規表現を使用する。

手順

AtomのショートカットキーCmd + Shift + f を使用し、プロジェクト内検索パネルを表示
AtomエディタのFind in projectに*binding.pry\nを入力（*の前には半角スペースを入れる）
AtomエディタのReplace Allをクリック

感想

他にやり方ありそうだけど、標準機能でないんだろうか。

2016-10-13

怖話をひと通り使って感想と改善案を書く（256 INTERNS 作業週）

怖話のコンテンツが充実しすぎィィィイイイイ

f:id:hattori6789:20161013195100p:plain

どっぷり怖話を楽しんでいる@hattori6789です。
※怒られたら画像消します。

今回は、iPhoneアプリで怖話を利用するユーザー（特に閲覧者）の目線で怖話を使って、

操作で迷った事
それぞれの改善策
あったらいいかもしれない機能

について書きます。
（実際は、iPhoneアプリ、iPhoneブラウザ、PCブラウザ通り試しました。）

怖話のコンテンツが充実しすぎィィィイイイイ
目次
操作で迷った事
それぞれの改善策
自分に出来そうなこと
あったらいいかも・その他（思いつき）
余談
- なぜ操作で迷った事に焦点を絞ったのか
- 自分の好みの話を出来るだけ簡単に探す方法
- おまけ

2016-10-06

256INTERNSにリモートインターンとして参加しました

256 INTERNS

寿司と焼鳥が好物@hattori6789です。

昨日の夕方より256 INTERNS に参加しました。
ブログを作成して記事を書く、という学習週の課題があるので、256internsへの参加経緯や、2日目のカレー的な感想を簡単に書こうと思います。

素敵なリモートワークツールを作ります[Draft]

About