GitHubをはじめよう

第6章

枝を分けて試す

ここまでは、記録を1本の線の上に積んできました。うまくいくか分からないことを試したいとき、 その線に直接書き足すと、失敗したときに戻すのが面倒です。Git には線を分けて別々に進めるしくみがあります。これを枝(branch)と呼びます。 この章では枝を1つ作り、そこで書き足してから元へ戻り、元が何も変わっていないことを自分の目で確かめます。

この章が終わると
branch を切って戻る流れを、迷わずたどれる状態
用意するもの
第5章で GitHub へ送り終わったフォルダー。新しく入れるものはありません。

この章の進め方を選んでください

同じことを3つのやり方で説明します。どれを選んでも、できあがるものは同じです。 あとから何度でも変えられます。

ターミナル:黒い画面に命令を打ちます。遠回りに見えますが、Git が何をしているかがそのまま見えるので、あとで困ったときに自分で調べられるようになります。

VS Code:エディタ(VS Code)の画面で、ボタンを押して進めます。コマンドを覚えなくても同じことができます。中で動いているのは、ターミナルで打つのと同じ Git です。

AI エージェント:やりたいことを日本語で伝えて、AI に代わりにやってもらいます。ここでは Claude Code を例にしますが、載せている指示文は他のエージェントでもほとんどそのまま使えます。

下にスクロールすると、手順が1つずつ再生されます。見逃したら、スクロールを戻せば同じところが巻き戻ります。 この章で作る枝は add-usage という名前にします。 次の第7章で、この枝を本流へ取り込むところまで進みます。

ターミナルで進める

  1. 01 / 12

    第5章の続きです。送り終わったフォルダーの中で、ターミナルを開きます。

    ~/Documents/hello-github
  2. 02 / 12

    いまある枝の一覧を見ます。main が1つだけで、* が付いています。

    * は「いま立っている枝」の印です。枝とは、記録を積んでいく線のことだと思ってください。

    ~/Documents/hello-github
  3. 03 / 12

    新しい枝 add-usage を作って、そこへ移ります。-c は「作ってから移る」という指定です。

    名前は英数字とハイフンで、何をする枝かが分かるものにします。日本語も使えますが、避けたほうが無難です。

    ~/Documents/hello-github
  4. 04 / 12

    もう一度見ます。枝が2つになり、* が add-usage へ移っています。

    この時点では、2つの枝の中身はまったく同じです。分かれるのはこれから書き足したぶんだけです。

    ~/Documents/hello-github
  5. 05 / 12

    README.md の最後に「## 使い方」の節を足して、保存します。

    エディタは使い慣れたもので構いません。ここでは VS Code の画面で示しています。

    hello-github
  6. 06 / 12

    ターミナルに戻ります。いま書き足したぶんを、この枝に記録します。

    ~/Documents/hello-github
  7. 07 / 12

    記録します。-am は「すでに Git が見ているファイルを add してから記録する」指定です。

    第4章の git add と git commit を1回で済ませています。新しく作ったファイルは -a では入らないので、そのときは git add が要ります。

    ~/Documents/hello-github
  8. 08 / 12

    この枝を GitHub にも送ります。はじめて送る枝なので -u を付けます。

    -u は「この枝の送り先を覚えておく」という指定です。2回目からは git push だけで送れます。

    ~/Documents/hello-github
  9. 09 / 12

    ここからが山場です。元の main へ戻ってみます。

    ~/Documents/hello-github
  10. 10 / 12

    README.md の中身を見ます。足したはずの「## 使い方」がありません。

    cat は、ファイルの中身をそのまま画面に出す命令です。消えたのではなく、main の側にはまだ無いだけです。

    ~/Documents/hello-github
  11. 11 / 12

    もう一度 add-usage へ移ります。

    枝を移ると、フォルダーの中のファイルがその枝の状態に入れ替わります。手で書き戻す必要はありません。

    ~/Documents/hello-github
  12. 12 / 12

    中身を見ると、足した節が戻っています。ここまでが第6章です。

    同じフォルダーなのに中身が入れ替わります。これが「枝を分けて試す」ということです。

    ~/Documents/hello-github

