レッスン 18 · 歴史と統合

分岐した履歴を持つブランチをマージする

公開されたワークフローカード機能と、メインの独立したアクセシビリティおよびフッターの変更を組み合わせます。実際の 2 つの親のマージとその結果の完全なページを確認します。

レベル: 中級者
3 分で読みました
4 分の動画
更新されました 2026年10月23日
このレッスンの前に: 機能ブランチを作成し、使い捨ての ref のみをリタイアします

このブラウザに進行状況が保存されました。

再生すると、YouTube からビデオが読み込まれます (プライバシー強化モード)。

英語ナレーション · English and Arabic 件のキャプション

動画ページを開く YouTubeで見る

何を学ぶか

祖先からの分岐を認識する。
明示的なマージ記録モードを選択します。
親コンテンツと結合されたコンテンツの両方を確認します。
ローカルのマージをサーバーの公開とは別にしてください。

始める前に

レッスン 17 が終了したところから開始します。Maya の README commit を使用して main を実行し、clean を実行します。公開された機能/価格カードはまだ F1 であり、H5 から分岐しています。準備として MAIN_ACCESSIBLE を保存してコミットすると、メインと機能がそれぞれ独立したコミットを持つようになります。

このビデオは、Ubuntu 24.04 の Git 2.52.0 と GitTree 2.0 を使用して録画されました。ページ、そのコミット、マージはアプリ内で行われました。前の状態、別のコピーでの早送りが拒否され、チェック (プロジェクト自身の lint、テスト、ビルドを含む) がターミナルで実行されました。 macOS または Windows では何も実行されず、記録された Linux システムは Ubuntu だけです。 GitTree のソース Git フロアは 2.39.0 です。

GitTree はサインインを求めます。無料プランでは、ここでのすべてのステップがカバーされます。プロバイダーアカウント、プロ/トライアル、API 認証情報、インターネットサービスは必要ありません。ローカルのベアオリジンは GitLab または CI ではありません。すべてのアイデンティティは example.com を使用します。このレッスンをソースチェックアウト内で実行しないでください。

両方を連続してではなく、同一の入力で GitTree またはネイティブパスのいずれかを介してミューテーションを作成します。読み取り専用検証はどちらの後にも続きます。最終的な作業として説明される準備はすべて、ネイティブの準備としてラベル付けされており、決して発明されたアプリの機能ではありません。

概念と状態の効果

分岐とは、どちらのチップも、他のブランチが早送りできる単純な子孫ではないことを意味します。 Git は共通の祖先を見つけて、それに関連する変更を結合します。ブランチ名だけでは、マージコミットが必要かどうかを判断できません。

マージコミットでは、2 つの親が順番に記録されます。最初の親は、チェックアウトされたブランチの前のチップです。 2 番目はマージされた側です。既存の機能コミットはそのアイデンティティを維持します。新しいマージコミットにより、それらの祖先が接続されます。

テキストの矛盾がないことは、意味上の正しさを証明するものではありません。完全なファイル内のフォーカス可能なメイン、ワークフローセクション、および Leo のリマインダーを確認します。既存のチェックを実行します。ローカルマージでは、別の承認されたプッシュが行われるまでオリジンは更新されません。

準備とマージはローカルのメイン/HEAD を移動し、インデックス/作業を更新します。フィーチャー参照は F1 のままです。元のブランチと v0.1.0 はどちらも以前のヒントを保持します。

正確なプロジェクトの状態を準備する

メイン保存 MAIN_ACCESSIBLE で、index.html のみをステージングし、修正をコミットします。メインのランドマークをフォーカス可能にします。これにより、ネイティブ/アプリのマージ入力が明示的になります。マージ前に、すでに結合されている MERGED ファイルをコミットしないでください。

完全なファイル入力

以下のフェーズでのみ保存します。これらは、最後に改行を含む完全な UTF-8/LF 本文です。 Markdown フェンスは決して貼り付けないでください。変更されていない実行可能ファイルは、名前付き入力を継承します。別のバリアントのバージョンでオリジナルを上書きしてはなりません。

Index.html — MAIN_ACCESSIBLE

