Mac Visual Studio Code 導入方法 VSCode ダウンロードから日本語化対応まで～画像付き導入解説～

# 目的

- MacにVisual Studio Codeを導入する方法をまとめる

# 実施方法概要

1. ダウンロード
1. インストール
1. 起動テスト
1. 日本語化

# 実施方法詳細

1. ダウンロード
    1. 下記リンク先にアクセスする。
        - [https://azure.microsoft.com/ja-jp/products/visual-studio-code/](https://azure.microsoft.com/ja-jp/products/visual-studio-code/)
    1. 「今すぐ無料でダウンロードする」をクリックする。  
    ![スクリーンショット 2020-03-09 14.36.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/55d95266-0e52-ead4-cc51-2a1ee2b64c70.png)
    1. 「Mac」をクリックする。  
    ![スクリーンショット 2020-03-09 14.39.07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/ecf18db3-4324-8741-4c92-78372f0d5faa.png)
    1. ダウンロードが開始される。  
    ![スクリーンショット 2020-03-09 14.37.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/7817784a-91f5-e3dd-23f6-9a975e8744ee.png)
1. インストール
    1. ダウンロードフォルダを開く
    1. ダウンロードした「VSCode-darwin-stable.zip」を開く。  
    ![スクリーンショット 2020-03-09 14.41.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/da393b6e-6be8-f0af-ec57-f978efba6111.png)
    1. ダウンロードフォルダに「Visual Studio Code」のアプリが現れる。  
    ![スクリーンショット 2020-03-09 14.43.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/ad202428-914e-21b1-3897-7862a65ecd68.png)
    1. ダウンロードフォルダの「Visual Studio Code」をアプリケーションフォルダに移動する。  
    ![スクリーンショット 2020-03-09 14.45.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/f5fb2b4d-09f2-4f89-f51b-b7fcbe300432.png)
1. 起動テスト
    1. アプリケーションフォルダを開く。
    1. アプリケーションフォルダに存在する「Visual Studio Code」をクリックする。(起動時に悪質なソフトウェアかどうかを・・・というウインドウが出た方はこちら→[Mac Visual Studio Code 導入時に「悪質なソフトウェアかどうかを・・・」と出た話]())  
    ![スクリーンショット 2020-03-09 14.47.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/cea00cf8-af40-afd6-3991-7ffdfe5837c8.png)
    1. 下記のウインドウが開いた事を確認する。  
    ![スクリーンショット 2020-03-09 14.55.02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/d1700cb6-cf61-c915-548e-341d1760c6c2.png)
1. 日本語化
    1. 「Visual Studio Code」のアプリを起動する。
    1. 下記のウインドウが開く。  
    ![スクリーンショット 2020-03-09 15.05.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/17a5ac6f-5419-2dd9-4b6e-d3b88588f36a.png)
    1. Visual Studio Codeウインドウの左のバーの最下部のアイコン(ブロックが4個並んでいるアイコン)をクリックする。
    1. プラグインインストールのサイドバーが開く。  
    ![スクリーンショット 2020-03-09 15.09.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/bc2e47e9-2dfe-f13f-da02-70b75aba97e1.png)
    1. 「Search Extensions in Marketplace」と記載されている検索ウインドウに「Japanese」と記入する。  
    ![スクリーンショット 2020-03-09 15.58.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/b4b3bafd-4184-c7d1-7a3d-25df3c36b27b.png)
    1. 検索結果の一番上にある「Japanene Language Pack for Visual Studio Code」の「Install」をクリックする。  
    ![スクリーンショット 2020-03-09 16.00.18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/ca82a90e-47b9-c8b4-8378-771acae4edf3.png)
    1. ウインドウの右下に下記のポップアップが出たら「Restart Now」をクリックす。  
    ![スクリーンショット 2020-03-09 16.00.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/463839a9-4ea4-6c0a-c66d-ecb4ddd0aab9.png)
    1. 再起動したウインドウが日本語化されている事を確認する。  
    ![スクリーンショット 2020-03-09 16.07.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/5a72d82b-ab66-adf5-3ec8-808cd5b37149.png)