VS Codeで進める

  1. 01 / 12

    第5章の続きです。一番下の帯の左に出ている main が、いま立っている枝です。

    枝(branch)は、記録を積んでいく線のことです。「グラフ」節の線は、いまは main の1本だけです。

    hello-github
  2. 02 / 12

    帯の main を押します。上に、枝を選ぶ一覧が出ます。

    一覧には、いまある枝(main だけ)と、新しく枝を作る項目が並んでいます。

    hello-github
  3. 03 / 12

    「新しいブランチの作成...」を選びます。名前を入れる欄に変わります。

    hello-github
  4. 04 / 12

    枝の名前を打ちます。ここでは add-usage にします。

    何をする枝かが分かる名前にします。英数字とハイフンで短く付けるのが一般的です。

    hello-github
  5. 05 / 12

    Enter を押すと枝ができて、そのまま移ります。帯が add-usage に変わりました。

    ボタンが「Branch の発行」になり、帯の右には雲の印が出ています。どちらも「この枝はまだ GitHub 側に無い」という意味です。グラフの橙の雲(origin/main)は、この枝の分かれ元です。

    hello-github
  6. 06 / 12

    README.md に「## 使い方」の節を足して保存します。「変更」に出た README.md の行にマウスを乗せます。

    行の左の緑の印は「前の記録から増えた行」です。ここでは4行増えています。直したものがあるので、ボタンは「コミット」に戻りました。

    hello-github
  7. 07 / 12

    第4章と同じように、行の右の + を押して「ステージされている変更」へ入れます。

    hello-github
  8. 08 / 12

    上の欄に、何をしたかを短く書きます。

    欄の薄い字に出ていた枝の名前が add-usage になっていたのは、この枝に記録されるという意味です。

    hello-github
  9. 09 / 12

    「✓ コミット」を押します。この記録は add-usage の側だけに積まれます。

    グラフの一番上に、いま作った記録が増えました。橙の雲(origin/main)は1つ下に残ったままです。ボタンはまた「Branch の発行」に戻りました。

    hello-github
  10. 10 / 12

    「Branch の発行」を押します。この枝が GitHub 側にもできます。

    ターミナルで進める場合の git push -u origin <枝の名前> と同じことをしています。一番上の行に紫の雲(GitHub 側の add-usage)が付き、帯の雲の印は同期の印に戻りました。

    hello-github
  11. 11 / 12

    ここからが山場です。帯の add-usage を押して、もう一度枝の一覧を出します。

    今度は main と add-usage の2つが並んでいます。

    hello-github
  12. 12 / 12

    main を選びます。README.md から「## 使い方」の節が消えました。ここまでが第6章です。

    消えたのではなく、main の側にはまだ無いだけです。add-usage を選び直せば、また出てきます。グラフも main の線だけに戻りました。

    hello-github

AI エージェントで進める

  1. 01 / 12

    第5章の続きです。送り終わったフォルダーの中で、ターミナルを開きます。

    ~/Documents/hello-github
  2. 02 / 12

    エージェントを起動します。

    ~/Documents/hello-github
  3. 03 / 12

    枝を作って移るところを頼みます。名前は自分で決めて伝えます。

    名前を任せると、その場かぎりの名前が付くことがあります。自分で決めたほうが後で探しやすいです。

    ~/Documents/hello-github
  4. 04 / 12

    エージェントは、実行する前に何をするかを見せて、許可を求めてきます。

    ~/Documents/hello-github
  5. 05 / 12

    許可すると、枝ができてそこへ移ります。

    ここで出ている git switch -c が、ターミナルで進める場合に打つコマンドと同じものです。

    ~/Documents/hello-github
  6. 06 / 12

    書き足しと記録をまとめて頼みます。

    ~/Documents/hello-github
  7. 07 / 12

    エージェントは、直す中身を見せてから許可を求めてきます。ここで必ず読みます。

    ~/Documents/hello-github
  8. 08 / 12

    許可すると、書き足して記録まで済みます。

    ~/Documents/hello-github
  9. 09 / 12

    この枝を GitHub にも送ってもらいます。

    ~/Documents/hello-github
  10. 10 / 12

    はじめて送る枝なので、送り先を覚えさせる指定(-u)も付けてきます。

    2回目からは git push だけで送れます。エージェントもそのように使い分けます。

    ~/Documents/hello-github
  11. 11 / 12

    ここからが山場です。main に戻したときの中身を見せてもらいます。

    ~/Documents/hello-github
  12. 12 / 12

    main の側には「## 使い方」がありません。ここまでが第6章です。

    消えたのではなく、main の側にはまだ無いだけです。add-usage へ戻せば、また出てきます。

    ~/Documents/hello-github

この章で覚えること

  1. 1

    枝を移ると、フォルダーの中身が入れ替わります。 同じフォルダーを見ているのに、ファイルの中身がその枝の状態になります。 手で書き戻す必要はありませんし、消えたわけでもありません。

  2. 2

    元(main)は勝手に変わりません。 枝で何をしても、移って確かめるまで main はそのままです。 だから、うまくいくか分からないことは枝でやります。

  3. 3

    はじめて送る枝には、送り先を覚えさせます。 ターミナルのgit push -u origin add-usage、 VS Code の「Branch の発行」、エージェントへの頼みごとは、どれも同じことをしています。 2回目からは、送り先を書かなくても送れます。

公式の説明は GitHub のGitHub フローと、VS Code のBranches and worktreesにあります。

次の章提案して取り込むPull Request を出して、確認してから本流へ入れる。

前の章へ戻る/章の一覧へ