メインコンテンツへスキップ
見出し画像
Photo byr7038xx

正確に学ぶGit用語入門図解HTMLをつくってみたのでシェアします。 #AI駆動学習

    今日のゴール

    Gitをを正しく理解しよう

    画像
    <tr>
                                <td>プッシュ</td>
                                <td>Push</td>
                                <td>-</td>
                                <td>操作</td>
                            </tr>
                            <tr>
                                <td>プル</td>
                                <td>Pull</td>
                                <td>-</td>
                                <td>操作</td>
                            </tr>
                            <tr>
                                <td>フェッチ</td>
                                <td>Fetch</td>
                                <td>-</td>
                                <td>操作</td>
                            </tr>
                            <tr>
                                <td>クローン</td>
                                <td>Clone</td>
                                <td>-</td>
                                <td>操作</td>
                            </tr>
                            <tr>
                                <td>ブランチ</td>
                                <td>Branch</td>
                                <td>-</td>
                                <td>操作</td>
                            </tr>
                            <tr>
                                <td>マージ</td>
                                <td>Merge</td>
                                <td>-</td>
                                <td>操作</td>
                            </tr>
                            <tr>
                                <td>リベース</td>
                                <td>Rebase</td>
                                <td>-</td>
                                <td>操作</td>
                            </tr>
                            <tr>
                                <td>チェックアウト</td>
                                <td>Checkout</td>
                                <td>co</td>
                                <td>操作</td>
                            </tr>
                            <tr>
                                <td>プルリクエスト</td>
                                <td>Pull Request</td>
                                <td>PR</td>
                                <td>GitHub</td>
                            </tr>
                            <tr>
                                <td>フォーク</td>
                                <td>Fork</td>
                                <td>-</td>
                                <td>GitHub</td>
                            </tr>
                            <tr>
                                <td>イシュー</td>
                                <td>Issue</td>
                                <td>-</td>
                                <td>GitHub</td>
                            </tr>
                            <tr>
                                <td>コンフリクト</td>
                                <td>Conflict</td>
                                <td>-</td>
                                <td>状態</td>
                            </tr>
                            <tr>
                                <td>ヘッド</td>
                                <td>HEAD</td>
                                <td>-</td>
                                <td>ポインタ</td>
                            </tr>
                            <tr>
                                <td>オリジン</td>
                                <td>origin</td>
                                <td>-</td>
                                <td>リモート名</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
    
                <div class="section">
                    <h2>🔄 ワークフロー全体図</h2>
                    
                    <div class="diagram" style="font-size:0.85em; line-height:2;">
    <span style="color:#ffc107;">【初回のみ】</span><br>
    GitHub → ローカルPC<br>
    git clone<br>
    <br>
    <span style="color:#ffc107;">【日常の作業】</span><br>
    <br>
    1. Working Directory(作業ディレクトリ)<br>
       ↓ ファイル編集<br>
       ↓ git add<br>
    <br>
    2. Staging Area(ステージングエリア)<br>
       ↓ git commit<br>
    <br>
    3. Local Repository(ローカルリポジトリ)<br>
       ↓ git push<br>
    <br>
    4. Remote Repository(リモートリポジトリ / GitHub)<br>
       ↓ Pull Request作成<br>
    <br>
    5. Code Review(コードレビュー)<br>
       ↓ 承認<br>
    <br>
    6. Merge to main(mainブランチにマージ)<br>
    <br>
    <span style="color:#ffc107;">【他の人の変更を取得】</span><br>
    <br>
    GitHub → ローカルPC<br>
    git pull(または git fetch + git merge)
                    </div>
                </div>
    
                <div class="section">
                    <h2>❓ よくある誤解と正しい理解</h2>
    
                    <table>
                        <thead>
                            <tr>
                                <th>❌ 誤解</th>
                                <th>✅ 正しい理解</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>「GitとGitHubは同じもの」</td>
                                <td>Git = バージョン管理システム(ソフトウェア)<br>GitHub = Gitリポジトリのホスティングサービス(Webサービス)</td>
                            </tr>
                            <tr>
                                <td>「commitするとGitHubに保存される」</td>
                                <td>commit = ローカルリポジトリに保存<br>push = GitHubに送信</td>
                            </tr>
                            <tr>
                                <td>「cloneは毎回必要」</td>
                                <td>clone = 初回のみ<br>2回目以降は pull で最新を取得</td>
                            </tr>
                            <tr>
                                <td>「addとcommitは同じ」</td>
                                <td>add = ステージングエリアに追加(準備)<br>commit = リポジトリに記録(確定)</td>
                            </tr>
                            <tr>
                                <td>「pushすればすぐにmainに反映」</td>
                                <td>push = ブランチに送信<br>main反映 = Pull Requestを経由してmerge</td>
                            </tr>
                            <tr>
                                <td>「ワーキングディレクトリ = リポジトリ」</td>
                                <td>ワーキングディレクトリ = 作業フォルダ<br>リポジトリ = .gitフォルダ内の履歴データ</td>
                            </tr>
                            <tr>
                                <td>「rebaseはmergeと同じ」</td>
                                <td>merge = 履歴を残して統合<br>rebase = 履歴を書き換えて統合</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
    
                <div class="section">
                    <h2>📖 公式ドキュメント参照先</h2>
                    
                    <div class="note">
                        <h3 style="margin-bottom:10px;">正確な情報源</h3>
                        <ul style="margin-left:20px;">
                            <li><strong>Git公式:</strong> <a href="https://git-scm.com/doc" target="_blank">https://git-scm.com/doc</a></li>
                            <li><strong>Pro Git Book(日本語):</strong> <a href="https://git-scm.com/book/ja/v2" target="_blank">https://git-scm.com/book/ja/v2</a></li>
                            <li><strong>GitHub Docs:</strong> <a href="https://docs.github.com/ja" target="_blank">https://docs.github.com/ja</a></li>
                            <li><strong>Git用語集(公式):</strong> <a href="https://git-scm.com/docs/gitglossary" target="_blank">https://git-scm.com/docs/gitglossary</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    
        <script>
            function downloadExcel() {
                const wb = XLSX.utils.book_new();
    
                // シート1: 基本用語(リポジトリ関連)
                const basicTermsData = [
                    ['用語(日本語)', '用語(英語)', '略語', '公式定義', 'わかりやすい説明', '具体例'],
                    ['リポジトリ', 'Repository', 'repo', 'プロジェクトのファイルとそれらの変更履歴を保存する場所。すべてのコミット、ブランチ、タグなどの情報を含む。', 'プロジェクトの「保管庫」。ファイルだけでなく、「誰が・いつ・何を変更したか」という履歴もすべて記録される。', 'GitHubにあるプロジェクト全体'],
                    ['ローカルリポジトリ', 'Local Repository', '-', '自分のコンピュータ上に存在するリポジトリ。リモートリポジトリとは独立して存在し、ローカルで完全なバージョン管理が可能。', 'あなたのPC内にある「作業用コピー」。ネットワークに繋がっていなくても、コミットやブランチ作成などが自由にできる。', '~/Desktop/my-project/.git'],
                    ['リモートリポジトリ', 'Remote Repository', '-', 'ネットワーク上(通常はサーバー上)に存在するリポジトリ。チームメンバー間でコードを共有するための中央の場所として機能する。', 'GitHub、GitLabなどのサーバー上にある「共有用の保管庫」。チーム全員がアクセスできる公式な場所。', 'https://github.com/username/project.git'],
                    ['ワーキングディレクトリ', 'Working Directory / Working Tree', '-', 'リポジトリからチェックアウトされた、実際にファイルを編集する作業領域。ユーザーが直接ファイルを変更する場所。', '実際にコードを書いたり編集したりする「作業フォルダ」。エディタで開いているファイルがある場所。', '~/Desktop/my-project/ 内でファイル編集'],
                    ['ステージングエリア', 'Staging Area / Index', '-', '次のコミットに含める変更を一時的に保存する領域。ワーキングディレクトリとリポジトリの間の中間層。', 'コミット前の「準備エリア」。「この変更をコミットに含めます」と宣言する場所。', 'git add file.txt でステージング']
                ];
                const ws1 = XLSX.utils.aoa_to_sheet(basicTermsData);
                ws1['!cols'] = [{wch: 25}, {wch: 30}, {wch: 10}, {wch: 60}, {wch: 50}, {wch: 40}];
                XLSX.utils.book_append_sheet(wb, ws1, '基本用語');
    
                // シート2: 操作用語
                const operationTermsData = [
                    ['用語(日本語)', '用語(英語)', '公式定義', 'わかりやすい説明', 'コマンド例', '使用頻度'],
                    ['コミット', 'Commit', 'リポジトリへの変更を記録するスナップショット。各コミットには一意のID、作者、日時、コミットメッセージが含まれる。', '「変更の記録」。ゲームのセーブポイントのようなもの。', 'git commit -m "ログイン機能を追加"', '★★★★★'],
                    ['プッシュ', 'Push', 'ローカルリポジトリのコミットをリモートリポジトリに送信する操作。リモートリポジトリを最新の状態に更新する。', '自分のPCで作った変更を、GitHubなどのサーバーに「アップロード」すること。', 'git push origin main', '★★★★★'],
                    ['プル', 'Pull', 'リモートリポジトリの変更をローカルリポジトリに取得し、現在のブランチにマージする操作。git fetch と git merge を組み合わせたもの。', 'GitHubなどサーバーにある最新の変更を、自分のPCに「ダウンロード+統合」すること。', 'git pull origin main', '★★★★★'],
                    ['フェッチ', 'Fetch', 'リモートリポジトリの変更情報を取得するが、ローカルブランチにはマージしない操作。', 'リモートの情報だけを取得。マージは自分で判断する。', 'git fetch origin', '★★★☆☆'],
                    ['クローン', 'Clone', 'リモートリポジトリの完全なコピーをローカルに作成する操作。すべてのコミット履歴、ブランチ、タグを含む。', 'GitHubにあるプロジェクトを、丸ごと自分のPCにコピーすること。初回のみ実行。', 'git clone https://github.com/user/project.git', '★★★☆☆'],
                    ['ブランチ', 'Branch', '開発の分岐点を表す軽量なポインタ。異なる機能開発やバグ修正を並行して進めるために使用される。', '開発の「枝」。メインの作業から分岐して、独立して作業できる。', 'git checkout -b feature/login', '★★★★★'],
                    ['マージ', 'Merge', '複数のブランチの変更履歴を統合する操作。通常、マージコミットという新しいコミットが作成される。', '分岐したブランチの変更を、元のブランチに「統合」すること。', 'git merge feature/login', '★★★★★'],
                    ['リベース', 'Rebase', '一連のコミットを新しいベースコミットの上に再適用する操作。コミット履歴を線形に保つために使用される。', 'ブランチの「根元を付け替える」こと。履歴を一直線にきれいに整理できる。', 'git rebase main', '★★★☆☆'],
                    ['チェックアウト', 'Checkout', 'ブランチやコミットを切り替える操作。ワーキングディレクトリを指定した状態に更新する。', 'ブランチを切り替えること。作業場所を移動するイメージ。', 'git checkout feature/login', '★★★★★'],
                    ['ステージング', 'Staging / Adding', '変更をステージングエリアに追加する操作。次のコミットに含める変更を選択する。', 'コミットする前の「準備」。この変更をコミットに含めますよ、と宣言する。', 'git add file.txt', '★★★★★'],
                    ['リバート', 'Revert', '既存のコミットを打ち消す新しいコミットを作成する操作。履歴は保持される。', 'コミットの変更を「取り消す」新しいコミットを作る。履歴に残るので安全。', 'git revert HEAD', '★★★☆☆'],
                    ['リセット', 'Reset', 'HEADやブランチのポインタを移動させる操作。コミット履歴を書き換えることができる。', 'コミットを「なかったこと」にする。履歴から消えるので注意。', 'git reset --hard HEAD^', '★★☆☆☆']
                ];
                const ws2 = XLSX.utils.aoa_to_sheet(operationTermsData);
                ws2['!cols'] = [{wch: 20}, {wch: 20}, {wch: 60}, {wch: 50}, {wch: 45}, {wch: 12}];
                XLSX.utils.book_append_sheet(wb, ws2, '操作用語');
    
                // シート3: GitHub用語
                const githubTermsData = [
                    ['用語(日本語)', '用語(英語)', '略語', '公式定義', 'わかりやすい説明', '使用例'],
                    ['プルリクエスト', 'Pull Request', 'PR', 'ブランチにプッシュした変更について他の人に通知する方法。変更をレビューし、議論し、フォローアップコミットを追加してから、ベースブランチにマージできる。', '「この変更をメインブランチに取り込んでください」という依頼。コードレビューの場としても機能。', 'feature/loginブランチの変更をmainにマージする依頼'],
                    ['フォーク', 'Fork', '-', '他のユーザーのリポジトリのコピーを自分のGitHubアカウントに作成すること。元のリポジトリに影響を与えずに変更を加えることができる。', '他人のプロジェクトを自分のGitHubアカウントにコピーすること。オープンソースへの貢献に使う。', '他人のリポジトリをフォーク→変更→PRで貢献'],
                    ['イシュー', 'Issue', '-', 'リポジトリに関するアイデア、フィードバック、タスク、バグを追跡するための手段。', 'プロジェクトの「課題」「タスク」「バグ報告」を管理する場所。', 'Issue #123 : ログインボタンが押せない'],
                    ['レビュー', 'Review', '-', 'プルリクエストのコード変更を確認し、コメントや承認を行うプロセス。', 'コードの品質をチェックして、問題がないか確認すること。', 'PRにコメント→修正依頼→承認'],
                    ['マージ', 'Merge(GitHub)', '-', 'プルリクエストの変更をベースブランチに統合する操作。GitHub上でボタンをクリックして実行。', 'PRの変更を正式にmainブランチに取り込むこと。', 'PRページで「Merge pull request」をクリック'],
                    ['コミット', 'Commit(GitHub)', '-', 'GitHub上で直接ファイルを編集して保存すること。Web UI経由でもコミット可能。', 'ブラウザ上でファイルを編集してコミットできる。', 'GitHubのWebエディタでファイル編集→Commit'],
                    ['クローン', 'Clone(GitHub)', '-', 'GitHubリポジトリのURLを使って、ローカルにコピーを作成すること。', 'GitHubからプロジェクトをダウンロードすること。', 'git clone https://github.com/user/repo.git'],
                    ['リリース', 'Release', '-', 'ソフトウェアの特定バージョンをパッケージ化して公開する機能。', 'バージョン1.0、2.0などの「リリース版」を配布する仕組み。', 'v1.0.0としてリリース→ユーザーがダウンロード'],
                    ['スター', 'Star', '-', 'リポジトリに「お気に入り」マークをつける機能。', 'リポジトリを「いいね」すること。後で見返したい時に便利。', '興味のあるリポジトリにスター→自分のスター一覧で確認'],
                    ['ウォッチ', 'Watch', '-', 'リポジトリの更新を通知で受け取る機能。', 'リポジトリの変更を「追跡」すること。Issue、PRなどの通知が届く。', 'プロジェクトをWatch→新しいIssueが作成されると通知'],
                    ['Actions', 'GitHub Actions', '-', 'CI/CD(継続的インテグレーション/デリバリー)を自動化するGitHubの機能。', '自動テスト、自動デプロイなどを設定できる仕組み。', 'pushすると自動的にテストが実行される']
                ];
                const ws3 = XLSX.utils.aoa_to_sheet(githubTermsData);
                ws3['!cols'] = [{wch: 20}, {wch: 25}, {wch: 10}, {wch: 60}, {wch: 50}, {wch: 45}];
                XLSX.utils.book_append_sheet(wb, ws3, 'GitHub用語');
    
                // シート4: 3つの領域
                const areasData = [
                    ['領域名', '英語名', '役割', '状態', 'コマンド', '確認方法'],
                    ['ワーキングディレクトリ', 'Working Directory', '実際にファイルを編集する場所', '未追跡・変更あり', 'ファイル編集', 'git status(赤色表示)'],
                    ['ステージングエリア', 'Staging Area / Index', 'コミット準備中の変更を保存', 'ステージング済み', 'git add', 'git status(緑色表示)'],
                    ['ローカルリポジトリ', 'Local Repository', 'コミットの履歴が保存される', 'コミット済み', 'git commit', 'git log'],
                    ['リモートリポジトリ', 'Remote Repository', 'GitHub等サーバー上のリポジトリ', 'プッシュ済み', 'git push', 'GitHubで確認'],
                    ['', '', '', '', '', ''],
                    ['フロー', 'Working → Staging → Local → Remote', '', '', '', ''],
                    ['コマンド順序', 'ファイル編集 → git add → git commit → git push', '', '', '', '']
                ];
                const ws4 = XLSX.utils.aoa_to_sheet(areasData);
                ws4['!cols'] = [{wch: 25}, {wch: 30}, {wch: 40}, {wch: 20}, {wch: 20}, {wch: 30}];
                XLSX.utils.book_append_sheet(wb, ws4, '3つの領域');
    
                // シート5: よくある誤解
                const misconceptionsData = [
                    ['誤解', '正しい理解', '詳細説明'],
                    ['GitとGitHubは同じもの', 'Git = バージョン管理システム / GitHub = ホスティングサービス', 'Gitはソフトウェア(ツール)。GitHubはGitを使ったWebサービス(GitLab、Bitbucketなども同様のサービス)'],
                    ['commitするとGitHubに保存される', 'commit = ローカル保存 / push = GitHub送信', 'commitはあくまでローカルのリポジトリに記録。GitHubに送信するにはpushが必要'],
                    ['cloneは毎回必要', 'clone = 初回のみ / pull = 最新取得', 'cloneはプロジェクトをダウンロードする最初の1回だけ。以降はpullで最新を取得'],
                    ['addとcommitは同じ', 'add = 準備 / commit = 確定', 'addはステージング(準備)、commitは実際に履歴に記録(確定)'],
                    ['pushすればすぐにmainに反映', 'push = ブランチ送信 / merge = main統合', 'pushは自分のブランチに送信。mainに反映するにはPRを経由してmergeが必要'],
                    ['ワーキングディレクトリ = リポジトリ', 'ワーキングディレクトリ = 作業フォルダ / リポジトリ = .git内', 'ワーキングディレクトリは見えるファイル群。リポジトリは.gitフォルダ内の履歴データ'],
                    ['rebaseはmergeと同じ', 'merge = 履歴を残す / rebase = 履歴を書き換える', 'mergeは統合の履歴が残る。rebaseは履歴を一直線に書き換える'],
                    ['pullとfetchは同じ', 'pull = fetch + merge / fetch = 情報取得のみ', 'pullは取得してすぐマージ。fetchは情報だけ取得してマージは後で'],
                    ['PRは自動的にマージされる', 'PR = マージ依頼 / 承認後に手動マージ', 'PRはあくまで「依頼」。レビュー・承認後に手動で「Merge」ボタンを押す'],
                    ['Issueはバグ報告だけ', 'Issue = タスク・バグ・質問・提案すべて', 'Issueはバグだけでなく、新機能の提案、質問、ドキュメント改善なども管理できる']
                ];
                const ws5 = XLSX.utils.aoa_to_sheet(misconceptionsData);
                ws5['!cols'] = [{wch: 35}, {wch: 50}, {wch: 70}];
                XLSX.utils.book_append_sheet(wb, ws5, 'よくある誤解');
    
                // シート6: コマンド対応表
                const commandsData = [
                    ['操作', '英語', 'コマンド', '説明', '使用頻度', '危険度'],
                    ['クローン', 'Clone', 'git clone <URL>', 'リモートリポジトリをローカルにコピー', '★★☆☆☆', '★☆☆☆☆'],
                    ['状態確認', 'Status', 'git status', '現在の状態を表示', '★★★★★', '★☆☆☆☆'],
                    ['ステージング', 'Add', 'git add <file>', 'ステージングエリアに追加', '★★★★★', '★☆☆☆☆'],
                    ['コミット', 'Commit', 'git commit -m "message"', 'ローカルリポジトリに記録', '★★★★★', '★☆☆☆☆'],
                    ['プッシュ', 'Push', 'git push origin <branch>', 'リモートに送信', '★★★★★', '★★☆☆☆'],
                    ['プル', 'Pull', 'git pull origin <branch>', 'リモートから取得+マージ', '★★★★★', '★★☆☆☆'],
                    ['フェッチ', 'Fetch', 'git fetch origin', 'リモート情報のみ取得', '★★★☆☆', '★☆☆☆☆'],
                    ['ブランチ作成', 'Branch', 'git checkout -b <branch>', '新しいブランチ作成+切り替え', '★★★★★', '★☆☆☆☆'],
                    ['ブランチ切り替え', 'Checkout', 'git checkout <branch>', 'ブランチを切り替え', '★★★★★', '★★☆☆☆'],
                    ['マージ', 'Merge', 'git merge <branch>', 'ブランチを統合', '★★★★☆', '★★★☆☆'],
                    ['リベース', 'Rebase', 'git rebase <branch>', '履歴を書き換えて統合', '★★★☆☆', '★★★★☆'],
                    ['リバート', 'Revert', 'git revert <commit>', 'コミットを打ち消す', '★★★☆☆', '★★☆☆☆'],
                    ['リセット', 'Reset', 'git reset --hard <commit>', 'コミットを削除', '★★☆☆☆', '★★★★★'],
                    ['ログ確認', 'Log', 'git log --graph --oneline --all', '履歴を表示', '★★★★★', '★☆☆☆☆'],
                    ['差分確認', 'Diff', 'git diff', '変更内容を確認', '★★★★☆', '★☆☆☆☆'],
                    ['リモート確認', 'Remote', 'git remote -v', 'リモートURL確認', '★★★☆☆', '★☆☆☆☆'],
                    ['ブランチ一覧', 'Branch List', 'git branch -a', '全ブランチ表示', '★★★★☆', '★☆☆☆☆'],
                    ['一時保存', 'Stash', 'git stash', '変更を一時退避', '★★★☆☆', '★☆☆☆☆'],
                    ['タグ作成', 'Tag', 'git tag v1.0.0', 'バージョンにタグ付け', '★★☆☆☆', '★☆☆☆☆'],
                    ['強制プッシュ', 'Force Push', 'git push -f', '強制的に上書き', '★☆☆☆☆', '★★★★★']
                ];
                const ws6 = XLSX.utils.aoa_to_sheet(commandsData);
                ws6['!cols'] = [{wch: 20}, {wch: 20}, {wch: 40}, {wch: 40}, {wch: 12}, {wch: 12}];
                XLSX.utils.book_append_sheet(wb, ws6, 'コマンド対応表');
    
                // シート7: ワークフロー例
                const workflowData = [
                    ['ステップ', 'フェーズ', 'コマンド', '説明', '頻度'],
                    ['1', '初回のみ', 'git clone <URL>', 'GitHubからプロジェクトをダウンロード', '1回のみ'],
                    ['2', '作業開始', 'git checkout main', 'mainブランチに切り替え', '毎回'],
                    ['3', '作業開始', 'git pull origin main', '最新状態を取得', '毎回'],
                    ['4', '作業開始', 'git checkout -b feature/new', '新しいブランチ作成', '機能開発時'],
                    ['5', '開発', '(ファイル編集)', 'エディタでコードを書く', '常時'],
                    ['6', '開発', 'git status', '変更を確認', '頻繁に'],
                    ['7', '開発', 'git add .', '全ての変更をステージング', '区切りごと'],
                    ['8', '開発', 'git commit -m "メッセージ"', 'コミット(ローカル保存)', '区切りごと'],
                    ['9', '開発', 'git push -u origin feature/new', 'GitHubに送信(初回)', '1日1回程度'],
                    ['10', '開発', 'git push', 'GitHubに送信(2回目以降)', '1日数回'],
                    ['11', 'レビュー', '(GitHubでPR作成)', 'プルリクエストを作成', '機能完成時'],
                    ['12', 'レビュー', '(コードレビュー)', 'チームメンバーが確認', '待機'],
                    ['13', 'レビュー', 'git add . / git commit / git push', '指摘事項を修正', '必要に応じて'],
                    ['14', 'マージ', '(GitHubで Merge)', 'PRをmainにマージ', '承認後'],
                    ['15', '後処理', 'git checkout main', 'mainブランチに戻る', 'マージ後'],
                    ['16', '後処理', 'git pull origin main', '最新のmainを取得', 'マージ後'],
                    ['17', '後処理', 'git branch -d feature/new', 'ローカルブランチ削除', '不要になったら']
                ];
                const ws7 = XLSX.utils.aoa_to_sheet(workflowData);
                ws7['!cols'] = [{wch: 10}, {wch: 15}, {wch: 40}, {wch: 40}, {wch: 15}];
                XLSX.utils.book_append_sheet(wb, ws7, 'ワークフロー例');
    
                // シート8: その他の重要用語
                const otherTermsData = [
                    ['用語(日本語)', '用語(英語)', '公式定義', 'わかりやすい説明', '使用例'],
                    ['HEAD', 'HEAD', '現在チェックアウトしているコミットを指すポインタ。通常は現在のブランチの最新コミットを指す。', '「今ここにいる」という現在位置を示す印。', 'HEAD^ = 1つ前のコミット'],
                    ['origin', 'origin', 'デフォルトのリモートリポジトリの名前。git clone時に自動的に設定される。', 'リモートリポジトリの「ニックネーム」。originという名前は慣習。', 'git push origin main'],
                    ['main / master', 'main / master', 'デフォルトのメインブランチ名。2020年以降はmainが標準。', 'プロジェクトの「本流」ブランチ。本番環境のコード。', 'git checkout main'],
                    ['upstream', 'upstream', '元のリポジトリ(フォーク元)を指すリモート名。', 'フォークしたプロジェクトの「大元」。', 'git remote add upstream <URL>'],
                    ['コンフリクト', 'Conflict', '同じファイルの同じ箇所を異なる方法で変更した場合に発生する競合。', '変更が「衝突」した状態。手動で解決が必要。', 'マージ時に発生 → 手動解決'],
                    ['SHA / ハッシュ', 'SHA / Hash', 'コミットを一意に識別する40桁の英数字。', 'コミットの「ID番号」。先頭7桁で識別可能。', 'abc1234 でコミットを指定'],
                    ['.gitignore', '.gitignore', 'Gitで追跡しないファイルやディレクトリを指定するファイル。', '「このファイルは無視して」リスト。', 'node_modules/ を記載'],
                    ['README', 'README', 'プロジェクトの説明を記載するファイル。通常README.md。', 'プロジェクトの「説明書」。最初に読むファイル。', '# プロジェクト名'],
                    ['License', 'License', 'ソフトウェアの使用・配布条件を定めるファイル。', 'プロジェクトの「利用規約」。', 'MIT License が一般的'],
                    ['Fork', 'Fork(動詞)', '他人のリポジトリを自分のアカウントにコピーすること。', 'リポジトリを「分岐」させる。', 'OSSプロジェクトに貢献する時'],
                    ['Commit ID', 'Commit ID', 'コミットを識別するSHA-1ハッシュ値。', 'コミットの「背番号」。', 'abc1234 という7桁の短縮形'],
                    ['Detached HEAD', 'Detached HEAD', 'HEADが特定のコミットを直接指している状態(ブランチを指していない)。', '「ブランチから外れた」状態。注意が必要。', 'git checkout abc1234'],
                    ['Fast-forward', 'Fast-forward', '分岐のないマージ。単純にポインタを進めるだけ。', '「早送り」マージ。一直線なので簡単。', 'rebase後のマージで発生'],
                    ['Merge Commit', 'Merge Commit', 'マージによって作成される統合コミット。2つ以上の親を持つ。', 'ブランチを統合した「証拠」のコミット。', 'Merge branch "feature" into main'],
                    ['Stash', 'Stash', '作業中の変更を一時的に退避する機能。', '変更を「一時保存」する機能。', 'git stash → 作業 → git stash pop'],
                    ['Tag', 'Tag', '特定のコミットに付けるラベル。バージョン管理に使用。', 'コミットに「付箋」を貼る。リリース時に使用。', 'v1.0.0, v2.0.0'],
                    ['Blame', 'Blame', '各行を最後に変更した人を表示する機能。', '「誰が書いたか」を調べる機能。責任追及ではない。', 'git blame file.txt'],
                    ['Cherry-pick', 'Cherry-pick', '特定のコミットだけを別のブランチに適用する。', '「つまみ食い」。特定のコミットだけ持ってくる。', 'git cherry-pick abc1234'],
                    ['Bisect', 'Bisect', '二分探索でバグが混入したコミットを特定する。', 'バグの「犯人探し」を自動化。', 'git bisect start'],
                    ['Submodule', 'Submodule', '他のリポジトリをサブディレクトリとして含める機能。', 'プロジェクト内に別のプロジェクトを含める。', '外部ライブラリの管理'],
                    ['Hooks', 'Hooks', 'Git操作の前後に自動実行されるスクリプト。', 'Gitコマンド実行時の「フック」。自動化に使用。', 'commit前に自動テスト実行']
                ];
                const ws8 = XLSX.utils.aoa_to_sheet(otherTermsData);
                ws8['!cols'] = [{wch: 25}, {wch: 25}, {wch: 60}, {wch: 50}, {wch: 40}];
                XLSX.utils.book_append_sheet(wb, ws8, 'その他重要用語');
    
                // シート9: 略語・エイリアス一覧
                const abbreviationsData = [
                    ['略語・エイリアス', '正式名称', '意味', '使用例'],
                    ['repo', 'repository', 'リポジトリ', 'この repo をクローンして'],
                    ['PR', 'Pull Request', 'プルリクエスト', 'PR を作成してください'],
                    ['CI/CD', 'Continuous Integration / Continuous Delivery', '継続的インテグレーション/デリバリー', 'CI/CD パイプライン'],
                    ['VCS', 'Version Control System', 'バージョン管理システム', 'Git は VCS の一種'],
                    ['SCM', 'Source Control Management', 'ソース管理', 'Git は SCM ツール'],
                    ['OSS', 'Open Source Software', 'オープンソースソフトウェア', 'OSS プロジェクトに貢献'],
                    ['FOSS', 'Free and Open Source Software', '自由でオープンソースなソフトウェア', 'FOSS コミュニティ'],
                    ['WIP', 'Work In Progress', '作業中', 'WIP: ログイン機能開発中'],
                    ['LGTM', 'Looks Good To Me', '私には良さそう(承認)', 'コードレビューで LGTM'],
                    ['SSIA', 'Subject Says It All', '件名が全てを語っている', 'SSIA(説明不要)'],
                    ['TL;DR', 'Too Long; Didn\'t Read', '長すぎて読んでない(要約)', 'TL;DR: バグを修正'],
                    ['FYI', 'For Your Information', '参考までに', 'FYI: この Issue 参照'],
                    ['IMO / IMHO', 'In My Opinion / In My Humble Opinion', '私の意見では', 'IMO、この実装が良い'],
                    ['AFAIK', 'As Far As I Know', '私の知る限り', 'AFAIK、この方法が最適'],
                    ['YMMV', 'Your Mileage May Vary', '人によって異なる', 'YMMV だが試してみて'],
                    ['HEAD^', 'HEAD parent', 'HEADの1つ前', 'git reset HEAD^'],
                    ['HEAD~2', 'HEAD ancestor 2', 'HEADの2つ前', 'git reset HEAD~2'],
                    ['origin/main', 'remote branch', 'リモートのmainブランチ', 'git pull origin main'],
                    ['-u', '--set-upstream', '追跡ブランチ設定', 'git push -u origin main'],
                    ['-m', '--message', 'コミットメッセージ', 'git commit -m "message"'],
                    ['-b', '--branch', 'ブランチ作成+切り替え', 'git checkout -b feature'],
                    ['-d', '--delete', 'ブランチ削除', 'git branch -d feature'],
                    ['-f', '--force', '強制実行', 'git push -f(危険)'],
                    ['-a', '--all', '全て', 'git add -a'],
                    ['-p', '--patch', 'パッチ形式', 'git add -p']
                ];
                const ws9 = XLSX.utils.aoa_to_sheet(abbreviationsData);
                ws9['!cols'] = [{wch: 20}, {wch: 35}, {wch: 40}, {wch: 35}];
                XLSX.utils.book_append_sheet(wb, ws9, '略語・エイリアス');
    
                // シート10: 公式リンク集
                const linksData = [
                    ['カテゴリ', 'リソース名', 'URL', '説明'],
                    ['Git公式', 'Git公式サイト', 'https://git-scm.com/', 'Git の公式サイト'],
                    ['Git公式', 'Git Documentation', 'https://git-scm.com/doc', 'Git の公式ドキュメント'],
                    ['Git公式', 'Pro Git Book(日本語)', 'https://git-scm.com/book/ja/v2', '無料で読める Git の教科書'],
                    ['Git公式', 'Git Glossary', 'https://git-scm.com/docs/gitglossary', 'Git 用語集(英語)'],
                    ['Git公式', 'Git Reference', 'https://git-scm.com/docs', 'コマンドリファレンス'],
                    ['GitHub', 'GitHub Docs', 'https://docs.github.com/ja', 'GitHub の公式ドキュメント'],
                    ['GitHub', 'GitHub Skills', 'https://skills.github.com/', 'GitHub の学習コース'],
                    ['GitHub', 'GitHub Community', 'https://github.community/', 'GitHub コミュニティフォーラム'],
                    ['学習', 'Learn Git Branching', 'https://learngitbranching.js.org/?locale=ja', '対話型 Git 学習ツール'],
                    ['学習', 'Git Immersion', 'https://gitimmersion.com/', 'ステップバイステップの Git チュートリアル'],
                    ['学習', 'Atlassian Git Tutorial', 'https://www.atlassian.com/git/tutorials', 'Atlassian の Git チュートリアル'],
                    ['学習', 'GitHub Learning Lab', 'https://lab.github.com/', 'GitHub の実践学習'],
                    ['リファレンス', 'Oh Shit, Git!?!', 'https://ohshitgit.com/', 'Git トラブルシューティング'],
                    ['リファレンス', 'Git Flight Rules', 'https://github.com/k88hudson/git-flight-rules', 'Git の問題解決ガイド'],
                    ['リファレンス', 'Gitの内側', 'https://git-scm.com/book/ja/v2/Gitの内側-配管(Plumbing)と磁器(Porcelain)', 'Git の仕組みを深く理解'],
                    ['ツール', 'GitHub Desktop', 'https://desktop.github.com/', 'Git の GUI クライアント'],
                    ['ツール', 'GitKraken', 'https://www.gitkraken.com/', 'ビジュアル Git クライアント'],
                    ['ツール', 'SourceTree', 'https://www.sourcetreeapp.com/', 'Atlassian の Git GUI']
                ];
                const ws10 = XLSX.utils.aoa_to_sheet(linksData);
                ws10['!cols'] = [{wch: 20}, {wch: 35}, {wch: 60}, {wch: 40}];
                XLSX.utils.book_append_sheet(wb, ws10, '公式リンク集');
    
                // Excelファイルをダウンロード
                XLSX.writeFile(wb, 'Git_GitHub_公式用語集_完全版.xlsx');
            }
        </script>
    </body>
    </html><!DOCTYPE html>
    <html lang="ja">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Git/GitHub 公式用語集</title>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
        <style>
            * {
                margin: 0;
                padding: 0;
                box-sizing: border-box;
            }
            body {
                font-family: 'Segoe UI', Meiryo, sans-serif;
                background: linear-gradient(135deg, #667eea  0%, #764ba2  100%);
                min-height: 100vh;
                padding: 20px;
            }
            .container {
                max-width: 1400px;
                margin: 0 auto;
                background: white;
                border-radius: 20px;
                box-shadow: 0 20px 60px rgba(0,0,0,0.3);
                overflow: hidden;
            }
            .header {
                background: linear-gradient(135deg, #2c3e50  0%, #34495e  100%);
                color: white;
                padding: 40px;
                text-align: center;
            }
            .header h1 {
                font-size: 2.5em;
                margin-bottom: 10px;
                text-shadow: 2px 2px 4px rgba(0,0,0,0.2);
            }
            .badge {
                background: #e74c3c ;
                color: white;
                padding: 8px 20px;
                border-radius: 20px;
                display: inline-block;
                margin-top: 10px;
                font-weight: bold;
            }
            .download-section {
                padding: 30px 40px;
                background: #f8f9fa ;
                border-bottom: 3px solid #e9ecef ;
                text-align: center;
            }
            .btn-download {
                background: linear-gradient(135deg, #2c3e50  0%, #34495e  100%);
                color: white;
                border: none;
                padding: 15px 40px;
                font-size: 1.1em;
                border-radius: 50px;
                cursor: pointer;
                transition: all 0.3s;
                box-shadow: 0 4px 15px rgba(44, 62, 80, 0.4);
            }
            .btn-download:hover {
                transform: translateY(-2px);
                box-shadow: 0 6px 20px rgba(44, 62, 80, 0.6);
            }
            .content {
                padding: 40px;
            }
            .section {
                margin-bottom: 40px;
            }
            .section h2 {
                color: #2c3e50 ;
                font-size: 1.8em;
                margin-bottom: 20px;
                padding-bottom: 10px;
                border-bottom: 3px solid #3498db ;
            }
            .term-card {
                background: #f8f9fa ;
                padding: 20px;
                margin: 15px 0;
                border-radius: 10px;
                border-left: 5px solid #3498db ;
            }
            .term-title {
                font-size: 1.3em;
                font-weight: bold;
                color: #2c3e50 ;
                margin-bottom: 10px;
            }
            .term-english {
                color: #7f8c8d ;
                font-size: 0.9em;
                margin-bottom: 10px;
            }
            .official-def {
                background: white;
                padding: 15px;
                border-radius: 5px;
                margin: 10px 0;
                border-left: 3px solid #e74c3c ;
            }
            .simple-exp {
                background: #d4edda ;
                padding: 15px;
                border-radius: 5px;
                margin: 10px 0;
                border-left: 3px solid #28a745 ;
            }
            .example {
                background: #fff3cd ;
                padding: 15px;
                border-radius: 5px;
                margin: 10px 0;
                border-left: 3px solid #ffc107 ;
            }
            table {
                width: 100%;
                border-collapse: collapse;
                margin-top: 15px;
                background: white;
                box-shadow: 0 2px 10px rgba(0,0,0,0.1);
                border-radius: 10px;
                overflow: hidden;
            }
            th {
                background: linear-gradient(135deg, #2c3e50  0%, #34495e  100%);
                color: white;
                padding: 15px;
                text-align: left;
                font-weight: 600;
            }
            td {
                padding: 12px 15px;
                border-bottom: 1px solid #e9ecef ;
            }
            tr:hover {
                background: #f8f9fa ;
            }
            .diagram {
                background: #2d3748 ;
                color: #68d391 ;
                padding: 20px;
                border-radius: 10px;
                font-family: 'Courier New', monospace;
                margin: 20px 0;
                overflow-x: auto;
            }
            .note {
                background: #e7f3ff ;
                border-left: 4px solid #2196F3 ;
                padding: 15px;
                margin: 15px 0;
                border-radius: 5px;
            }
            .warning {
                background: #fff3cd ;
                border-left: 4px solid #ffc107 ;
                padding: 15px;
                margin: 15px 0;
                border-radius: 5px;
            }
        </style>
    </head>
    <body>
        <div class="container">
            <div class="header">
                <h1>📚 Git/GitHub 公式用語集</h1>
                <p>公式定義に忠実な正確な解説</p>
                <div class="badge">Git公式 & GitHub Docs 準拠</div>
            </div>
    
            <div class="download-section">
                <button class="btn-download" onclick="downloadExcel()">
                    📥 完全版をExcelでダウンロード
                </button>
                <p style="margin-top:10px; color:#666;">全用語・定義・例文をExcel形式で保存</p>
            </div>
    
            <div class="content">
                <div class="section">
                    <h2>🏗️ 基本構造の用語</h2>
    
                    <div class="term-card">
                        <div class="term-title">リポジトリ (Repository)</div>
                        <div class="term-english">英: repository / 略: repo</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            プロジェクトのファイルとそれらの変更履歴を保存する場所。すべてのコミット、ブランチ、タグなどの情報を含む。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            プロジェクトの「保管庫」。ファイルだけでなく、「誰が・いつ・何を変更したか」という履歴もすべて記録される。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            「このプロジェクトのリポジトリはGitHubにあります」<br>
                            → プロジェクトの全データ(ファイル+履歴)がGitHub上に保存されている
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">ローカルリポジトリ (Local Repository)</div>
                        <div class="term-english">英: local repository</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            自分のコンピュータ上に存在するリポジトリ。リモートリポジトリとは独立して存在し、ローカルで完全なバージョン管理が可能。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            あなたのPC内にある「作業用コピー」。ネットワークに繋がっていなくても、コミットやブランチ作成などが自由にできる。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>~/Desktop/my-project/.git</code><br>
                            → この .git フォルダがローカルリポジトリの実体
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">リモートリポジトリ (Remote Repository)</div>
                        <div class="term-english">英: remote repository</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            ネットワーク上(通常はサーバー上)に存在するリポジトリ。チームメンバー間でコードを共有するための中央の場所として機能する。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            GitHub、GitLabなどのサーバー上にある「共有用の保管庫」。チーム全員がアクセスできる公式な場所。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>https://github.com/username/project.git</code><br>
                            → これがリモートリポジトリのURL
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">ワーキングディレクトリ (Working Directory)</div>
                        <div class="term-english">英: working directory / 別名: working tree</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            リポジトリからチェックアウトされた、実際にファイルを編集する作業領域。ユーザーが直接ファイルを変更する場所。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            実際にコードを書いたり編集したりする「作業フォルダ」。エディタで開いているファイルがある場所。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>~/Desktop/my-project/src/index.js</code><br>
                            → このファイルを編集している時、ワーキングディレクトリで作業している
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">ステージングエリア (Staging Area)</div>
                        <div class="term-english">英: staging area / 別名: index</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            次のコミットに含める変更を一時的に保存する領域。ワーキングディレクトリとリポジトリの間の中間層。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            コミット前の「準備エリア」。「この変更をコミットに含めます」と宣言する場所。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>git add file.txt</code> でステージングエリアに追加<br>
                            → file.txt の変更が次のコミットに含まれる準備完了
                        </div>
                    </div>
                </div>
    
                <div class="section">
                    <h2>📊 Git の3つの領域(重要図解)</h2>
                    
                    <div class="diagram">
    ┌─────────────────────────────────────────────────────┐<br>
    │  Working Directory(ワーキングディレクトリ)          │<br>
    │  実際にファイルを編集する場所                         │<br>
    │  例: src/index.js を編集                             │<br>
    └─────────────────────────────────────────────────────┘<br>
                        ↓ git add<br>
    ┌─────────────────────────────────────────────────────┐<br>
    │  Staging Area(ステージングエリア / Index)          │<br>
    │  コミット準備中の変更を保存                           │<br>
    │  例: git add index.js で追加                         │<br>
    └─────────────────────────────────────────────────────┘<br>
                        ↓ git commit<br>
    ┌─────────────────────────────────────────────────────┐<br>
    │  Repository(リポジトリ / .git directory)            │<br>
    │  コミットの履歴が保存される                           │<br>
    │  例: コミットID abc123 として記録                    │<br>
    └─────────────────────────────────────────────────────┘<br>
                        ↓ git push<br>
    ┌─────────────────────────────────────────────────────┐<br>
    │  Remote Repository(リモートリポジトリ)              │<br>
    │  GitHub などサーバー上のリポジトリ                    │<br>
    │  例: https://github.com/user/project                │<br>
    └─────────────────────────────────────────────────────┘
                    </div>
    
                    <div class="note">
                        <strong>💡 重要なポイント:</strong>
                        <ul style="margin-left:20px; margin-top:10px;">
                            <li>Working Directory → Staging Area → Repository の順番に進む</li>
                            <li>各段階で <code>git status</code> で状態確認できる</li>
                            <li>Staging Area を経由することで、コミットに含める変更を選択できる</li>
                        </ul>
                    </div>
                </div>
    
                <div class="section">
                    <h2>🔄 操作に関する用語</h2>
    
                    <div class="term-card">
                        <div class="term-title">コミット (Commit)</div>
                        <div class="term-english">英: commit / 名詞・動詞</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            リポジトリへの変更を記録するスナップショット。各コミットには一意のID(SHA-1ハッシュ)、作者、日時、コミットメッセージが含まれる。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            「変更の記録」または「変更を記録する行為」。ゲームのセーブポイントのようなもの。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>git commit -m "ログイン機能を追加"</code><br>
                            → 現在の変更を「ログイン機能を追加」という記録として保存
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">プッシュ (Push)</div>
                        <div class="term-english">英: push</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            ローカルリポジトリのコミットをリモートリポジトリに送信する操作。リモートリポジトリを最新の状態に更新する。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            自分のPCで作った変更を、GitHubなどのサーバーに「アップロード」すること。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>git push origin main</code><br>
                            → ローカルの main ブランチの変更を GitHub に送信
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">プル (Pull)</div>
                        <div class="term-english">英: pull</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            リモートリポジトリの変更をローカルリポジトリに取得し、現在のブランチにマージする操作。<code>git fetch</code> と <code>git merge</code> を組み合わせたもの。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            GitHubなどサーバーにある最新の変更を、自分のPCに「ダウンロード+統合」すること。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>git pull origin main</code><br>
                            → GitHub の main ブランチの最新状態を取得して、ローカルに統合
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">クローン (Clone)</div>
                        <div class="term-english">英: clone</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            リモートリポジトリの完全なコピーをローカルに作成する操作。すべてのコミット履歴、ブランチ、タグを含む。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            GitHubにあるプロジェクトを、丸ごと自分のPCにコピーすること。初回のみ実行。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>git clone https://github.com/user/project.git</code><br>
                            → GitHub のプロジェクトを自分のPCにダウンロード
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">ブランチ (Branch)</div>
                        <div class="term-english">英: branch</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            開発の分岐点を表す軽量なポインタ。異なる機能開発やバグ修正を並行して進めるために使用される。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            開発の「枝」。メインの作業から分岐して、独立して作業できる。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>git checkout -b feature/login</code><br>
                            → ログイン機能開発用の新しいブランチを作成
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">マージ (Merge)</div>
                        <div class="term-english">英: merge</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            複数のブランチの変更履歴を統合する操作。通常、マージコミットという新しいコミットが作成される。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            分岐したブランチの変更を、元のブランチに「統合」すること。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>git merge feature/login</code><br>
                            → feature/login ブランチの変更を現在のブランチに統合
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">リベース (Rebase)</div>
                        <div class="term-english">英: rebase</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            一連のコミットを新しいベースコミットの上に再適用する操作。コミット履歴を線形に保つために使用される。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            ブランチの「根元を付け替える」こと。履歴を一直線にきれいに整理できる。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>git rebase main</code><br>
                            → 現在のブランチのコミットを main の最新状態の上に移動
                        </div>
                        
                        <div class="warning">
                            <strong>⚠️ 注意:</strong> 公開済みのブランチでは使用しない。履歴が書き換わるため。
                        </div>
                    </div>
                </div>
    
                <div class="section">
                    <h2>🌐 GitHub 特有の用語</h2>
    
                    <div class="term-card">
                        <div class="term-title">プルリクエスト (Pull Request)</div>
                        <div class="term-english">英: pull request / 略: PR</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義(GitHub Docs):</strong><br>
                            ブランチにプッシュした変更について他の人に通知する方法。プルリクエストを開くと、変更をレビューし、議論し、フォローアップコミットを追加してから、ベースブランチにマージできる。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            「この変更をメインブランチに取り込んでください」という依頼。コードレビューの場としても機能。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            1. feature/login ブランチで開発<br>
                            2. GitHub で PR 作成<br>
                            3. チームメンバーがレビュー<br>
                            4. 承認後、main ブランチにマージ
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">フォーク (Fork)</div>
                        <div class="term-english">英: fork</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義(GitHub Docs):</strong><br>
                            他のユーザーのリポジトリのコピーを自分のGitHubアカウントに作成すること。元のリポジトリに影響を与えずに変更を加えることができる。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            他人のプロジェクトを自分のGitHubアカウントにコピーすること。オープンソースへの貢献に使う。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            1. 他人のリポジトリをフォーク<br>
                            2. 自分のアカウントにコピーされる<br>
                            3. 変更を加えて PR を送る
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">イシュー (Issue)</div>
                        <div class="term-english">英: issue</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義(GitHub Docs):</strong><br>
                            リポジトリに関するアイデア、フィードバック、タスク、バグを追跡するための手段。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            プロジェクトの「課題」「タスク」「バグ報告」を管理する場所。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            Issue #123 : 「ログインボタンが押せない」<br>
                            → バグを報告・議論・修正を追跡
                        </div>
                    </div>
    
                    <div class="term-card">
                        <div class="term-title">origin</div>
                        <div class="term-english">英: origin / デフォルトのリモート名</div>
                        
                        <div class="official-def">
                            <strong>📖 公式定義:</strong><br>
                            リモートリポジトリのデフォルトの名前。<code>git clone</code> した時に自動的に設定される。
                        </div>
                        
                        <div class="simple-exp">
                            <strong>💡 わかりやすく:</strong><br>
                            「GitHub上のリポジトリ」を指す名前。<code>origin</code> は単なるニックネーム。
                        </div>
                        
                        <div class="example">
                            <strong>📝 例:</strong><br>
                            <code>git push origin main</code><br>
                            → <code>origin</code>(GitHub)の main ブランチにpush
                        </div>
                    </div>
                </div>
    
                <div class="section">
                    <h2>📋 用語対応表</h2>
                    
                    <table>
                        <thead>
                            <tr>
                                <th>日本語</th>
                                <th>英語</th>
                                <th>略語</th>
                                <th>カテゴリ</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>リポジトリ</td>
                                <td>Repository</td>
                                <td>repo</td>
                                <td>基本構造</td>
                            </tr>
                            <tr>
                                <td>ローカルリポジトリ</td>
                                <td>Local Repository</td>
                                <td>-</td>
                                <td>基本構造</td>
                            </tr>
                            <tr>
                                <td>リモートリポジトリ</td>
                                <td>Remote Repository</td>
                                <td>-</td>
                                <td>基本構造</td>
                            </tr>
                            <tr>
                                <td>ワーキングディレクトリ</td>
                                <td>Working Directory / Working Tree</td>
                                <td>-</td>
                                <td>基本構造</td>
                            </tr>
                            <tr>
                                <td>ステージングエリア</td>
                                <td>Staging Area / Index</td>
                                <td>-</td>
                                <td>基本構造</td>
                            </tr>
                            <tr>
                                <td>コミット</td>
                                <td>Commit</td>
                                <td>-</td>
                                <td>操作</td>
                            </tr>
                            <tr>
                                <td>プ

    ※Excel版のDLはGithubより可能

    あなたへのおすすめ