VSCodeをインストールしよう！日本語化についてもご紹介(Windows・Mac・Linux)

Contents

VSCodeとは？無料の人気コードエディター
VSCodeのインストール方法
VSCodeの基本設定
最初のプロジェクトの開始
VSCodeをインストールして効率的に学習しよう

VSCodeとは？無料の人気コードエディター

VSCode(Visual Studio Code)は、高いカスタマイズ性と豊富な機能で、世界中の開発者に選ばれている無料の人気コードエディターです。

直感的な操作性、軽快な動作、そしてプログラミング言語やフレームワークに対する広範なサポートを理由に幅広いユーザーに愛用されています。

本記事では、これからプログラミングを始める人向けに、VSCodeのインストール方法や基本的な設定、プロジェクトの作成や管理について解説します。

VSCodeのインストール方法

公式サイトからのダウンロードリンクと、サポートされているオペレーティングシステムをリストアップします。

Windowsでインストール

WindowsでVSCodeをインストールする手順は次のとおりです。

STEP1：VSCode公式サイトにアクセス

Visual Studio Code の公式サイトにアクセスします。

STEP2：ダウンロード

ページ上部にある「Download」ボタンをクリックします。

表示されたページから「Windows10・11」をクリックするとインストーラーがダウンロードされます。

STEP3：インストーラーの実行

ダウンロードしたインストーラー（例: VSCodeUserSetup-{version}.exe）を実行します。

STEP4：インストールオプションの選択

インストール中に表示されるオプションで、好みに応じて設定を選択します。特に「PATHへの追加」のオプションを選択すると、コマンドラインからVSCodeを起動できるようになり便利です。

STEP5：インストールの完了

「Install」ボタンをクリックしてインストールを完了します。インストールが完了すると、VSCodeを起動することができます。

macOSでインストール

macOSでVSCodeをインストールする手順は次のとおりです。

STEP1：VSCode公式サイトへアクセス

ブラウザでVisual Studio Codeの公式サイトにアクセスします。

STEP2：ダウンロード

ページ上部にある「Download」ボタンをクリックします。

表示されたページから「Mac」をクリックするとインストーラーがダウンロードされます。

STEP3：インストーラーを開く

ダウンロードした .zip ファイルをクリックし、「Visual Studio Code.app」表示させます。

STEP4：アプリケーションフォルダに追加

ドラッグ&ドロップで「Visual Studio Code.app」をアプリケーションフォルダに移動します。

STEP5：VSCodeを開く

アプリケーションフォルダからVSCodeを開きます。

Linuxでインストール

Linux上でVisual Studio Code（VS Code）をインストールする方法は、使用しているLinuxディストリビューションによって異なります。

ここでは、主にDebian/Ubuntuベースのディストリビューション、RHEL/Fedora/CentOSベースのディストリビューション、そしてSnapを使用した方法について説明します。

DebianおよびUbuntuベースのディストリビューション

STEP1：.debパッケージのダウンロードとインストール

Visual Studio Codeの公式ダウンロードページから、対応する.debパッケージ（64ビット推奨）をダウンロードします。

ダウンロードしたファイルがあるディレクトリでターミナルを開き、以下のコマンドを実行してインストールします。

sudo apt install ./<ダウンロードしたファイル名>.deb

古いディストリビューションを使用している場合、代わりに以下のコマンドを実行する必要があります。

sudo dpkg -i <ダウンロードしたファイル名>.deb
sudo apt-get install -f

STEP2：aptリポジトリと署名キーの手動での追加（オプション）

以下のコマンドを実行し、Microsoftの署名キーを追加し、VS Codeのリポジトリをシステムに追加します。

sudo apt-get install wget gpg
wget -qO- https://packages.microsoft.com/keys/microsoft.asc | gpg --dearmor > packages.microsoft.gpg
sudo install -D -o root -g root -m 644 packages.microsoft.gpg /etc/apt/keyrings/packages.microsoft.gpg
sudo sh -c 'echo "deb [arch=amd64,arm64,armhf signed-by=/etc/apt/keyrings/packages.microsoft.gpg] https://packages.microsoft.com/repos/code stable main" > /etc/apt/sources.list.d/vscode.list'
rm -f packages.microsoft.gpg

次に、システムのパッケージリストを更新し、VS Codeをインストールします。

sudo apt install apt-transport-https
sudo apt update
sudo apt install code # code-insidersで開発版をインストールすることも可能

RHEL、Fedora、CentOSベースのディストリビューション

yumリポジトリの追加とインストール

以下のコマンドを実行して、Microsoftの署名キーを追加し、VS Codeのリポジトリを設定します。

sudo rpm --import https://packages.microsoft.com/keys/microsoft.asc
sudo sh -c 'echo -e "[code]\nname=Visual Studio Code\nbaseurl=https://packages.microsoft.com/yumrepos/vscode\nenabled=1\ngpgcheck=1\ngpgkey=https://packages.microsoft.com/keys/microsoft.asc" > /etc/yum.repos.d/vscode.repo'

Fedora 22以降では、dnfを使用してVS Codeをインストールします。

dnf check-update
sudo dnf install code # またはcode-insiders

Snapを使用したインストール

STEP1：Snapパッケージのインストール

