HTML・CSS独学応援 1-3「エディターのインストール方法」(VScode)

れおの部屋ではVScodeを使用して解説していきます
今回は、今後の学習で必要なVSコードのインストール方法を解説していきます。

学習は、VSコード以外のエディターを使用しても問題ありません。

すでにエディターをインストール済みの方、
自分の好みのエディターがある方はそちらを使用して学習してもOKです。

VSコードとは

VSコードは、マイクロソフト社が出している無料で使えるエディターです。

実際のプログラマーも使用している本格的なエディターですが
インストールや使い方はシンプルです。

学習終了後に、本格的にプログラミングをする時にも
そのまま使えるので、VSコードをおすすめしています。

インストール方法

VSコードの公式サイトからインストールしていきます。
具体的な手順と流れは以下の通りです。

繰り返しになりますが
VSコードは無料で使用できます。

インストールの手順


公式サイトを開くとこんな感じの画面になります。(2021年時点)

「今すぐダウンロード」をクリックしてください。
すると画面が下の画像のようになります。

自分のパソコンにあったものを選んでください。
クリックするとダウンロードが始まります。

ダウンロードされたファイルを開くと

こんな画面が出てきます。
「同意する」を選択しないと次には進めません。

次に進むとこんな画面になります。

学習をするにあたって、デスクトップからすぐ開けた方が便利なので
「デスクトップ上にアイコンを追加する」にチエックを入れておくのがおすすめです。

これでインストールは完了です。

VSコードの日本語化

インストールが完了開いてみると、
英語表記になっているので、日本語化していく手順も紹介しておきます。

日本語化しておいた方が、個人的には使いやすいのでおすすめです。

日本語化の流れ

VSコードは、英語表記がもともとの設定になっています。
開いてみると下のように、英語で表示されます。

このまま使用しても問題ないのですが、
やっぱり日本語の方が、何かと使いやすいのです。

下の画像を見てください。

左側に四角を組み合わせたアイコンがあります。
写真では①の部分です。

そこをクリックして、②の検索に
「Japanese Language Pack for Visual Studio Code」と
打ち込んでみてください。

画像にあるような、地球儀のマークが目印です。
これをインストールします。

一度VSコードを閉じて、VSコードを再度起動させると

無事に日本語化することができました。

これでVSコードを使って学習していく準備が整いました。