🚀 ニフティ’s Notion

2025-05-23

【Git2025 #7】座学&演習 1人でGitHubを使ってみよう

リモートリポジトリのおさらい リモートとローカルの関係性 リモートリポジトリに関わるGitコマンドの説明 clone push pull 演習 演習の流れ リモートリポジトリを作成 first commit 実務では？
この演習のゴール
GitHubにpushすることができること
GitHubを使うにあたり気をつけるべきことが理解できていること

リモートリポジトリのおさらい

Icon
リモートリポジトリ
  • 複数人で作業内容を共有するリポジトリ
  • ツールの提供などで開発する時以外にも使われることがある
リモートとローカルの関係性

リモートのファイルをローカル(個人のPC)に持ってきて作業を行い、更新をリモートへ共有するイメージ

image block

リモートリポジトリに関わるGitコマンドの説明

clone
  • リモートリポジトリのコピーとして手元のPCにローカルリポジトリを作成すること
push
  • ローカルリポジトリの作業内容をリモートに反映すること
    • 基本操作で出てきたこのボタンはローカルリポジトリをリモートに反映するときに使う
    image block
pull
  • ローカルリポジトリにリモートリポジトリの最新の内容を反映すること
  • VScodeのブランチの右にあるボタンを押すと、プッシュとプルが同時に行われる
image block
  • 下向き矢印がプル（他人の内容を取り込む）
  • 上向きがプッシュ（リモートに変更を反映）
  • git fetch + git merge を同時に行うことをpullと言います

演習

演習の流れ 
graph TD
A[GitHubでリモートリポジトリを作成する]　--> B[ローカルにディレクトリを作成]
B --> D[gitの初期化 - git init]
D --> E[作業内容をステージする - git add]
E --> F[ステージした変更をコミットしてローカルリポジトリに反映する - git commit]
F --> H[ローカルリポジトリとリモートリポジトリと紐づける - git remote add]
H --> I[ローカルリポジトリの内容をリモートリポジトリに反映する - git push]
リモートリポジトリを作成
  1. GitHubでリポジトリを作成する
  2. ローカルでディレクトリを作成する

    「emtg-2025-git-test」ディレクトリを作成

    ⌨️
    CLI操作の場合 
    $ mkdir emtg-2025-git-test
$ cd emtg-2025-git-test

    VSCodeでemtg-2025-git-testディレクトリを開きたければ、以下のコマンドを叩く 

    
$ code .

    フォルダーを開く

    image block

    任意の場所で新規ディレクトリとして、emtg-2025-git-testディレクトリを作成し、それを開く

first commit
⌨️
CLIでやりたい方向け
  1. README.mdの作成 
    $ echo "# emtg-2025-git-test" >> README.md
  2. gitの初期化 
    $ git init
  3. ディレクトリ内の全てのコードをステージする 
    $ git add .
  4. “first commit”という名前でコミットする 
    $ git commit -m "first commit"
  5. ブランチをmainに名前変更
    1. すでにブランチが以下のようにmainになっていればやらなくてもOK 
      $ git branch
* main
    $ git branch -M main
  6. リモートリポジトリの登録 
    $ git remote add origin {URL}
  7. リモートリポジトリにmainブランチを反映する

    -u は上流ブランチを設定している
    これにより、ローカルブランチがmainブランチの変更を追跡するようになる 

    $ git push -u origin main
  1. README.mdの作成 
    # emtg-2025-git-test
    image block
  2. リポジトリの初期化を行う
  3. ステージしてメッセージを記入し、コミット

    ※実際の講義ではGitHub Actionsを使用するパートがあるのでREADME.md以外のファイルも含まれています

    image block
    image block
  4. リモートリポジトリとの紐付け
    1. 「・・・」からリモート>リモートの追加を選択
      image block
    2. リモートリポジトリのURLを入力する
      image block

      URLはGitHub以下の部分のURLをコピーする

      image block

  5. リモート名としてoriginを入力してEnter
    image block
  6. mainブランチへプッシュ
    1. 左下の 🔄マークではプルとプッシュを同時に行うため、初回はプルするものがなくて怒られてしまう
    2. プッシュ、プルどちらかだけ行いたい場合は「・・・」からできる
      image block
  7. リモートにコミットできているかGithubで確認
    image block
実務では？

ここまでローカルリポジトリとリモートリポジトリを紐づける演習を行いましたが、実務ではすでにあるリモートリポジトリをローカルに持ってくることの方が圧倒的に多いです

そういう時はgit cloneを行うだけで簡単にリモートリポジトリをローカルリポジトリとしてコピーを保存することができます

image block
URLはリポジトリの右上 緑の <>Code ボタンからコピーできます
⌨️
CLIでやりたい方向け
  1. リモートリポジトリをcloneする 
    $ git clone {URL}

本来の研修ではこの後にチーム演習を行います！

エンジニア定例 2025 Git