Help us understand the problem. What is going on with this article?

俺のおすすめVSCode拡張【2018年7-12月】

More than 1 year has passed since last update.

【2018年7-12月】に使っていたおすすめのVSCode拡張リストです。言語やフレームワークに偏らず、標準的なもののみ載せています。

俺のおすすめVSCode拡張【2018年7-12月】 | Ninologより転載

リスト

Auto Rename Tag

対応する開始タグと終了タグを同時に編集することができます。タグの閉じ忘れなどの防止に役立ちます。

my-vscode-extension-2018-2_01.png

Bookmarks

コード内にブックマークをつけることができます。これにより作業箇所の当たりを付けたり、似たようなファイルやコードが多い時は、次回作業する時の目印にしています。

my-vscode-extension-2018-2_02.png

Bracket Pair Colorizer

対応する{}・()などの括弧に色を付けて表示してくれます。どこからどこまでが範囲なのかが分かりやすくなります。

my-vscode-extension-2018-2_03.png

Docker

VSCodeに標準でインストールされていたと思うのですが、正直あまり使えていません。説明を読む限りはDokerfileの自動生成など結構便利なことができそうな感じもするのですが...今後もう少し試してみます。

my-vscode-extension-2018-2_04.png

Dracula Theme

霧がかったようなカラーのテーマです。好みはあるでしょうが俺は気に入ってます。他に使うテーマはVSCodeデフォルトで入っているHigh Contrastくらいです。

my-vscode-extension-2018-2_05.png

Git History

グラフィカルにGitの変更を表示することができます。条件を設定してソートして表示することもできるので流れがわかりやすくて便利です。

my-vscode-extension-2018-2_06.png

GitLens — Git supercharged

対象のコードを誰がいつ変更したかと、その内容を確認することができます。

my-vscode-extension-2018-2_07.png

indent-rainbow

インデントに色をつけて深さがわかりやすくなります。

my-vscode-extension-2018-2_08.png

Japanese Language Pack for Visual Studio Code

VSCodeの表示言語を日本語に変更できるようになります。

my-vscode-extension-2018-2_09.png

Material Icon Theme

VSCode内のファイルアイコンをマテリアルアイコンに変更できるようになります。ファイルアイコンは視覚的に分かりやすい方が好きです。

my-vscode-extension-2018-2_10.png

Output Colorizer

logファイルに色をつけて見やすくしてくれます。

my-vscode-extension-2018-2_11.png

Path Intellisense

パスやファイル名の入力補完ができるようになります。

my-vscode-extension-2018-2_12.png

Prettier - Code formatter

有名な自動整形ツールです。静的解析ばかりに目がいってフォーマット整形ができていないので、今後はPrettierも活用してクリーンコーディングを意識していきたいです。

my-vscode-extension-2018-2_13.png

Rainbow CSV

CSVのカラムデータに色をつけて見やすくしてくれます。

my-vscode-extension-2018-2_14.png

Regex Previewer

正規表現のリアルタイムプレビューを表示することができます。

my-vscode-extension-2018-2_15.png

Sort lines

選択した範囲のコード内で様々な条件でソートができるようになります。

my-vscode-extension-2018-2_16.png

SVG Viewer

VSCode内でSVGのプレビューをできるようにします。これが入ってないとSVGはテキストで表示されてしまうので不便です。

my-vscode-extension-2018-2_17.png

Todo+

コード内に書いたTodoなどを検索して一覧表示してくれます。リファクタリングする際の目印になります。

my-vscode-extension-2018-2_18.png

Trailing Spaces

コードの行末スペースを可視化します。削除忘れなどの確認になります。

my-vscode-extension-2018-2_19.png

2no553
インターネットと自由を愛するマークアップエンジニア兼クラウドエンジニア。20代は教師目指して働いたり、ボランティアしたり色々やって、ニートからバックパッカーとして世界一周、その後に30歳で未経験からWebプログラマーに転職。中国移住を目指して神奈川から福岡に移住し、今、西を目指し中。人生は何事も気楽が一番!
https://ninolog.com/profile/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away