[PR] 本記事にはプロモーションが含まれています。

【VS Code】GitHubにあるリポジトリを取り込んで開発を始める手順|クローン、保存先の注意、サインイン

VS CodeでGitHubのリポジトリを取り込む(クローンして開発を始める) Git

GitHub にすでにあるリポジトリを、自分の Windows のパソコンに取り込んで(クローンして)、VS Code で開発を始める手順です。次のようなときに使います。

  • ほかの人と一緒に使っているリポジトリを、自分のパソコンでも編集したい
  • GitHub のサイトで先にリポジトリを作り、README などを用意してある
  • 別のパソコンで作っていたリポジトリを、新しいパソコンに移したい

Git for Windows と名前・メールアドレスの設定がまだのときは、先に「WindowsでGitを使うための初期設定と基本操作」を済ませておきます。

急いでいる人向け:手順の要点

  1. GitHub のリポジトリのページで「<> Code」を押し、「HTTPS」の URL をコピーする
  2. VS Code の「エクスプローラー」(または「ソース管理」)で「リポジトリの複製」を押し、URL を貼って Enter
  3. 保存する場所を選んで「リポジトリの場所を選択」を押す(リポジトリ名のフォルダーは自動でできる。OneDrive で同期しているフォルダーは避ける)
  4. 右下の「クローンしたリポジトリを開きますか?」で「開く」を押す

くわしい手順と、つまずきやすいところは、このあと順番に説明します。

ステップ1:GitHub でリポジトリの URL をコピーする

GitHub で取り込みたいリポジトリのページを開き、緑色の「<> Code」ボタンをクリックします。

GitHubにあるリポジトリを取り込んで開発を始める手順:GitHub でリポジトリの URL をコピーする

「Local」タブで「HTTPS」が選ばれていることを確かめ、表示されている URL(https://github.com/ユーザー名/リポジトリ名.git の形)をコピーします。

GitHubにあるリポジトリを取り込んで開発を始める手順:GitHub でリポジトリの URL をコピーする(2)

ステップ2:VS Code でクローンする

VS Code を開きます。フォルダーは何も開いていない状態で構いません。

GitHubにあるリポジトリを取り込んで開発を始める手順:VS Code でクローンする

左のいちばん上の「エクスプローラー」を開き、青い「リポジトリの複製」ボタンをクリックします。左の「ソース管理」にある同じボタンからでも同じです。

GitHubにあるリポジトリを取り込んで開発を始める手順:VS Code でクローンする(2)

画面のいちばん上に入力欄が出るので、ステップ1でコピーした URL を貼り付けて Enter を押します。

GitHubにあるリポジトリを取り込んで開発を始める手順:VS Code でクローンする(3)

コマンドでやるとき

ターミナルで保存したい場所に移ってから、次のコマンドでも同じことができます。

PowerShell
git clone https://github.com/ユーザー名/リポジトリ名.git

ステップ3:保存する場所を選んで開く

フォルダーを選ぶ画面が開くので、保存したい場所を選んで「リポジトリの場所を選択」をクリックします。

  • 選んだ場所の中に、リポジトリ名のフォルダーが自動で作られます。自分でリポジトリ名のフォルダーを作っておく必要はありません(作ると二重になります)
  • OneDrive で同期しているフォルダーは避けます。Windows では「ドキュメント」や「デスクトップ」が OneDrive に同期されていることが多く、Git の管理用のファイルまで同期されて、動きがおかしくなることがあります。C:\dev のような、同期されない場所を用意しておくと安心です

取り込みが終わると、右下に「クローンしたリポジトリを開きますか?」と出るので、「開く」をクリックします。

GitHubにあるリポジトリを取り込んで開発を始める手順:保存する場所を選んで開く

リポジトリのファイルが VS Code で開きます。

GitHubにあるリポジトリを取り込んで開発を始める手順:保存する場所を選んで開く(2)

GitHub へのサインイン

非公開のリポジトリを取り込むときや、初めて GitHub に送る(プッシュする)ときは、GitHub にサインインする画面が出ます。ブラウザが開くので、GitHub にサインインして許可します。一度許可すると Windows に覚えておいてくれるので、次からは聞かれません。

GitHub のパスワードをターミナルに直接入れるやり方は、今は使えません。パスワードを聞かれて失敗するときは、ブラウザでのサインインの画面が出るように、Git for Windows を入れ直すか新しい版にします。

GitHub とつながっているか確かめる

クローンすると、取り込んだもとの GitHub の場所が、origin という名前で自動で登録されます。VS Code のターミナルで確かめられます。

PowerShell
git remote -v
Plaintext
origin  https://github.com/ユーザー名/リポジトリ名.git (fetch)
origin  https://github.com/ユーザー名/リポジトリ名.git (push)

この2行が出ていれば、このまま GitHub とやり取りできます。

取り込んだあとの進め方

  1. 作業を始める前に、「ソース管理」の「変更の同期」で、GitHub の最新の状態を取り込む
  2. ファイルを編集する
  3. 「ソース管理」で変更を確かめてコミットし、「変更の同期」で GitHub に送る

ほかの人や別のパソコンでも同じリポジトリを編集しているときは、始める前に同期しておくと、変更がぶつかりにくくなります。

手元のプロジェクトをあとから GitHub に上げるときは、「新規でリポジトリを作成し、ローカルの変更を登録する手順」をご覧ください。

まとめ

  • GitHub の「<> Code」から HTTPS の URL をコピーする
  • VS Code の「リポジトリの複製」に URL を貼り、保存する場所を選ぶ。リポジトリ名のフォルダーは自動でできる
  • OneDrive で同期しているフォルダーは避ける
  • 非公開のリポジトリや初めてのプッシュでは、ブラウザで GitHub にサインインする
  • git remote -v で origin を確かめ、作業の前に「変更の同期」をする
ほかの開発・プログラミングの記事は、開発・プログラミングメモの目次から、テーマ別に探せます。

このブログは、にほんブログ村と人気ブログランキングに参加しています。記事が役に立ったら、下のランキングのバナーのどれかを押して応援してもらえると励みになります。

ブログランキング・にほんブログ村へにほんブログ村

サーバー構築・運用ランキング プログラムランキング

GitVS Code
watasoftdevをフォローする

コメント