【visual studio code】ビジュアルスタジオコードの設定とおすすめの拡張機能

みなさんはコーディングをするときにどんなエディタを使っていますか?

エディタもいろいろな種類があるので人それぞれ違うと思います。

そのエディタのなかでも使いやすいなと思ったのがvisual studio codeです。

無料でいて拡張機能も豊富にあるため自分の使いやすいようにカスタマイズすることができます。

今回はvisual studio codeの設定とおすすめの拡張機能を紹介していきたいと思います。

未経験でも安心!人気のプログラミングスクール

マンツーマン指導だから未経験からプログラミングが学べて高いコーディングスキルが身につく人気のテックキャンプ!

visual studio code

visual studio codeのインストール

visual studio codeをすでにインストールしている人は読み進めてください。

まだvisual studio codeをインストールしていない人は下記のページからダウンロードしてインストールしてください。

※visual studio codeはwindowsにもMacにも対応しています。

visual studio codeの便利な機能

同じ複数の単語や文字列を修正する

visual studio codeでは同じ単語が複数ある場合に一括で修正や削除することができます。

文字列にカーソルを合わせてショートカットキー「Shift + Ctrl + L」を押します。

これで一括で文字列を修正したり削除することが可能です。

文字列の置換

「Ctrl+H」または「Ctrl+Shift+H」で文字列を置換させることができます。

インデントの調整する

文字列を選択して「Shift + Alt + F」をクリックします。

おすすめの拡張機能

Japanese Language Pack for Visual Studio Code

visual studio codeをインストールした初期だと英語になっていてわかりにくいと思います。

こちらの拡張機能を入れることで日本語で表示されます。

Code Spell Checker

リアルタイムにスペルチェックを行ってくれます。

文字列でおかしいところがあれば波線で指摘をしてくれます。

これによってコードミスなどを見つけやすくなります。

zenkaku

全角スペースを強調して表示してくれる拡張機能になります。

全角スペースによって表示崩れや問題が起こることもあるのでこちらを入れておくことで問題を早く見つけることができると思います。

Path Intellisense

HTMLの終了タグを自動的に追加してくれる拡張機能になります。

change-case

単語の大文字や小文字変換をしてくれる拡張機能です。

vscode-reveal

社内で使う簡単なプレゼン資料などを作成できる拡張機能になります。

ESLint

ESLintは、JavaScriptなどの構文エラーを検知してくれる拡張機能になります。

普段、javascriptをよく記述するエンジニアにはおすすめの拡張機能です。

コメント

タイトルとURLをコピーしました