Visual Studio Code｜おすすめ拡張機能５選

Visual Studio Codeをインストール

コーディング作業は「エディター」と呼ばれるソフトで行っていきます。

世の中には様々なエディターがありますが、おすすめはVisual Studio Code（通称：VSCode）です。VSCodeはMicrosoft社が開発したエディターで、かなり機能が充実していてとても使いやすいです。

以下のリンクからVSCodeをインストールしてください。

サイトにアクセスしたら、「今すぐダウンロード」をクリック。

WindowsのPCを使っている人はWindows、Macの場合はMac用のダウンロードボタンをクリックしてください。

以下のような画面が立ち上がればインストール成功です。

（若干見栄えが異なっていても問題ありません。）

VSCodeをインストールしただけだと表記が全て英語になってしまっています。

拡張機能を使って日本語に変えていきましょう。

画面左側にある５つのタブキーのうち、一番下のタブ（拡張機能）をクリックして、検索ボックスに”japanese”と入力してください。

すると一番上に” Japanese Language Pack”が出てくると思うので、そちらをクリックしてインストールしてください。

VSCodeを再起動すると全て日本語に翻訳されているはずです。

このようにVSCodeには様々な拡張機能があるので、より使いやすくするために自分用にカスタマイズしていくことが可能です。

VSCodeの日本語化が完了したら、さらに便利な拡張機能を追加してパワーアップさせておきましょう。初めの内は以下の５つを入れておくことをお薦めします！

ローカルサーバーを起動して、エディターの更新をライブで表示してくれます。

ブラウザによって対応していないコードもあるのですが、これを入れておくと各ブラウザでCSS3が正常に反映されるようになります。

スペルミスをしている箇所を教えてくれます。

開始タグを修正すると、自動で終了タグも修正してくれます。

CSSを補完してくれるプラグインです。

全角スペースを検知してくれます。*エディター内では基本的に半角のみ使用します。

たいち

すでに200名以上が受講しており、高評価も多くいただいています！