ファイルの抜粋 · html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>GitTree Features — course demo</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <header class="site-header">
    <a href="#main">GitTree Features</a>
  </header>
  <main id="main" tabindex="-1">
    <section class="hero" aria-labelledby="hero-title">
      <p class="eyebrow">GitTree Learn demo project</p>
      <h1 id="hero-title">See your work clearly.</h1>
      <p id="hero-copy">Choose one change, then check what Git saved.</p>
    </section>
    <section class="features" aria-labelledby="features-title">
      <h2 id="features-title">Follow your work</h2>
      <div class="cards">
        <article class="feature-card">
          <h3>History</h3>
          <p>Read commits and branches together.</p>
        </article>
        <article class="feature-card">
          <h3>Changes</h3>
          <p>Review the exact content selected for a commit.</p>
        </article>
        <article class="feature-card">
          <h3>Recovery</h3>
          <p>Inspect the scope of a recovery point before using it.</p>
        </article>
      </div>
    </section>
  </main>
  <footer><p>Built by a fictional team for GitTree Learn. Review one change at a time.</p></footer>
  <script type="module" src="site.js"></script>
</body>
</html>

Index.html — マージ済み

ファイルの抜粋 · html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>GitTree Features — course demo</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <header class="site-header">
    <a href="#main">GitTree Features</a>
  </header>
  <main id="main" tabindex="-1">
    <section class="hero" aria-labelledby="hero-title">
      <p class="eyebrow">GitTree Learn demo project</p>
      <h1 id="hero-title">See your work clearly.</h1>
      <p id="hero-copy">Choose one change, then check what Git saved.</p>
    </section>
    <section class="features" aria-labelledby="features-title">
      <h2 id="features-title">Follow your work</h2>
      <div class="cards">
        <article class="feature-card">
          <h3>History</h3>
          <p>Read commits and branches together.</p>
        </article>
        <article class="feature-card">
          <h3>Changes</h3>
          <p>Review the exact content selected for a commit.</p>
        </article>
        <article class="feature-card">
          <h3>Recovery</h3>
          <p>Inspect the scope of a recovery point before using it.</p>
        </article>
      </div>
    </section>
    <section aria-labelledby="plans-title">
      <h2 id="plans-title">Choose the workflow you need</h2>
      <div class="cards">
        <article class="feature-card">
          <h3>Local Git</h3>
          <p>Local Git workflows work without signing in.</p>
        </article>
        <article class="feature-card">
          <h3>Connected workflows</h3>
          <p>Provider integrations and Nour require Pro or an applicable trial.</p>
        </article>
      </div>
    </section>
  </main>
  <footer><p>Built by a fictional team for GitTree Learn. Review one change at a time.</p></footer>
  <script type="module" src="site.js"></script>
</body>
</html>

GitTreeで

パレット: Command+Shift+P (Ubuntu では Ctrl+Shift+P);正確な名前のコマンドを入力して選択します。名前付き参照アクションは、引数のないパレットショートカットではなく、その行のコンテキストメニューを使用します。

「ファイルの表示」→「index.html」→「保存」を使用して MAIN_ACCESSIBLE を保存します。 tabindex の追加のみを確認します。
作業上の変更を表示します。ステージファイルindex.html;コミット修正: 通常のオプションをオフにしてメインのランドマークをフォーカス可能にします。
メインおよび機能/価格カードのグラフの祖先を検査します。 main をチェックアウトしたままにしておきます。
[ローカル] で feature フォルダを開き、pricing-cards → Merge feature/pricing-cards into main を右クリックします。ダイアログに Record it as が続きます。
Record it as では、可能な場合は早送り、そうでない場合はマージコミットが選択されます。 Always a merge commit;早送りのみ。段階的な変更にスカッシュします (コミットなし)。「常にマージコミット」を選択します。実際のプレビューに予期しないパスや競合が表示された場合はキャンセルしてください。
「一度マージ」を選択し、実際に完了するまで待ちます。段階的な変更に Squash を置き換えないでください。
結果のコミットの 2 つの親を検査し、完全なindex.html と MERGED を比較します。 3 つの独立した変更をすべて確認します。
ローカルチェックとクリーンステータスクエリを実行します。コミット後のプッシュを行わずに、ローカルマージで main を残します。アプリ自体のマージ件名は「ブランチ 'feature/price-cards' をマージ」です。以下のネイティブメッセージと一致する必要はありません。

すべての通常のコミット: 概要が記載された主題です。説明が空です。以前のコミットを修正し、フックをスキップし、サインオフ者を追加し、別の作成者を追加し、コミット後にプッシュし、空のコミットをオフに許可します。共著者はいません。指定したファイルのみをステージングし、N 個のファイルへの変更を 1 回コミットする (1 つのファイル)、または代わりに Command+Enter を押します。本当の結果を待ちましょう。明示的に修正するレッスンでは、指定されたオプションのみが変更されます。

