Drills in Git

Photo by Macau Photo Agency on Unsplash

Installing git

macOS

Open the terminal with ⌘ + Space keys, type Terminal, and then press ENTER.

Copy and paste the following command into the terminal and hit ENTER, which downloads Homebrew (more details found here):

/bin/bash -c “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Once the download completes, run the following command:

brew install git

Windows

Go to Git for Windows, and install Git BASH.

Once it finishes installing, open the Git BASH terminal.

Tutorial

Print the working directory

pwd

Add a new folder

Add a new folder called demo using the mkdir command, and then use the cd command to navigate into the new folder:

mkdir demo
cd demo
pwd

Initialize the demo folder as a git repository

Initialize a folder as a git repository running the git init command:

git init

N.B: If you make a mistake and need to start over, simply refer to the Clean-Up subsection at the bottom of this tutorial to delete the directory.

Add and edit your first file

Use touch to add a new file called a.js.

Then use the nano command to start editing this new file in the terminal.

touch a.js
nano a.js

This takes you to the editor window:

Add the following content to the file:

console.log(‘a’)

Next, save and close the file with CTRL X, selecting the ‘Y’ option when prompted.

CTRL+X
Y
Enter

Check the status of the repo

I’m using the clear command to periodically shift the terminal screen up in order to hide all the previous commands that have been run so far.

This makes the screenshots in this tutorial easier to read.

The git status command shows us one file yet to be staged.

git status

Stage the new file

Stage the new file using the add command, and verify the change using the status command:

git add a.js
git status

Commit the new file

Run the commit command to save the snapshot:

git commit -m “Added a.js”

Creating a new branch

First, run branch to display all available branches — there should only be the master branch at this stage.

git branch

Type the following to exit this window:

:wq

Add a new branch called feature and checkout that branch at the same time:

git checkout -b feature
git branch

Adding a new file to the feature branch

Repeat the process of adding a new file called b.js on the feature branch:

touch b.js
nano b.js

Add the following content:

console.log(‘b’)

And again use the following to exit the editor window:

CTRL+X
Y
Enter

Stage and commit the feature branch file

Stage and commit b.js on the feature branch, and confirm that the working tree is clear using the status command as before:

git add b.js
git commit -m “Added b.js”
git status

Track our commits so far by using the log command:

This shows us the history of all commits, with the most recent commit being displayed first:

Again, type :wq to exit this screen.

You can also use the — — oneline command (oneline preceded by two hyphens) that shows you a concise summary of the commits, with only the commit message and shortened hash being displayed.

Switch back to master branch

Before switching back to the master branch, first, confirm that we have two files — a.js and b.js — in our directory on the feature branch.

ls

Check out the master branch and show that this branch contains only one file:

git checkout master
ls

Use the branch command again to display all branches. This time we should see two branches — master and feature.

The star symbol next to the feature branch tells us that this is currently checked out:

git branch

Merging

We know that the master branch has the following files:

• a.js

and the feature branch has one more file:

• a.js
• b.js

We now want to merge the contents of the feature branch back to the master branch, so that the master branch directory also contains b.js. We can do that using the merge command.

It’s important that we’ve checked out the master branch.

git merge feature

The way to remember this is to imagine that you’re a git branch, reaching out and pulling in changes.

Print the contents of the master branch directory to confirm that we’ve now got the file b.js:

ls

Clean-Up

To remove the demo directory we’ve just created, navigate one directory up using this command:

cd ../

And forcefully remove the demo directory and it’s contents.

This also automatically removes the file’s source control tracking.

N.B: If you want to keep the folder but remove source control tracking, this can be done by deleting the .git directory as follows:

rm -rf .git

Full Steps

➜ ~ pwd
➜ ~ mkdir demo
➜ ~ cd demo
➜ demo pwd
➜ demo git init
➜ demo git:(master) touch a.js
➜ demo git:(master) nano a.js
console.log(‘a’)
CTRL+X
Y
Enter
➜ demo git:(master) git status
➜ demo git:(master) git add a.js
➜ demo git:(master) git status
➜ demo git:(master) git commit -m “Added a.js”
➜ demo git:(master) git branch
➜ demo git:(master) git checkout -b feature
➜ demo git:(feature) git branch
➜ demo git:(feature) touch b.js
➜ demo git:(feature) nano b.js
console.log(‘b’)
CTRL+X
Y
Enter
➜ demo git:(feature) git add b.js
➜ demo git:(feature) git commit -m “Added b.js”
➜ demo git:(feature) git status
➜ demo git:(feature) ls
➜ demo git:(feature) git log
➜ demo git:(feature) git checkout master
➜ demo git:(master) ls
➜ demo git:(master) git merge feature
➜ demo git:(master) ls
➜ demo git:(master) ls
➜ demo git:(master) cd ../
➜ ~ rm -rf demo