Branching and Merging in Git

Workplace Context

As your team begins working on multiple features simultaneously, managing independent lines of development becomes essential. To facilitate this, your project lead has asked everyone to work on separate branches of the project. Once a feature is complete, you will need to merge your branch back into the main project without disrupting your teammates’ work.

You are responsible for creating and switching between branches, making changes in isolation, and merging them smoothly into the project’s main branch when ready. By mastering Git’s branching and merging features, you will help keep the project organized and prevent conflicts as the team grows.

Learning Objectives

By the end of this lesson, you will be able to:

• Create and switch between branches in Git.
• Merge branches to combine different lines of development.
• Resolve merge conflicts that occur during the merging process.

Creating Branches in Git

A branch is a parallel version of your project that allows you to work on a new feature or fix without affecting the main branch. This is especially useful in teams where multiple developers are working on different parts of the project simultaneously.

Step-by-Step: Creating a Branch

1. Check the Current Branch: Before creating a new branch, it is important to check which branch you are currently on:

   $ git branch

   Output example:

   * main

2. Create a New Branch: Create a new branch for the feature you are working on (e.g., feature/homepage-design):

   $ git checkout -b feature/homepage-design

   This command creates the branch and switches you to it.

3. List All Branches: To see all the branches in your repository, use:

   $ git branch

   Output example:

   * feature/homepage-design
     main

Merging Branches in Git

After completing work on your branch, you will want to merge your changes into the main branch. Merging combines the changes from one branch into another.

Step-by-Step: Merging Branches

1. Switch to the main Branch: Before merging, you need to be on the branch that you want to merge into (e.g., main):

   $ git checkout main

2. Merge the Feature Branch: Merge your feature branch into main:

   $ git merge feature/homepage-design

   This command incorporates the changes from the feature/homepage-design branch into main.

3. View Merge Confirmation: Git will confirm the merge and show a log of the merged commits:

   Updating a1b2c3d..d4e5f6g
   Fast-forward
   index.html | 1 +
   1 file changed, 1 insertion(+)

Visualizing Branching and Merging

There are a number of different strategies and workflows that companies use to manage their git projects, one of which is Gitflow . Gitflow is now much less popular than trunk-based workflows , but is still in use in many legacy projects in industry. We highly recommend reading through these two articles when you have time, as they provide valuable information that will help you succeed in interviews and in the workplace!

The simulation below, created in React by GitHub user vraa , allows you to simulate the branching and merging process of a typical Gitflow workflow, which looks something like this:

• There’s a main branch.
• You create a develop branch off of main, where most changes occur.
• Feature and release branches are created off of develop.
  • Once you are done with a feature, you merge it into develop.
  • Once you are done with a release, you merge it to both develop and main.
• If there’s a issue in production, you create a hotfix branch off of the main branch.
  • Once the hotfix is done, you merge it back into main and develop.

Using the buttons below, simulate this process to gain an understanding of how it would work.

• (H) Create hotfix branch.
• (R) Create release branch.
• (F) Create feature branch.
• (C) Commit.
• (M) Merge.

Handling Merge Conflicts

Sometimes, two branches make changes to the same part of a file. This creates a merge conflict because Git cannot automatically decide which changes to keep.

What is a Merge Conflict?

A merge conflict happens when two developers have modified the same lines in a file on different branches. Git will flag this as a conflict, and you will need to manually resolve it.

Step-by-Step: Resolving Merge Conflicts

1. Trigger a Merge Conflict: Let us assume both the main and feature/homepage-design branches have changes to the index.html file. When you try to merge, Git will notify you of the conflict:

   Auto-merging index.html
   CONFLICT (content): Merge conflict in index.html
   Automatic merge failed; fix conflicts and then commit the result.

2. Identify the Conflict: Open the conflicting file. Git will mark the conflicting sections with special markers:

   <<<<<<< HEAD
   <h1>Welcome to the Shop</h1>
   =======
   <h1>New Homepage Title</h1>
   >>>>>>> feature/homepage-design

   The section between <<<<<<< HEAD and ======= shows the content from the main branch, and the section between ======= and >>>>>>> feature/homepage-design shows the content from the feature branch.

3. Resolve the Conflict: Edit the file to resolve the conflict. You can either keep one version or combine them. For example:

   <h1>Welcome to the New Homepage</h1>

4. Stage and Commit the Resolved Changes: After resolving the conflict, stage the resolved file and commit the changes:

   $ git add index.html
   $ git commit

   Git will now record the merge as complete.

Activity: Learn Git Branching Challenges

To further practice your branching and merging skills, complete the interactive challenges on Learn Git Branching . The following exercises are highly recommended:

1. Introduction Sequence: “Branching in Git”:

   • Learn the fundamentals of creating branches, committing to them, and switching between them.

2. Push & Pull – Remote Branches:

   • Explore how to manage branches that exist both locally and on a remote server.

3. Advanced Sequence: “Rebasing and Merging”:

   • Practice handling merge conflicts and advanced branch operations.

These challenges provide a visual and hands-on way to solidify your understanding of branching and merging, while simulating real-world workflows.

Examples from Industry

React Repository

Now, let us look once again to the React repository on GitHub , where we will explore branches.

From the main repository screen, you can navigate the different branches in two ways:

• Using the dropdown menu that should currently say main, as we are on the main branch.
• Clicking on the ”### Branches” button next to that dropdown menu, which will navigate us to a screen that contains branch information .

We will take a few minutes to explore some of these branches together, identifying some of the the key information a branch contains, such as:

• How many commits ahead of main is it?
• How many commits behind main is it?
• What do those commits contain?
• What is the purpose of the branch?

Additionally, how do we determine when a new branch is needed, and what feature to develop? In industry, these decisions come from two places: your project manager, and/or open issues. Click on the “Issues” tab of the repository  to see all of the current issues, their statuses, and discussion surrounding them, including which branches have been opened to address the issue.

Explore these sections of the repository, and share any interesting findings with your peers.

Knowledge Check

Summary

In this lesson, you learned how to use Git to create and manage branches, merge branches into the main project, and resolve merge conflicts. Understanding branching and merging is critical for working on projects where multiple developers are contributing to the same codebase. To further solidify your skills, complete the challenges on Learn Git Branching .

In the next lesson, we will explore pull requests and how they facilitate collaboration by allowing teams to review and approve changes before merging them into the main branch.

References

• Git official documentation 
• GitHub official documentation 

Additional Resources

• Learn Git branching 
• Atlassian Gitflow 
• Atlassian trunk-based workflows