Railsを使用した開発をするときの設定やおすすめ拡張機能について取り上げます。主体となって開発、提供しているプログラミングコードエディタです。オープンソースであり、無料で利用することができます。vscodeに類似するエディタにGithubが開発しているAtomがありますが、後発のvscodeの方がスピードや利便性が高かったため、WESEEKでは早い段階で使用するエディタをatomからvscodeに移行しました。公開されている拡張機能(Extension)を追加でインストールすることで、対応するプログラミング言語を増やすことができます。対応したプログラミング言語で記述されたプログラムソースファイルをvscodeで扱うとき、以下の挙げる便利な機能の恩恵を得られます。注目しているmethodなどを利用している箇所の表示)デバッグコードリファクタコードを書く人にとっては言うまでもありませんが、これらの機能はプログラミングの効率や正確さに大きく影響するといって過言ではありません。技術者に例えてもよいでしょう。プロジェクトでのvscodeの設定を統一するvscodeは400を超える設定項目があり、自分の好みにカスタマイズすることができます。選ぶことで設定を編集する画面が表示されます。個人で変更した設定はsettings.jsonというJSONファイルで特定のディレクトリに保存されます。個人の好みに合わせてvscodeの見た目や挙動を変更することで、より使いやすくすることができます。設定項目によっては、開発プロジェクトのコーディング規則を逸脱してしまう場合もあります。例としてはインデントの扱いが最もわかりやすいでしょう。コードの構造の視認性を維持するためにプロジェクト内でのインデントルールをそろえるのは重要です。ところが、「インデントはスペース2つとする」というコーディング規則になっているのにもかかわらず、ある人のエディタではインデントはタブキーを押すとタブ文字(\t)が挿入される設定になっているが、別の人のエディタではスペースが4つ挿入される設定になっていたとしたら、コーディング規則を遵守するのにも一苦労です。このように個々人のエディタ設定差がプロジェクトでの問題にならないように、vscodeではプロジェクトでのvscodeの設定を強制することができます。やり方は簡単で、編集したいプロジェクトのディレクトリをvscodeで開いてから、先ほどの設定画面を開き、「ワークスペースの設定」タブをクリックしてから設定を変更するだけです。変更した設定はそのプロジェクトのディレクトリに「.vscode」というディレクトリが作成され、そのなかの「settings.json」に保存されます。このファイルをプロジェクトのVCSで管理対象にすることで開発者に設定を展開することができるようになります。各個人で該当する設定がカスタマイズされていたとしてもプロジェクトのvscode設定内容が優先されるようになっています。(逆に各個人で自由に設定できるべき項目(例えばフォントの大きさ)をプロジェクトの設定にしてしまうと、大ブーイングにこと間違いなしです。指定をすることもできます。編集するには以下の手順を踏みます。extensions」を実行する。左側に表示されるサイドバーに表示されている「ワークスペースの推奨事項」の行の編集マーク(鉛筆のマーク)をクリックする。編集画面が表示されます。ディレクトリに作成されます。拡張機能名を列挙して記述します。そのプロジェクトディレクトリを開いたときに「このワークスペースには拡張機能の推奨事項があります」という通知が表示されるようになります。その通知の「すべてインストール」ボタンをクリックすることで、プロジェクトの推奨拡張機能を一括でインストールできるようになります。記述することで、拡張機能を特定の設定で利用するようにプロジェクトメンバ全体に展開することもできます。異なるエディタ間の設定もそろえようプロジェクトにおいては全員が同じエディタを使用して開発するのが望ましいと思います。エディタの使い方のサポート、情報共有などにもメリットがあります。プロジェクトメンバの中には自分の使い慣れたエディタで開発することを譲らない人もいるかもしれません。プロジェクトでは不特定多数のコントリビュータ-が参加することになるので、特定のエディタの利用を強制することは極めて難しくなります。使用するエディタが異なっていても最低限の共通の設定をプロジェクトに展開したいことがあります。触れたインデントなどのコーティング規則にかかわる設定がそれにあたります。複数のエディタ間でコーティングスタイルを定義するための仕組みです。ファイルを配置し、これを仕様通りに記述することで、設定を宣言します。エディタはこのファイルを読み取ることでコーティングスタイルに沿う設定を適用します。主要なエディタは標準で対応しているか、またはプラグインを導入することで対応できます。導入することで対応できます。設定できるのは8項目と少ないですが、エディタを絞ることが難しいプロジェクトでは重宝します。使用する場合には共通して使えるテクニックを紹介しました。アプリケーションを開発する際に有用な拡張機能と設定をご紹介します。Rubyを扱う場合にまず必要といってよい拡張機能です。デバッガ、linter、入力補完、コードナビゲーションの機能が提供されています。私のおすすめする設定は下記の通りです。serverを有効にします。ブロックを区切り語にカーソルが当たっているときに、対になる区切り語もハイライトされて認識しやすくなります。true}一方で下記の機能は有効にしていません。使用している場合にリアルタイムでlint結果を表示してくれる機能です。動く仕様になっており、プロジェクトとして対応不要なはずの警告が出てしまう状態になるため使用していません。拡張機能の方で有効にしています。いう設定にすると強力な入力補完機能が有効になります。裏で実際にコードを実行することで入力補完を強力にしているため、編集中のコードがruby外部に影響を及ぼす(例えば、ファイルを削除したり)場合に、意図しないタイミングで実行されるなどのトラブルがあり得るため使用しないようにしています。使うための拡張機能です。linterや入力補完、コードナビゲーション、ドキュメント表示の機能が提供されています。インストールが必要です。ファイルに記述してプロジェクトのディレクトリに配置する必要があります。設定で問題ない場合は設定ファイルは不要です。設定は下記の通りです。設定は下記の通りです。コードナビゲーションの機能を有効にする設定です。コード診断(lint)を有効にする設定です。コードの自動修正を有効にする設定です。コードの指摘がある状態で該当ファイルを保存したときに、機械的に修正可能な指摘点を自動で修正した上で保存するようになります。対が判別しやすくなる拡張機能です。以外の言語でも使用できます。対になっているか瞬時に判断できない場合があります。対ごとに別の配色で表示してくれるので、対を取り違える可能性を抑えることができます。記述を反別しやすくなる拡張機能です。以外の言語でも使用できます。いうように将来的に修正すべきコードであることを記述することがあります。する機能が提供されます。記述を見逃す可能性を抑えることができます。vscode-iconsファイルアイコンの拡張機能です。以外の言語でも使用できます。ファイル一覧などに表示されるファイル名の横に適切なアイコンが表示されるようになっています。拡張子をもつファイルにルビーのアイコンが表示されます。この拡張機能はより多くのアイコンが搭載されており、標準状態よりも更に適切なアイコンが割り当てられるようになります。アイコンが表示されるようになります。拡張機能を有効にするために以下の設定をすることをおすすめします。ワークベンチで使用するアイコンのテーマをvscode-iconsに指定します。開発の環境向上に少しでも参考になればと思います。ryosukeprofile:正確無比な開発マシーン。仕事お役立ち情報SNSでもご購読できます。業界初のスキルオークション型採用サービス「SEROKU」SEROKUは、フリーランスエンジニアが働きやすい社会を実現するための新しいプラットフォームです。フリーランスと企業がダイレクトにスキルオークションを通して、ダイレクトに結びつくことで、現在、開発現場で発生している様々な課題(法律面、報酬面)を解決します。