Git Interactive Staging — A simple way to logically separate commits

Hasmukh Mistry
5 min readAug 27, 2023

--

It is always a good idea to simplify your life. The response to my other article Apple Shortcuts — A simple automation to get currency rate inspired me to write another. My purpose here is to inspire you to use Git Interactive Staging more often. I will try to keep things simple to not overwhelm you.

I am going to stick with my idea with the set of question and answer models. There is no rocket science but I believe it makes things simpler.

Let me spin the stick — “Aabra ka Dabra!!!” and here it goes…

1. How did it all begin?

Being a developer, I often modify the number of files extensively during day-to-day working hours. Creating one big messy commit with the number of files modified is not a good idea here. Separating things logically into different change sets and creating commits accordingly is an ideal thing to do, which can be reviewed easily by colleagues later.

Git Interactive Staging is helpful in partitioning the changes into several focused commits. Find out, More information about the tool here.

2. todo está bien señor/señora, But can we have an example?

Sure, Let’s take a look at this test repository here https://github.com/hasukmistry/git-interactive. It has two files Readme.md and index.html mainly with dummy texts. Five blocks with Lorem ipsum text in each file.

Let’s make the following changes to the Readme.md file,

  • Add an empty line in line number 5.
  • Add the following text in line number 6,
"There is no one who loves pain itself, who seeks after it and wants to have it, simply because it is pain…"
  • Add an empty line in line number 7.
  • Add an empty line in line number 16.
  • Add the following text in line number 17,
"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit…"
  • Add an empty line in line number 18.

Make the following changes to the index.html file,

  • Add an empty line in line number 12.
  • Add the following HTML in line number 13,
<p>This change is related to the Line "There is no one who loves pain itself…"</p>
  • Add an empty line in line number 29.
  • Add the following HTML in line number 30,
<p>This change is related to the Line "Neque porro quisquam est qui…"</p>

Pay attention to the changes we have made. These are logically different changesets.

  • Changes in Readme.md of lines 5,6, and 7 are related to index.html changes in lines 12 and 13. So, logically it makes sense to create a single commit for this change.
  • Changes in Readme.md of lines 16,17, and 18 are related to index.html changes in lines 29 and 30. So, logically it makes sense to create a single commit for this change.

This leads to an important question.

3. How can we get into an interactive shell mode?

One might argue to remove unrelated changes and create a commit with the logically relevant changeset. And, creating a new commit by reintroducing removed changes earlier. Meh, this is a tedious approach when there are a lot of changes.

Here, Git interactive staging comes to the rescue party.

Run, git add with the -i or — interactive option to enter into an interactive shell mode.

Git Interactive shell mode

4. How can we prepare separate changes to stage them for commits?

It’s possible to stage certain parts of files and not the rest. From the interactive prompt mentioned above, type p or 5 (for patch). Git will ask you which files you would like to partially stage.

Git Interactive patch

Let’s press 1 to proceed with Readme.md file. The symbol (*) appears in front of the Readme.md file after you press 1.

Git Interactive select a file for a patch

Let’s press the enter key here. then, for each section of the selected files, it will display hunks of the file diff and ask if you would like to stage them, one by one:

Git Interactive options for staging hunk

The options mentioned here indicate the following,

Now, let’s press y because we want to stage this first part. It will automatically move to the next part after we press y.

Here in the next part, we do not want to stage. So let’s press n.

Git Interactive options to stage hunk

We already specified the action that we want to do for Readme.md file. It will move back to the original screen.

Git Interactive default options

Press 1 to check the status of the current staged content. Here we can see that only 2 lines from the Readme.md file are staged. We can use diff to check what is staged too.

Git Interactive status option

Let’s use the patch action again for the index.html file. Select the index.html file by pressing 2.

Git Interactive patch option

Press enter and follow the same steps that we followed for Readme.md file.

Git Interactive options to stage hunk

We already specified the action that we want to do for the index.html file. It will move back to the original screen. Press 1 to check the status of the current staged content.

Finally, press 7 to quit interactive mode. Now we can easily create the commit for the first change using git commit

Once the first change is committed we can simply use git add . and create a second commit for the rest of the changes.

5. Useful tweaks

  • Try git diff to see what are we committing.
  • Setting up aliases will help a lot to simplify this process. More information is available here.

If you like this article and find this useful do clap for it. It will give me an inspiration to write my next article.

--

--

Hasmukh Mistry

Senior Full Stack Software Engineer | Tech Artist | Ex-trivago | Ex-Metro Markets | Author on Medium