Using GIT, GitHub, and GIT GUI
Git is a version control system released April 2005. It is one of the most commonly used tools for version control in software development worldwide. As a tool, it is incredibly useful for its ability to not only save your progress, but allow you to share your work, or backtrack to a previous point when you inevitable break everything.
As Git is such a versatile tool, it is thus extremely difficult to use. The cost of such flexibility and freedom, is that the user has the freedom to break things very quickly and easily. I hope this guide may delay that day.
The ‘terminal’ is the means by which we communicate with our git repository. It allows us to enter the appropriate commands by which we package, store and access our data.
The ‘repository’ is the space where we store our data. This is often on the servers of ‘GitHub’ or ‘BitBucket’, however if the need were to arise, you could have a local repository as well.
The working tree refers to the copy of the data that the user (you) stores on their device.
Git separates change history into branches. This allows for multiple stems of development to take place without affecting one another. Every repository, by default, has a ‘master’ branch. This is the branch that you are expected to use to contain the primary copy of your information. Other branches can be created, merged and deleted as needed.
It is important to know that branches are located both on your device and in the repository, and do not necessarily have to mimic each other. When I pull the information from the repository, I can set Git to update a certain number of branches with data from different repository branches.
E.g. local branch ‘Feature X’ can retrieve data from repository branch ‘Master’, while local branch ‘master’ retrieves data from repository branch ‘Feature X’. This can get quite confusing, and I high recommend for you to … not do that.
To ‘merge’ branches together is to combine their change histories into a single timeline. Were both of these branches to have affected different files at different times, this merge would simply just happen, however it is often the case that two branches will have changes to a single file. ‘Feature X’ set a variable to 1, while ‘Feature Y’ set it to 0. This requires the user (you) to go through file by file (sometimes line by line) and choose which version you want. The result is ideally a working final branch (say ‘Feature Z’, or ‘Feature XY’ depending on your naming conventions), however it is far more likely that you accidently delete the best parts of both merging branches.
Merges are hell.
To ‘push’ data to the server means that we are saving our changes to our data, and uploading it. See ‘commit’ for what is actually sent.
To ‘pull’ data means to retrieve the latest changes from the server. This represents its own dangers which I will go into momentarily.
A ‘commit’ is a packaged set of changes and data. If the user (you) has added data to the repository, it will contain a copy of this to add to the server’s data, and if any files have simply been changed or removed, the commit will contain a detailed record of the ‘diff’ of these files. It is these records which allow for us to recall ourselves to an earlier point.
Staged / Not Staged
We don’t add files to a commit directly. We mark all the files we want to package as ‘staged’. Git will stop tracking their changes until we do something with them like committing them, or unstaging them. This allows us to snapshot them at the time of staging. Then, we create a single commit out of all of our staged files.
A ‘diff’ is a function, or algorithm, that analyses two files and outputs the differences between them. This is most often performed between the server and the working tree.
File X on the server contains 3 variables,
X = 0;
Y = 1;
Z = 2;
File X in the working tree has the same 3 variables, but they are,
X = 0;
Y = 1;
Z = 512;
The ‘diff’ for these files will output
//Z = 2;
Z = 512
The two slashes (//) mean that this option has been discarded, or overwritten. This would occur in this case when the working tree is given priority (say we were pushing our changes to the server).
This is the process of initially getting the data from the repository to bring it onto your machine for the first time. Used in setup.
When we use git, it is best to follow a strict series of procedures to minimise the risks of losing data, or overwriting a team members work.
Setting up your repository
When setting up a repository, there are certains concepts to take to make your life easier. They may seem trivial, but they can make all the difference in the world; trust me.
The first steps of setting up a repository is to create one. This may be done locally, but for the purposes of this instruction, we will be using GitHub (its far easier).
GitHub is a company that allows free storage of all your work. ALL OF IT. Their only condition is that individual files don’t exceed 100MB, and that doesn’t happen very often. If it did, you could use the Git Large File System, (or Git LFS), but that costs money.
Go to your web browser. Chrome or Firefox is best. Don’t use Internet Explorer.
Navigate to https://github.com/ .
If you have an account, sign in. If not, make an account. The ‘Sign In’ and ‘Sign Up’ buttons are in the top right corner
Once you have made your account (I’m leaving that part with you), you will be on your dashboard. To the left, there is a panel for all your existing repositories. To the right there is a ‘discovery panel’ to find other peoples cool work. In the bottom middle, we have news about people you can follow (GitHub is a programmers FaceBook.)
Where you want to focus is the upper centre, on the “start a project” button. Click it.
Name it. Name it WELL. You can’t have spaces, but you can use dashes.
Describe it. You don’t have to. I don’t. Feel free to skip if you want.
Public or Private. A ‘public’ repository is one that can be seen by everyone. Like a photo on Instagram. This is useful for opensource projects (projects that a lot of random people collaborate on), and it is the bread and butter of how GitHub was founded.
You can download the code from Microsoft Calendar from GitHub, open source is amazing.
A ‘private’ repository is one that only you, and people you invite, can see and change. This is good if you are shy, private, under NDA or just shady. I use it a lot for my personal work, and work I do for contracts.
Add a .gitignore.
Projects come with a lot of files. I use Unity3D a lot, and for every file, unity generates a .meta files. That isn’t to mention the thousands of library files which are consistently regenerated and have negligible effect on the project.
So, sometimes we just want to ignore a file or two. Or a thousand. Your .gitignore will decide this. There are tons to choose from, depending on what you are working on. I use the Unity gitignore, which ignore library files, and all root files that aren’t /Assets/.
Please note, you can just leave this empty! This will still generate a .gitignore file for your repository, and you can always add to it later.
Add a license.
This harkens back to the whole ‘open source’ side of GitHub. All of the licenses available to choose mean that you are consenting for others to take your work. If you choose not to assign a license, then copyright law comes into play and no-one can use it. GitHub seems to treat this as being nasty, but I very rarely make my work opensource.
Click Create. Yay!
Cloning Your Repository
When it comes to actually getting access to your data there is two levels.
You can probably tell the I favour High level.
I used Low for many years, and they are characterised by:
“Did it finish? I can't tell. God I hope I didn’t delete that. I suppose I will just keep going and hope for the best?”.
This is opposed to High Level, which is characterised by:
“Ahh bugger it broke. Oh, I just forgot a comma. God this takes a long time, good thing I actually have a loading bar to see where its at. Cool done, I can now comfortably move onto continuing my work. “
Cloning to Low Level
If you just ignored my amazing recommendation, then Low Level it is. To interact with Git without having to use actual commands, or a terminal, we can use a Git GUI, or ‘Graphical User Interface’. In laymans terms; they made a program for it.
You have a few to choose from.
GitHub Desktop has a lot of useful hookins with the main GitHub servers, but it doesn’t handle large batches of files well. I once had 30,000 changes. I had to use the terminal.
You can also use Sourcetree. Sourcetree was developed by Atlassian, who also developed BitBucket; another Git provider.
Of the two choices, I prefer Sourcetree as it has a bit more freedom and feedback. It also has quite good support and documentation.
For the purposes of this tutorial, we will be using GitHub Desktop as it’s a bit faster initially. You can look up many tutorials for Sourcetree online if that’s your go.
Go to your web browser, navigate to https://desktop.github.com/.
Download it. It should be available for Windows, Mac AND Linux, so I don’t see where you’re gonna get stuck here. Once the download finishes, install it as you would any other program.
Navigate back to your GitHub dashboard (which I hope is still open in another tab). If its not, just log into GitHub online and navigate to it through the left hand repository panel.
Once you are at your repository, you will see one of two things:
A “quick setup” heading, with a ‘Set up in Desktop’ button. Click it.
A repository page with ‘Clone or Download’ in green in the top left. Click it, then select ‘Open in Desktop’
Once the program opens (you may need to give it permissions in browser, don’t worry it’ll ask you), you will see a ‘Clone a Repository’ box.
In this we see two input boxes. The first has the path to your repository on the GitHub server.
The second has the location on your computer where you want to store your project. I recommend changing this, the default is always awful.
Once you have done so, click “Clone”.
It is worth noting that if you knew the URL of the repository, you could simply copy and paste it into this box without having to use the browser to open GitHub desktop.
Good job! Follow on if you want to see how to interact with the repository from here.
Cloning to High Level
I feel that I should say that ‘Low level’ and ‘High level’ are not terms widely used through Git. I use them because they are commonly used in game development to refer to Low and High level API (LLAPI and HLAPI).
If you are talking to a Git tech and say Low level he will look at you funnily.
That being said, I’m going to keep using them.
Cloning, and interacting with, a repository in High level means we will be using the terminal almost exclusively.
Because we are not using a GUI, this means we don’t actually have git on our computers yet! Lets remedy that.
In your web browser, navigate to https://git-scm.com/download/win. Then, download the appropriate installer (it may start an auto download, if so, lucky you!).
Once you have that, run the .exe you just downloaded.
As you go through the install, you will reach a ‘components’ page. You want to select
Choose your text editor. Vim is the default. Don’t get Vim. What ever you do, DO NOT GET VIM. If you are reading this instructional paper, that means you are somewhat inexperienced. Vim will devour you whole. I know what I’m doing and Vim will devour me whole. I don’t even know how to close it for gods sake.
I recommend Notepad++, as it’s a highly intuitive and malleable text editor that can be used for more than 20 different programming languages.
Adjusting the PATH environment.
The PATH (caps intentional), is a variable in the registry of your computer that is a list of folders. These folders are registered with the terminal, and if the folder is in your PATH, that means that you can run commands from them without having to be in them. For example, it means we can type ‘git’ in command prompt, and instead of saying ‘git doesn’t exist’ , it will try and run a git command.
The danger (theres always a danger), is that if you link too many folders to PATH, you may end up with conflicting commands. It hasn’t happened to me yet, so be sure to let me know what happens, that sounds interesting.
Coming back, I recommend selection ‘git from the command line’. This will allow you to use git natively on the computer, and wherever you want.
Just click next for HTTPS backend, we aren’t using that.
As a brief explanation, SSL certificates are files filled with jumbled letters and numbers. Those letters and numbers are then run through an encrypter with a ‘key’ (password), so that they are even more jumbled. This allows us to give our jumbled jumble to the repository. Then, when we want to interact with it, we have to send it our original jumble and the key, so it can see if we’re legit.
You can see why we aren’t using it. Lose the key, or lose the jumble, you are permanently locked out.
Line-endings matter when you have to transfer files from a mac to a pc, to linux and back. They each format files differently. Select the first option, as it will give you the windows format when you need to access it, but convert it to a basic/universal format when you upload it.
Use MinTTY, default console is awful.
Yay for install!
We now have git. Now, we need to clone our repository. Click start (on your keyboard or computer), and type in ‘CMD’. Right click on command prompt when it appears and say ‘Run as Administrator’.
If you don’t run as admin, everything may go smoothly. However, it is my experience that it will break right as you go to do the most important push of the day. ‘You do not have correct system permissions for this command’.
In CMD, type ‘git --version’ (make sure its 2 dashes). If you installed git correctly, you should now get an output of:
‘git version x.xx.x.windows.x’. Mine is ‘git version 2.21.0.windows.1’, but depending on when you do this tutorial that will change.
Once we have confirmed we are installed, we need to navigate to the folder we want to store our repository in. So, in your file explorer, create the file, and note the path. E.g, “C:/Users/Peter/Documents/MyRepository/”
Then, type this into CMD (replace my path with yours):
cd is a command to relocate the focus of CMD to the file you entered. This means we wont have to keep typing it in.
If you navigate back to your repository page in the web browser, you will see a set of instructions to do so. I will paste here for convenience:
echo “# ProjectName” >> README.md
git add README.md
git commit -m “first commit”
git remote add origin https://github.com/[YourUserName]/[YourProjectname].git
git push -u origin master
I am going to explain what we are doing here.
Step 13 was heavy. Take a breather.
You have now cloned a repository. Hooray!
But what if you already had a repository that was initialised and on the server, and just wanted to download it? Say, you friend was using it, and you wanted to get in on it?
Step 1-12 still apply, but instead of step 13, you should instead run:
git clone https://github.com/[OwnersUserName] /[Repositoryname]
So, you find the server, and git handles the rest. Beware, the repository will be downloaded into whatever folder the CMD is currently focused on. Use ‘cd’ to move to somewhere else if needed.
Using Your Repository – Basic (Low Level)Basic mechanics is how I refer to:
Have GitHub Desktop (henceforth referred to as ‘the GUI’) open, focused on your repository.
Open file explorer, and navigate to your repositories folder. If there are no files or changes to your repository, there may be a link to this in the GUI.
Right click in the root (top level folder) of your repository. Click New -> Text Document.
Name it. Im calling mine ‘Fergalicious.txt’.
Open your text file, and make a change. Mine reads:
‘definition: make them boys go loco’.
Save text file.
Congratulations, you did a thing!
Of course, were this your actual work, it wouldn’t have to be a text file. GitHub supports literally all files, including pictures (.png, .svg, .jpg), audio (.ogg, .wav, .mp3), videos (.wmv, .mp4) and even custom file formats (I use .dracon files to store player save games).
Now we want to upload it. Open the GUI back up.
A number have things will have changed. That number is 3.
The left hand panel is a congregation of both stages and unstaged files in the working tree. They have all had changed made to them, but usually you want to cherry pick what changes you are uploading.
You do this by ticking the checkbox next to the file to upload. Make sure your file is checked.
Down the bottom, next to your little profile pic, put a name for your commit. Mine is called ‘Create Fergie text’.
Write a description if you are so inclined.
A warning; you will never be so inclined. Not after you have done this 500,000 times. But when you get to a professional level with this, your relationship with the people around you will hinge on how good your descriptions are. Make it quick, sharp and relevant.
‘I added a text file to store lyrics from the greatest song ever made’.
Finally, click ‘Commit to master’.
Many people make the mistake of thinking that you just uploaded your work to the server.
What you just did is get your work ready to make its trip. You packaged it up, got a stamp, put your name on it, and now its waiting on the bench.
Up the top, you will see a button called “publish branch”. This is somewhat anomalous as this is the only time that will ever say that. Once you make the first change, your branch is ‘published’ and it will change.
After some steps, feel proud. You have uploaded your work to the server. Fergie will live forever.
Some notes. That publish button? It will now say one of 3 things;
Using Your Repository – Basic (High Level)Basic mechanics is how I refer to:
As these are the High level instructions, we will be using the command prompt to do so, and I will assume you have installed git and already initialised your repository (see ‘Cloning to High Level’)
First things first, lets upload some work. Open the file explorer, and navigate to your project folder.
Right click, and select New -> Text Document.
Name it. Im naming mine – “WeAreTheChampions”
Open said document, and write something in it. E.g.
Open your CMD back up.
Make your it is focused on the project folder
We need to stage it the file to ready it for packaging.
We can do this 2 ways;
The difference between these is that the first will stage literally every single file in your project, whilst the second will stage only that file.
A noteworthy note is that GIT supports ‘wildcards’. These are expressions within windows for describing paths. They allow us to add a ‘*’, which translates to … anything.
So, if you say,
git add *.png
It will add every single png file to the staged area.
If you said,
git add /MySubFolder/*
It would add every single file in that sub folder. Although, GIT also just supports standalone filename there, so there star becomes unnecessary.
Also note, git add is not verbose, so if there are no errors, you did good. If you get antsy, just add a ‘-v’ to your command, and it will tell it to let you know whats going on.
E.g git add -A -v
Once you have added the file, we need to commit it.
We can do this by typing,
git commit -a -m “my message”
This tells GIT to package all ‘staged’ files into a commit (-a means all). Then, we label the commit with a message (-m for message, whatever is in the parentheses after that is the message).
If we wanted a bit more control, we could run this without the message,
git commit -a
This would open our text editor (notepad++), where we would type our message. Once we save and exit, git would detect the change and use that as the message.
Time to upload.
git push –progress – all
*That’s two dashes before progress and all (curse you MSWord formatting!) General rule is that if its a letter (-m -a -w -r -v), use one dash, if its a word (--verbose, --all, --progress), use two.
This tells git to get all our commits, and send them to the server. I am including the –progress as it will create a bar to let you know how long is left. That doesn’t matter much now, but big pushes take big times.
You did it!
Look at you go, you hacker, you!
Let’s say you let your mate have access to the repository, and he uploads a file.
To retrieve his changes, you need to do two things.
First, check the status. No use trying to download a non-existent file. To see the current state of things in the console, type in
You can add the –column tag to that (2 dashes), if you want the results to be formatted a bit neater.
You can now see your friends file (If you cant, keep pulling, or he mucked up. One or the other).
You can grab it by using
This will grab all the server stuff and bring it on down to you.
You can test this locally by deleting the text file we made before. As long as we don’t push its deletion, the server will see a difference between us and it, and offer us the file back (yep, if God exists, this is his final form right here).
So, read the next step to get it back
If you make a change to a file, and want to undo it (adding a line, deleting it, renaming it, etc), you can do this by “checking out” the file from the server. This is more like supermarket check out, not creepy old man checking out your mum.
Let’s say I did ‘git status’, and I get output of,
Well that’s not good enough. Lets get that back. Type in
Git checkout WeAreTheChampions.txt
(although you should use your file name, it works better that way).
Check your folder, and its there!
Profit? Beer? Pride in yourself as a continuously growing individual who has gone out of their way to find and learn a new skill which benefits not only themselves, but potentially everyone in their professional sphere of influence?
Beer it is!