Windows 11 への Visual Studio Code の インストール

Visual Studio Code（読み方：ビジュアル　スタジオ　コード、略称：VSCode（読み方：ブイ　エス　コード） ）は無料で使えるエディタです。VS Code は拡張性が高く、軽快に動作するため、多数のプログラム開発者に愛用されています。ここでは 18 歳の新入社員向けに VS Code  のインストール方法を紹介します。

## Visual Studio Code の特徴
VS Code の特徴を以下に挙げます。

### クロスプラットフォーム
VS Code は Windows、macOS、Linux で動作します。

### 多くのプログラミング言語に対応
VSCode は多くのプログラミング言語に対応しており、自動インデント、強調表示、コード補完などの効率的なプログラム作成のための機能が用意されています。

### 豊富な拡張機能
VS Code は拡張機能により機能を拡張できます。これにより、さまざまなプログラミング言語、フレームワーク、ツールに対応した環境を構築することができます。

## Visual Studio Code  のシステム要件
[VS Code のシステム要件](https://code.visualstudio.com/docs/supporting/requirements) は以下の通りです。

- プロセッサ： 1.6 GHz 以上のプロセッサ
- メモリ:　1 GB 以上
- HDD:　500 MB 以上の空き容量
- Windows:　Windows 10 (64ビット版)、11
- macOS:　最新と2つ前のリリース
- Linux:　Ubuntu Desktop 20.04, Debian 10, Red Hat Enterprise Linux 8, Fedora 36

ここでは Visual Studio Code version 1.85 を例にして、Windows 11 へのインストール方法を紹介します。

## Visual Studio Code のインストール手順
## Windows パッケージ マネージャー (winget) を使用してインストールする

Windows 11 は Windows パッケージ マネージャー サービスを介して VSCode をインストールすることができます

```Windows コマンド プロンプト
winget install -e --id Microsoft.VisualStudioCode
```

## Windows インストーラーを使用してインストールする
### ダウンロード

Visual Studio Code の公式ページにアクセスし、 「**Download for Windows**」ボタンをクリックします。
[https://code.visualstudio.com/](https://code.visualstudio.com/)

![01_officialsite.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/c54a48e5-5f84-2d4a-f84b-7f09b5d716cb.png)

### インストーラの起動
ダウンロードが完了したら、ファイルをダブルクリックし、インストーラを実行します。

![11_download.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/6a3c1f94-8de9-93b0-97e5-61af3fc85d69.png)

### ライセンスの確認
使用許諾契約の内容を確認して、「**同意する**」を選択し、「**次へ**」をクリックします。

![22_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/43d18d48-400d-2e77-76a1-f7723b69f30c.png)

### インストール先の選択
インストール先フォルダの選択画面が表示されたら、「**次へ**」をクリックします

![23_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/6262fa69-96a0-8401-93fc-d55ab86ac4db.png)

### スタートメニューの選択
スタートメニューフォルダの選択画面が表示されたら、「**次へ**」をクリックします

![24_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/97a36adf-15d1-b6ca-032a-ccd46e210f47.png)

### 追加タスクの選択
追加タスクの選択画面が表示されたら、「**次へ**」をクリックします

![25_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/ab7a8074-3b98-a56b-4ed4-6566b2967e0b.png)

### インストールの確認
インストールの準備完了画面が表示されたら、「**インストール**」をクリックします

![26_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/87c616cf-cfef-806c-c923-3967a9597900.png)

### インストールの終了
インストール完了画面が表示されたら、「**完了**」をクリックします。

![28_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/76e15bc6-48d4-c2b3-d078-5b4d4f91cfeb.png)

## 初回起動時の設定

### Visual Studio Codeの起動
Welcome 画面が表示されたら、Welcome の右にある「**X**」をクリックして、Welcome 画面を閉じます。

![31_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/b12d7395-4c67-cd00-600c-010b205c38b1.png)

### 拡張機能の追加
左端にある「**Extension（拡張機能）**」アイコンをクリックします。

![32_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/6ce4c24c-c19d-a7e5-ccd4-d39081380a93.png)

### 拡張機能の検索
拡張機能の検索ボックスに「**japanese**」と入力します。

![33_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/065297a1-ec17-3a7e-71f7-9af30a2ee98c.png)

### 拡張機能のインストール
検索結果に **Japanese Language Pack for Visual Studio Code** が表示されたら、「**Install**」をクリックします。

![34_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/4fd13494-edfe-e458-f0d3-cc1b787268ba.png)

### VSCode の再起動
右下に再起動を促すメッセージが表示されたら、「**Change Language and Restart**」をクリックします。

![35_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/7d928828-966f-c826-8081-48d32813c39a.png)

### 日本語化の終了
VSCode の再起動後に日本語のメニューが表示されれば、日本語化の完了です。

![36_installer.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3160433/846c81e4-c251-554a-abe1-62e542c6bee1.png)

## まとめ
この記事では Visual Studio Code のインストール方法と日本語化の手順を説明しました。

他の記事で各種のプログラム言語向けの使い方を紹介します。
- [C# 向け拡張機能のインストール](https://qiita.com/mmake/items/6748ad531ca7bd44a8ce)
- [Python 向け拡張機能のインストール](https://qiita.com/mmake/items/55401c6a9e2f3f0f3475)
- [Jupyter Notebook 向け拡張機能のインストール](https://qiita.com/mmake/items/05597e18641ba75fbdbf)
- [Markdown 向け拡張機能のインストール](https://qiita.com/mmake/items/6fa7bc77756422bdc46f)

## 参考文献
- Visual Studio Code on Windows
https://code.visualstudio.com/docs/setup/windows

- Japanese Language Pack for Visual Studio Code
https://marketplace.visualstudio.com/items?itemName=MS-CEINTL.vscode-language-pack-ja