DevOps Tools / IoT edge computing / Software Development

Development: Basic git Branching, Switching and Merging

14 Jan 2022 8:00am, by
Dr. Torq
Rob (drtorq) Reilly is an independent consultant, writer, and speaker specializing in Linux/OSS, physical computing, hardware hacking, the tech media, and the DIY/Maker movement. He provides a variety of engineering, business and special project services to individual clients and companies. As a long-time veteran of the tech media, Dr. Torq has posted hundreds of feature-length articles for top-tier tech media and print outlets. He's also presented tech talks at OSCON and other industry venues.

Prototyping new features, fixing bugs and testing before putting anything in production is a regular process when developing code and content. Directly editing good working code is problematic, so switching over to an alternative, temporary code environment when making changes, is a practical way to go. In git, this process is called branching. Later, after finalizing the changes, the code is brought back into the production workflow using a git merge.

I thought a simple, straightforward example would be to demonstrate how to edit my personalized HTML home page in the git environment. The page is nothing more than a set of interesting links that are easy to click through as I navigate my daily information gathering and R&D web-browsing rituals. I like to include daily or hourly updated sites like YCombinator, Hack-A-Day, All3DP and the Drudge Report. You can point the links to any type of resource. For years the file lived on my personal website, making it easy to get to from any device using a standard Internet URL. I dismantled the site a couple of years ago. Now I simply keep copies locally on my Linux notebook and Android phone. The page is updated with interesting new links about four times a year or as needed.

Today, we’ll look at using the basic git branch and merge processes on that homepage file.

Editing My Home Page

I use a file called “robnet.htm” for my personal homepage. It resides in a sub-directory named “homepage” under the home directory on my Linux notebook. Thus, the homepage button, in my Chrome notebook browser points to the local “/home/rob/homepage/robnet.htm” file.

The first step is to initiate the git environment. I did that with the usual git command string, in a Linux terminal.

rob% cd homepage
rob% git init
rob% vi robnet.htm
rob% git add robnet.htm
rob% git commit -m "initial save for robnet.htm under git"

I copied the original existing robnet.htm file into the homepage directory from another location and started editing from there.

To start editing a temporary working “copy” of the homepage, use the git branch command. You can see current, existing branches with the -a option.

rob% git branch -a

The list shows just the master branch, at this point. Now, let’s add a test branch.

rob% git branch test
rob% git branch -a

Notice that the printout shows a “master” and a “test” branch.

If you click the homepage button, in the browser, the original content appears because git is still pointing at the master branch version of the robnet.htm file.

The new branch is created and you have to use the git switch command to move the branch pointer to the new branch. It takes a little while before you are intuitively conscious of your branch location, at any one time. You can always to use “git status” to show your branch location.

rob% git switch test

Next, edit the robnet.htm file, add a line of text for a visible comment and save the file.

rob% vi robnet.htm

vi Session Showing New Comment Added

vi Session Showing New Comment Added

Go back to the browser and hit the refresh button. Notice that the new comment now shows up on the browser page. Remember, we are working on the “test” branch.

As usual, add and commit the change.

rob% git add robnet.htm
rob% git commit -m "added visible comment to robnet.htm file"

Switch back to the “master” branch and refresh the browser.

rob% git switch master

robnet.htm File In The Chrome Browser, Pointing To The "Master" Branch

robnet.htm File In The Chrome Browser, Pointing To The “Master” Branch

Notice that the recently added comment disappears and the file appears in the original, unedited form. Switch back to the “test” branch and refresh the browser.

rob% git switch test

robnet.htm File In The Chrome Browser, Pointing To The "Test" Branch

robnet.htm File In The Chrome Browser, Pointing To The “Test” Branch

What do you know? The comment is back. git is just moving a pointer (for the robnet.htm content) that is reflected in the file name. I initially had considerable difficulty, with this concept because I’m so used to thinking in terms of separate directories and files, although it is kind of the same thing. Just try to stay in the “git” environment mindset and it is much easier to remember as you do it a few times.

OK, switch back to “master” again and refresh the browser.

rob% git switch master

The comment is still not there, as you would expect, since we were making edits on the “test” branch. Nothing happens to the “master” branch until you merge your “test” branch back into the workflow.

Issue a git merge to pull in the changes from the “test” branch, using the branch name.

rob% git merge test

Now refresh the browser and the comment magically appears. The changes made in the “test” branch are now integrated back into the “master”.

Since we don’t need the test branch any longer it is safe to remove the branch. The branch is traditionally removed when changes, testing and final approval are completed.

rob% git branch -d test

Verify that the branch is gone.

rob% git branch -a

Great, only “master” again appears in the listing. Of course, the browser home button also points back to the “current” master robnet.htm file version.

Wrap up

Branching in git is useful for setting up your development, prototyping and testing environments for code and content building operations. I found it a little confusing to use, at first. If you touch-type, doing the commands manually will help you develop your muscle memory of the workflow.

After a while, you can switch over to using the built-in Linux history recall function. Instead of typing every git command for the 423rd time, hit the up/down arrow, while at the Linux command line to recall your various git strings and save some time.

Hey, I should put my robnet.htm file up in GitHub or GitLab since I don’t currently have a personal web page. Then I can get to my “home” web page from anywhere again.


Contact Rob “drtorq” Reilly for consultation, speaking engagements and commissioned projects at [email protected] or 407-718-3274.

A homebuilt Dr. Torq nameplate.

The New Stack is a wholly owned subsidiary of Insight Partners, an investor in the following companies mentioned in this article: Torq.

Image by Thomas Müller from Pixabay.