![見出し画像](https://assets.st-note.com/production/uploads/images/133060666/rectangle_large_type_2_a55ffdc1ccefd112b995f4f1ee3a4b18.png?width=1200)
【VSCode】まだそのプラグイン使ってないの? プログラミング作業を効率化するプラグイン・拡張機能11選
エンジニアっぽくないよねってよく言われます。どうもプラスジャムの磯部です。自分でもエンジニアっぽくないと思います。
そんな私ですが、今日はエンジニアっぽい記事を書くぞ!ということでエンジニアであれば誰もが使うエディター、そして一番使われているVSCodeのおすすめプラグインを11個紹介していきます。
この記事を読んで作業効率上げましょう🌵
Prettier - Code formatter
言わずもがなのプラグインではないでしょうか。
コードフォーマッターと呼ばれ、コードを整形=読みやすく整えてくれるプラグインです。VSCodeの設定であるAuto saveと組み合わせると保存した時に自動でフォーマッターが聞いてくれるので大変便利です。チーム開発には必須のプラグインです。
indent-rainbow
フォーマッター等でインデントを調整してくれますが、インデントが深くなると見辛くなってきます。それを色で可視化してくれることで見やすく保ってくれるプラグインです。
![](https://assets.st-note.com/img/1708586094475-mlvwxO3NR8.png)
Auto Close Tag
こちらは自動でタグを閉じてくれるプラグインです。
こういった小さい作業の積み重ねでコーディングの速さが変わってくるのでぜひ入れてみてください。
参照:Visual Studio Code Marketplace - Auto Close Tag
Auto Rename Tag
こちらはタグを書き換えた時に自動で閉じタグのネームも変えてくれる便利なプラグインとなっています。
参照:Visual Studio Code Marketplace - Auto Rename Tag
Code Spell Checker
ラグインの名前の如く、コード内で英単語のスペルをチェックしてくれます。英語に苦手意識のある日本人にとってはありがたい機能です。
関数などは読んですぐ理解できる名前にしたいですが、肝心の名前が間違っていると意味がわからなくります。そんな時でも目印で知らせてくれるのでありがたい、重宝するプラグインとなっています。
![](https://assets.st-note.com/img/1708584456579-fIfMNKMjVI.png?width=1200)
GitLens
このプラグインはGitの強力な機能をVS Code内で直接利用できるようにし、開発者がソースコードの履歴や変更をより深く理解するのを助けてくれます。
![](https://assets.st-note.com/img/1708584772736-OH75PT49Wo.png)
Image Preview
このプラグインはソースコード上の<img>タグに対し、画像のパスから画像取得し表示してくれる画期的なものになっています。これだけでもかなり助かるタイミングがあるので、ちょっとした時に恩恵を受けます。
![](https://assets.st-note.com/img/1708585176804-1l9vpBcVP3.png?width=1200)
CSScomb
CSSのプロパティ順を統一化してくれるプラグインです。
個人個人で書き方の癖がありますが、毎度並び順を整えてくれることでチーム開発でも効率的にミスなく開発できることにつながるのでおすすめです。
vscode-icons
業務に直結するかと言われるとそうではないかもしれないのですが「開発にも彩りを。」ということで入れてみると見栄えも良くなりますし、見慣れてくるとサッとファイルを見つけられるので入れておいても良いかもしれません。
![](https://assets.st-note.com/img/1708585691797-3OSaOEvDgI.png)
Gitmoji
GitへCommitする際に絵文字を頭文字につけることによってCommitの種別を判断しやすくするためのものです。チーム開発に役に立ちます。
例えば、hotfixは🚑、Improve performanceは⚡️など見た目で判断できたりします。
参照:Visual Studio Code Marketplace - Gitmoji
GitHub Copilot
今やなくてはならない存在のパートナーとなりましたが、有料なので最後に持ってきました。コメントアウトで関数の内容を詳しく説明するもよし、とりあえず書いているとコードの前後関係で予測してくれる、コミットを差分から自動で考えてくれるなど「Tabキー様様」状態のプラグインです。
月額10$(現在価格でおおよそ1500円)を渋っている場合ではありません。
![](https://assets.st-note.com/img/1708586361209-fQ5pASKmBP.png?width=1200)
まとめ
いかがでしたでしょうか。見たことはあるけど使ったことなかった、知らなかったから使ってみようとなっていただければ幸いです。
AIのおかげでどんどん作業効率が上がっていくと嬉しいなと思うばかりです。もし他にもおすすめのプラグインがあればぜひコメントで教えてください!
お読みいただきありがとうございました!🍻
✙
プラスジャムはWeb制作会社です。
ウェブサイト制作、システム開発、Webマーケティングなど、さまざまな課題解決やアイデアを具現化するWebソリューションを提案・提供しています。
![](https://assets.st-note.com/img/1708586804346-lfVt4ymYS6.png)
noteでプラスジャムを見つけてくださった方は、お時間あればコーポレートサイトや他の記事もご覧いただければ幸いです。
\コーポレートサイトはこちら/
\いつもはこんな記事書いてます/
[今回の記事担当]役職迷子!!な磯部
2021年入社。好きな言葉は "生いっちょ〜!"
業務上での工夫点や考え方、組織構築について発信します。