ブランチでコミットをまとめよう
ブランチを作って、チェックアウトで行き来する。
幹から枝を生やすという感覚
ブランチはそもそも直訳すると「枝」という意味です。
枝というからには、前提として「幹」があるわけですが、幹となるのがmain(master)ブランチです。
つまり、ブランチはベースとなる他のブランチ(のコミット)から作るのが常となります。
もちろん、枝から枝を生やすことも出来ます。
Git graph で見てみると、直感的に理解がしやすいと思います。
VSCode でブランチを作る
ブランチを分けるコツは、コミットと同じ「ユースケース」や「機能」です。
「時間」や「担当者」で分けることはやめましょう。
「新しい機能を足そう！」
と思った時に、ブランチを作ってから、作業し始めることになります。
Git Graph で、main(master)ブランチの最新のコミットを右クリックし、「Create Branch」を押してください
新しいブランチの名前を聞かれるので、「add-section」と名付けます
これで、add-section ブランチが作られました。
add-section ブランチに、コミットを登録するには、ブランチを選択状態にする必要があります。
その操作を「チェックアウト」と言います。
add-section ブランチにチェックアウトしてみましょう。
Git Graph のブランチ名を右クリックして、「Checkout Branch」を選択します。
add-section のブランチ名が太字になり、左へ移動しました。これが、add-sectionブランチに、チェックアウトできている状態です。
この状態で、1つコミットをしてみましょう。
赤い点線の部分が、コミットにより、ブランチ（枝）が延ました。
同じ要領で、もう一つブランチを作って、コミットをしてみると、ブランチが「枝」であることが分かりやすい画になります。
同じ機能を複数の担当者で作ることはあると思いますが、その場合は同時編集は避け、バトンタッチ形式で息を合わせる必要があります。
どうしても同時にやらなければならない。というようなことが起こる場合、それはユースケースや機能を肥大化させすぎているということですので、設計や運用を見直し、作業を分けられるようにしましょう。
開発途中でそう思い立った場合は、ビルドが通ることや、ウェブサイトの表示が担保された、きりの良いタイミングで、一度マージをするようにします。
弊社でよくやる切り方は、初期の段階ではグロナビやフッターなどの配置設定までを区切りにした「フレームづくり」を1人の担当者にやってもらい。
そのあとは、ページか<section>でブランチを切るようにしています。
開発後半や、納品後の保守、つまり「修正」では、コンポーネント単位でブランチが立つことも起こってくるといった様相です。
main にチェックアウトすると？
この状態で、もともとあったmainブランチにチェックアウトするとどうなるでしょうか？
プロジェクトフォルダは、add-section、add-bread で編集される前の状態、つまり過去の状態に戻ります。
このように、「チェックアウト」をタイムスリップする目的で使うこともあります。