リモートワークで導入して良かったツール詳しく見る

VS Codeの必須プラグイン一覧

じょじお

Visual Studio Codeをインストールしたら入れるべき拡張機能をまとめている記事です。

目次

VS Codeとは?

VSCode(ブイエスコード)はMicrosoftが提供する無料の高機能テキストエディタです。高機能なのに動作が軽快で使いやすいです。VSCodeはVisual Codeの略です。

VS Codeのインストールはこちら

VS Codeインストール

VS Codeのおすすめ拡張機能

拡張機能名機能説明設定メモ
Pythonインタープリタの選択などの簡略化
Japanese Language PackVSCodeの日本語化
autopep8PEP 8のコーディング規約に沿った形に自動整形python.formatting.providerPythonコードの整形に何を使用するか
flake8PEP 8のコーディング規約に沿っていなかったら破線で注意を促してくれます。python.linting.flake8EnabledWhether to lint Python files using flake8にチェック
Code Spell Checkerコードのスペルミスを教えてくれます。
indent-rainbowインデントに色付けして分かりやすくしてくれます。
AREPL for pythonVSCode上でリアルタイムデバッグできます。
Code Runner範囲選択している部分のコードをVSCode上で実行
Trailing Spaces行末の空白文字を表示
Bookmarksコードの好きな位置にブックマークをつけることができる
Better Comments特定の文字でコメントを色付け
GitLensgitのcommit間の差分を見やすく
LiveServer


簡易ローカルサーバーを起動し、HTMLやCSSの更新を検知してライブプレビューしてくれます。
Autoprefixer
各ブラウザでCSS3を正常に動作させるための記述(ベンダープレフィックス)を自動で記入してくれます。 
zenkakuコード中の全角スペースを教えてくれます。
Bracket Pair Colorizerペアになる ( ) や { } に色をつけて分かりやすくしてくれます。
IntelliSense for CSS class names in HTMLCSSのクラス名/id名を入力補完してくれます。
HTML CSS SupportCSSの補完をしてくれます。
CSSTree validatorHTMLとCSSのコード検証をしてくれます。
Auto Rename Tag開始タグ名を修正したとき、終了タグ名も修正してくれます。
Code Spell Checkerコードのスペルミスを教えてくれます。

VS Codeを日本語化する手順

下記が参考になります。

https://qiita.com/nanamesincos/items/5c48ff88a4eeef0a8631

ノンプログラマーでも自動化スキルを身につける。

よかったらシェアしてね!
URLをコピーする
URLをコピーしました!
目次
閉じる