ターミナル内

MAIN_ACCESSIBLE を保存した後、ネイティブの準備とマージを行います。

Command · bash

git add -- index.html
git commit --quiet -m "fix: make the main landmark focusable"
git branch course-before-merge
git merge --quiet --no-ff feature/pricing-cards --message "merge: combine workflow cards with accessibility"
git log -1 --format=%s
git rev-list --parents -n 1 HEAD
git status --short

実際の主題:

出力

merge: combine workflow cards with accessibility

親クエリは、実際のマージ SHA に続いて 2 つの親 SHA を出力します。 IDは異なります。完全にマージされた Index.html は、フィクスチャ内の MERGED バイトごとに一致しました。ステータスは空でした。明示的なネイティブの件名は、アプリが生成した件名と一致する必要はありません。祖先/コンテンツが一致する場合は実際のアプリのメッセージを受け入れ、偽のネイティブメッセージを決してオーバーレイしないでください。

Command · bash

npm run --silent lint
npm test -- --test-reporter=tap
npm run --silent build

これらをマージされたチェックポイントに対して実行します。ソーステキストと親の数だけではチェックを証明できません。フィクスチャスイートには 6 つのテストがあります。分岐入力に対する個別の ff のみの試行は、このマージモードを黙って選択するのではなく、拒否する必要があります。

結果

Where you end: M を最初の親である準備されたメインチップと 2 番目の親 F1 とマージするための主なポイント。完全な MERGED ページには、ワークフローカード、Leo フッター、およびフォーカス可能なメインが含まれています。インデックス/作業はきれいです。リモートプッシュはありません。

よくある間違い

間違った方向に合流します。
スカッシュを 2 つの親のマージと呼びます。
競合のないプレビューを意味論的な証拠として信頼します。

何か問題が発生した場合

実際のマージが停止した場合は、その操作状態を維持し、後で説明する競合/中止ワークフローを使用します。無関係なリセットを発行しないでください。ネイティブマージが完了する前に、course-before-merge は、任意の作業バイトではなく、古いコミット済みチップのみを保存します。

練習する

F1 を変更せずに、正確な MERGED バイトと 2 つの実際の親を確認します。元の分岐入力のみの早送りは拒否されると予測します。別のコピーでのみテストしてください。

実践的な演習を行って、説明されている結果を確認しました

あなた自身の確認: サイトはあなたのコンピュータを認識できません。

レッスンを完了するには、必須の質問に正しく答え、実践的な演習を確認してください。

要約

分岐は祖先関係です。
マージでは古いコミット ID が保持されます。
コンテンツと親のチェックは両方とも必要です。

用語集の用語の紹介

マージ — マージ;マージコミット — マージコミット共通の祖先 — سلف مشترك;最初の親 — الأب الأول。

ビデオトランスクリプト

ビデオのナレーションが次々と流れます。

トランスクリプトを表示する

正確なチェックポイントから開始します。
ブランチとインデックスに名前を付けますそして作業バージョン。
分離されたコースのコピーのみを準備します。
Prepare the independent アクセシビリティの変更。
意図した主な変更のみを記録します。
実際の分岐した祖先を調べます。
機能を現在のメインにマージします。
録音モードは慎重に選択してください。
実際のマージ結果を待ちます。
親コンテンツと結合されたコンテンツの両方を確認します。
レビューされるまで、このマージをローカルに保管してください。
マージコミットを区別するものは何ですか?
祖先は親によって定義されますメッセージや色ではなく、ID。
どの証拠が必要ですか?
構造的に有効なマージまだ間違った内容が含まれている可能性があります。
F1のアイデンティティはどうなる？
マージは既存のコミットを接続しますそれらを再生するのではなく。
これでは ff のみを選択してください分岐入力: 結果?
どちらのチップも必須ではありません単純な早送りの子孫。
テキストの矛盾はありませんテストは不要ということですか？
意味的な正しさのニーズコンテンツのレビューとテスト。
最終的な範囲は何ですか?
このローカルマージにはプッシュは含まれません。
実際の結果を検証してみると、単なるメッセージではありません。
行動する前に、変更された入力を予測します。
リカバリする前に有用な作業を保存します。
続行する前にチェックポイントを証明してください。
検証結果を保存する次のステップのために。