VS CodeとGitの導入・連携ガイド

自分のパソコンで快適にサイト制作を行うための「三種の神器」を揃えましょう。ここでは、エディタ(VS Code)と連携ツール(Git)のインストールから、GitHubとの接続までを解説します。

1. VS Codeをインストールする

まずは、記事を書くための高機能なテキストエディタ「Visual Studio Code(VS Code)」を導入します。

  1. VS Code公式サイトにアクセスし、お使いのOS(Windows/Mac)用をダウンロード・インストールします。
  2. 起動後、左側の「拡張機能アイコン(四角いマーク)」をクリックし、検索欄に **「Japanese」** と入力して **「Japanese Language Pack」** をインストールします。
  3. 右下に表示される「Restart(再起動)」ボタンを押すと、メニューが日本語になります。

2. Gitをインストールする

次に、ファイルをGitHubに送るためのツール「Git」を準備します。

  1. Git公式サイトからインストーラーをダウンロードし、実行します。
  2. 設定項目がいくつか出ますが、基本的にすべて **[Next](デフォルトのまま)** で進めて問題ありません。
  3. インストール完了後、パソコンを一度再起動することをおすすめします。

3. VS CodeからGitHubへ接続する

最後に、PCとクラウド(GitHub)を連携させます。ここが一番のポイントです。

  1. VS Codeを開き、左側の「ソース管理(枝分かれしたアイコン)」をクリックします。
  2. **「GitHubにサインイン」** というボタンが表示されるのでクリックします。
  3. ブラウザが立ち上がるので、自分のGitHubアカウントでログインし、アクセスを許可(Authorize)してください。
  4. これで、VS Code上で書いた記事を、ボタン一つで世界中に公開(GitHub Pagesへ反映)できるようになりました!

✅ ここまでの確認ポイント

  • VS Codeが日本語になっていますか?
  • GitHubアカウントでサインインできましたか?
  • 設定が完了したら、第7回で「SEOに強いHTML」を書き始めましょう!