VSCodeの導入方法|初期設定までを解説

VSCodeの導入方法|初期設定までを解説

Visual Studio Code(以下VSCode)のインストール方法から初期設定までさくっと解説します。

VSCodeインストール

VSCodeのインストールは下記のURLまたはGoogle検索にて「VSCode」と検索して画像の検索結果をクリックしてください。

https://azure.microsoft.com/ja-jp/products/visual-studio-code/

VSCode-Google検索

VSCodeの公式サイトから「Download now」をクリックします。

VSCode-main

お使いのPCに合わせてダウンロードをして下さい。

VSCodeダウンロード

ファイルを選択すると自動的にダウンロードが始まります。

ダウンロード終了後にファイルを開くと自動的にインストールが始まります。

VSCode install

「次へ」を押しすすめるとインストール完了します。

無事にインストールが完了したらVSCodeを起動してみましょう。

バージョンによって多少画面に違いはあるが

VSCode

このような画面が表示されます。赤線で囲っているチェックは外しておいて下さい。

それでは初期設定をしていきます。とはいえVSCodeは必要最低限の機能は予め備わっているので、これといって設定を行わずにコーディングを始める事ができます。

現段階では日本語化と「Live Server」のみインストールして置きましょう。

VSCode

画面左側のメニューの一番下の項目をクリックすると拡張機能を追加する事ができます。

まずは「Japanese」と検索して「Japanese Language Pack for 〜」をインストールします。

同様に「Live Server」と検索して下記の画像と同じ項目をインストールして下さい。

VSCode

インストール完了後、一度VSCodeを閉じてから再起動をして下さい。

これでインストールした機能が反映されます。

 data-src=

プログラミング情報サイト「In-Output」

当サイトではプログラミング言語の情報を発信しています。
HTMLやCSSのマークアップ言語の学習方法や解説、WordPressでのサイト開設方法、python等のプログラミング言語を使用して日頃の作業の効率化等、皆様のお役に立てるサイトを目指しています。

CTR IMG