Visual Studio Code とは、Microsoftが開発したオープンソースのテキストエディタです。

2015年に公開され、まだ新しい部類のテキストエディターですが、多機能で使いやすいため多くのエンジニアやデザイナーが利用されています。
同じようなテキストエディタとして使われているのはAtomやVimが有名です。

ちなみに、Visual Studioという名称のMicrosoft製IDEがありますが、別物と考えてもらって良いでしょう。

今回はこちらの環境構築についてご紹介していきます。

前提

インストール

以下のコマンドでhomebrew caskから、Visual Studio Codeをインストールしましょう。

brew cask install visual-studio-code

起動確認

Visual Studio Codeを起動してみましょう。

正常に起動出来ましたね。
次に各種設定していきましょう。

ターミナルから起動出来るようにする

まずはShift+Cmd+Pで検索ボックスを起動し、>Shell Command: Installと入力し、ヒットしたメニューをクリックします。

クリックすると以下のようなダイアログが表示されます。

これで、ターミナルから以下のコマンドで指定したディレクトリをVisual Studio Codeで起動することが可能になりました。

code {ディレクトリパス}

ユーザー設定

次にエディター自体の設定をしていきます。

Visual Studio Codeは設定をsettings.jsonというファイルに記述して管理していきます。
ショートカットのCtrl + ,を実行してください。

そうするとユーザー設定のタブが表示されます。

設定自体はここにJsonの形式でどんどん追記していき、ファイルを保存すれば即時反映されます。
設定可能な項目はコチラを参照ください。

今回は以下のように最低限の設定してみました。

{
    "editor.cursorBlinking": "smooth",//カーソルアニメーションをスムーズ
    "editor.renderWhitespace": "boundary",//半角スペースを「・」表示
    "editor.renderIndentGuides": true,//インデントの高さの表示補助
    "editor.renderLineHighlight": "all",//選択行を行番号含めて強調表示
    "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}"//ファイル名をフルパス表示
}

インストールやユーザー設定も非常に簡単に指定することが出来ます。

個人的にはAtomより軽いイメージなので、サクッとプログラミングをするにはとてもオススメなので、是非インストールして見てください♪