VS Code をさらに便利にするためのおすすめ拡張機能のリストです。自分が感じた開発の効率化やコード品質向上に役立つものを厳選しています!
vscode-tailwindcss
Tailwind CSS を利用している開発者向けの拡張機能です。Tailwind のクラス名補完を行い、リアルタイムでスタイルを確認できるため、CSS のコーディングがよりスムーズになります。
npm-intellisense
JavaScript や TypeScript の開発に便利な拡張機能です。インポート時に npm パッケージ名の候補が表示されるため、パッケージ名を一々確認する手間が省けます。
path-intellisense
ファイルパスの補完機能を提供する拡張機能です。特に大規模なプロジェクトで、ファイルパスを素早く入力できるようになり、作業効率がアップします。
vscode-eslint
JavaScript のコード品質を保つために、ESLint を使用してリアルタイムでエラーや警告を表示します。コードの品質を維持し、バグを減らすのに最適です。
gitlens
Git の変更履歴や差分を視覚的に表示する強力なツールです。誰が、いつ、どのようにコードを変更したかを簡単に確認できます。
vscode-html-css
HTML ファイル内で CSS クラスや ID の補完をサポートします。CSS のスタイル名を覚える必要が減り、効率が上がります。
prettier-vscode
コード整形ツール Prettier を VS Code 上で使用するための拡張機能です。自動でコードフォーマットを行い、コードの見た目を統一します。
auto-rename-tag
HTML や JSX のタグを自動でリネームする拡張機能です。開始タグまたは終了タグを変更すると、対応するもう片方も自動で変更されます。
chatgpt-vscode
AI を活用したコード補完機能で、コーディングのアイデアや質問に対してリアルタイムで支援を提供します。開発中の疑問解消に役立ちます。
rest-client
API のテストや実行を VS Code 内で行えるようにする拡張機能です。API のエンドポイントを手軽にテストでき、API 開発を効率化します。
rainbow-csv
CSV ファイルのカラムを色分けして表示することで、視覚的にデータを把握しやすくする拡張機能です。データ管理に便利です。
git-graph
リポジトリのコミット履歴をグラフで表示するツールです。ブランチやマージの流れを可視化でき、作業内容が把握しやすくなります。
zenkaku
日本語の全角スペースや英数字などを強調表示する拡張機能です。日本語を扱う際に役立ち、意図しない全角文字の混入を防ぎます。
vscode-docker
Docker を利用した開発に便利な拡張機能で、コンテナの管理や Dockerfile のサポートを提供します。Docker 開発がスムーズに行えます。
language-pack-ja
VS Code を日本語化するための拡張機能です。日本語での操作が可能になり、使いやすさが向上します。
debugpy
Python のデバッグツールです。ブレークポイントを設定してコードの流れを確認し、バグを迅速に特定できます。
python
Python のコード補完やエラーチェックを行う公式拡張機能で、Python 開発には欠かせません。コードの自動フォーマットやリンティングも可能です。
vscode-pylance
Python コードの静的解析ツールで、より詳細なエラーチェックと型推論が行えます。コード品質の向上に貢献します。
remote-containers
Docker コンテナ内での開発をサポートする拡張機能です。ローカル環境に依存せず、再現性のある開発環境を提供します。
cpptools
C++ のコード補完やデバッグ機能を提供する公式拡張機能です。C++ 開発者にとって便利なツールです。
remote-explorer
リモート環境の管理を容易にする拡張機能です。リモート開発がスムーズに行え、ローカルとリモートの操作を統合できます。
liveshare
共同開発をサポートする拡張機能で、他の開発者とリアルタイムでコラボレーションが可能です。リモートでもチーム開発が行えます。
https://marketplace.visualstudio.com/items?itemName=ms-vsliveshare.vsliveshare
indent-rainbow
インデントのレベルに応じて色を付けることで、コードの階層構造を把握しやすくします。ネストの多いコードでも視覚的に確認できます。
material-icon-theme
ファイルアイコンをカスタマイズし、視覚的に見やすくする拡張機能です。プロジェクト内のファイル構造が把握しやすくなります。
trailing-spaces
コード内の不要な空白を強調表示し、自動削除できる拡張機能です。コードのクリーンさを保つのに役立ちます。
code-spell-checker
コード内のスペルミスをチェックする拡張機能です。変数名やコメントの綴りを確認し、タイプミスを防ぎます。
tabnine-vscode
AI を活用したコード補完エンジンで、最適なコード補完候補を提示します。生産性が向上し、コーディングの効率が上がります。
errorlens
コードエラーや警告を行内で強調表示する拡張機能です。問題箇所を視覚的に確認しやすくなり、バグの早期発見に役立ちます。
intellicode-api-usage-examples
API の使用例を提示し、API の理解を深めるのに役立つ拡張機能です。コード例から API の活用方法が学べます。
vscodeintellicode
AI を利用したコード補完支援機能で、最適なコード候補を提供します。さまざまなプログラミング言語で効率的にコードを作成できます。
javascriptsnippets
JavaScript のスニペット集で、基本的な構文を素早く入力できるようにします。JavaScript のコーディング効率を高めたい方に最適です。