SnapをサポートするLinuxディストリビューションでは、以下のコマンドで簡単にVS Codeをインストールできます。

sudo snap install --classic code # またはcode-insiders

Snapを使用すると、VS Codeに新しいバージョンがリリースされた際に、SnapデーモンがVS Codeを自動的に更新し、アップデートが利用可能になると通知が表示されます。

LinuxにVS Codeをインストールする方法まとめ

Debian/Ubuntuベースのディストリビューションでは、.debパッケージをダウンロードしてインストールする方法があります。この方法は直感的で、GUIを介してもターミナルを介しても行えます。
RHEL/Fedora/CentOSベースのディストリビューションでは、yumリポジトリを追加してからインストールする方法があります。このプロセスは、コマンドラインを通じて行われ、システムのパッケージ管理に統合されます。
Snapを使用する方法は、サポートされているすべてのLinuxディストリビューションで利用可能です。Snapパッケージは自己完結型で、依存関係を含んでいるため、インストールが簡単で、自動的に更新されます。

使用しているLinuxディストリビューション、好みのインストール方法（GUI対コマンドライン）、およびアップデート管理の好み（自動更新か手動更新か）でインストール方法を選びましょう。

VSCodeの基本設定

VSCodeは初期状態でも非常に強力なコードエディタですが、基本的な設定を行うことで、さらに使いやすくカスタマイズすることができます。

インターフェイスの概要

VSCodeのインターフェイスはシンプルで使いやすくなっています。

左側にはアクティビティバーがあり、ファイルのエクスプローラー、検索機能、ソースコントロール、デバッグ、拡張機能などへのアクセスできます。

画面の中央にはエディターウィンドウがあり、コードの編集を行います。下部にはターミナルやデバッグ情報などを表示するパネルがあります。

アクティビティバー
エディターウィンドウ
ターミナルやデバッグ情報などを表示するパネル

インストール後のカスタマイズ

拡張機能の追加

VSCodeの機能は、拡張機能をインストールすることで大きく拡張できます。

拡張機能は左側のアクティビティバーからアクセスし、「拡張機能」ビューで検索してインストールします。

以下の記事では、VSCodeの日本語化について詳しく解説しています。VSCodeを日本語で使いたい人は、ぜひ参考にしてみてください。

テーマの変更

VSCodeでは、様々なカラーテーマを選択して、エディターの外観をカスタマイズできます。テーマは「ファイル」>「環境設定」>「カラーテーマ」から変更可能です。

テーマの変更手順

STEP1：コマンドパレットを開く

Ctrl+Shift+P (Windows/Linux) または Cmd+Shift+P (Mac) を押して、コマンドパレットを開きます。

STEP2: テーマ設定を検索

コマンドパレットに「Color Theme」と入力し、表示された「Preferences: Color Theme」を選択します。

STEP3: テーマの選択

矢印キーを使って、使用したいテーマを選択します。VSCodeには標準で多数のテーマが用意されており、ダークテーマやライトテーマなど、好みに合わせて選ぶことができます。

フォントとサイズの調整

エディタのフォントやフォントサイズ、行間も自由に設定できます。

STEP1：設定を開く

画面左下の歯車アイコンをクリックし、「設定」を選択します。
ショートカットキー： Ctrl + , (Windows/Linux) または Cmd + , (Mac)

STEP2：ユーザー設定にアクセス

画面の上部にある検索バーに「フォント」と入力します。関連する設定がフィルタリングされ、簡単にアクセスできるようになります。

ショートカットキーのカスタマイズ

ショートカットキーのカスタマイズにより、よく使用する機能へのアクセスが迅速になり、コーディングの効率が上がります。以下の手順で設定の変更が可能です。

STEP1: コマンドパレットを開く

VSCodeで Ctrl+Shift+P (Windows/Linux) または Cmd+Shift+P (Mac) を押し、コマンドパレットを開きます。

STEP2：ショートカットキー設定を開く

コマンドパレットに「キーボードショートカット」と入力し、「キーボードショートカットを開く」を選択します。

STEP3：ショートカットキーを検索する

ショートカットキー設定タブが開きます。ここで、変更したいショートカットの機能名を検索バーに入力して見つけます。

STEP4：ショートカットキーを編集する

変更したいショートカットキーの行をクリックし、「キーバインドの変更」を選択します。新しいキーバインド（ショートカットキーの組み合わせ）を入力し、Enter を押して確定します。

STEP5：変更を保存する

自動的に変更が保存されます。設定ウィンドウを閉じて完了です。

便利なショートカットキー(デフォルト設定)

開発効率を上げるために役立つ便利なショートカットキーです。

コマンド	Windows	Mac
ファイル間の移動	Ctrl+Tab	Cmd+Tab
コマンドパレットの表示	Ctrl+Shift+P	Cmd+Shift+P
ファイルの保存	Ctrl+S	Cmd+S
ファイルの新規作成	Ctrl+N	Cmd+N
サイドバーの表示/非表示	Ctrl+B	Cmd+B
ファイル検索	Ctrl+P	Cmd+P
現在のファイル内での検索	Ctrl+F	Cmd+F
現在のファイル内での置換	Ctrl+H	Cmd+H