はじめに：VS Code、英語ばかりで心が折れそうになっていませんか？
「よし、プログラミングを始めよう！」と意気込んでVS Code（Visual Studio Code）をインストールしたものの、メニューが全部英語で何をしていいか分からない…と戸惑っていませんか？
安心してください。誰でも最初は同じです。（私も始めた頃は、英語のメニューを見るだけでそっと画面を閉じていました…笑）
VS Codeの最大の魅力は、スマホのアプリのように「拡張機能（Extensions）」を自由に追加して、自分好みにカスタマイズできることです。
今回は、初心者の方が「とりあえずこれだけ入れておけば一気に使いやすくなる！」という神拡張機能を5つ厳選してご紹介します！
拡張機能をインストールする「たった3つ」の手順
拡張機能の入れ方はとても簡単です。
- VS Codeを開き、左側のバーにある四角いブロックのアイコンをクリック（ショートカット：
Ctrl + Shift + X） - 上部に出てくる検索バーに、入れたい拡張機能の名前を入力する
- 見つけたら、右下の青い「インストール」ボタンをクリックするだけ！
これだけで、VS Codeが劇的に進化します。それでは、さっそくおすすめの5つを見ていきましょう。
初心者に絶対おすすめのVS Code神拡張機能5選
私が日常的に使っていて、「これがないと仕事にならない！」と感じているものを厳選しました。
①【Japanese Language Pack】まずは画面を「日本語」に
何はともあれ、まずはこれです。VS Codeのメニューや設定画面などをすべて日本語にしてくれます。
英語のまま頑張るのも勉強になりますが、最初はツール自体の使い方を覚える方が優先です。これを入れるだけで、心理的なハードルがグッと下がりますよ！
- 検索名：
Japanese Language Pack for Visual Studio Code - 開発元： Microsoft
②【Prettier】自動でコードを綺麗に整頓
コードを書いていると、どうしても行の先頭の空白（インデント）がガタガタになってしまいがちです。
Prettier（プリティア）を入れると、ファイルを保存した瞬間に「自動でコードを綺麗な形に整理（フォーマット）」してくれます。
常に読みやすいコードが保てるので、エラーの原因も探しやすくなります。「設定 ➔ Editor: Format On Save」にチェックを入れておくのを忘れずに！
- 検索名：
Prettier - Code formatter
③【Auto Rename Tag】HTMLの修正もれを防止
HTMLでWebページを作っている方には必須の機能です。
例えば <h1> を <h2> に変更したとき、後ろの </h1> も手動で </h2> に直すのは面倒ですよね？これを入れておけば、開始タグを直すだけで、自動的に閉じタグも連動して修正してくれます。
- 検索名：
Auto Rename Tag
④【Path Intellisense】ファイル名の「打ち間違い」をゼロに
画像を表示させたり、別のファイルを読み込んだりする際、ファイル名やフォルダの場所（パス）を手打ちすると、1文字間違えただけでエラーになってしまいます。
この拡張機能を入れると、文字を打ち始めた瞬間に「このフォルダの中にはこんなファイルがありますよ」と候補を出してくれます。マウスや矢印キーで選ぶだけで入力できるので、タイピングミスによるイライラがなくなります！
- 検索名：
Path Intellisense
⑤【GitLens】過去の自分（やチーム）の変更履歴を見える化
少しだけ中級者向けになりますが、Git（ギット）を使ってコードの履歴管理をしているなら絶対に入れたい機能です。
コードの該当行をクリックするだけで、右端にうっすらと「誰が・いつ・どんな理由で変更したか」が表示されます。
「あれ？ここ、なんでこんなコードにしたんだっけ…？」という、”過去の自分からの挑戦状”を受け取った時などに非常に助かります（笑）
- 検索名：
GitLens — Git supercharged
💡 さかもと流：拡張機能は「入れすぎ注意」
ここまで便利な機能を紹介してきましたが、一つだけ注意点があります。
それは「便利そうだからといって、手当たり次第にインストールしないこと」です。
スマホのアプリと同じで、拡張機能を入れすぎるとVS Code自体の動作が重くなってしまいます。
「本当に今の自分に必要か？」を考えながら、必要最小限のものだけを厳選して入れるのが、快適に使い続けるコツです。
まとめ：少しの設定で、プログラミングをもっと楽しく！
今回ご紹介した5つの拡張機能をおさらいします。
| 拡張機能名 | メリット（何が楽になる？） |
|---|---|
| Japanese Language Pack | 画面が日本語になり、操作の迷いがなくなる |
| Prettier | 保存するだけでコードが美しく整う |
| Auto Rename Tag | HTMLタグの修正の手間が半分になる |
| Path Intellisense | ファイル名のタイピングミスがなくなる |
| GitLens | 誰がいつコードを直したかが一目で分かる |
まずは一番上の「日本語化（Japanese Language Pack）」と、コードを綺麗にしてくれる「Prettier」の2つだけでも入れてみてください。
それだけでも、VS Codeがあなただけの頼もしい相棒に変わるはずです！
少しの工夫で、プログラミングの時間はもっと快適で楽しいものになります。今日からぜひ試してみてくださいね。
コメント