Getting friendly with git: a super-friendly beginner’s guide
This article is intended for anyone who is intimated by git and is a follow-up to “Getting friendly with the terminal: a super-friendly beginner’s guide”.
As I mentioned in my last post, I previously used GitHub Desktop when working with git. It’s a really useful tool, which allows you to use git without really knowing what git is or what git does.
This article isn’t intended to explain what git is and what git does, but a quick and dirty explanation would be to say that
…git is an open-source tool that allows you to track changes in files…
and, for this reason, it’s very helpful when many people are working on the same source code.
If you do want to dive deeper into what git is, check out this page.
In this article I’m going to talk you through:
⦿ what I’ve learned about git
⦿ how git helped me to bond with the terminal
⦿ some useful git commands to get you started and feeling comfortable
Cloning a repository
Disclaimer: It’s best to have a GitHub account set up if you want to fully follow this guide.
The first thing I had to do when I started on my work project was to clone the git repository (basically, ‘download’ the current remote repository to my laptop).
Thankfully, cloning a git repository is pretty straightforward. You just need to navigate to the place where the repository is — this might be GitHub, GitLab, etc. I will use my own GitHub repository in the following examples.
NOTE: If you want to follow and make changes, you should first fork my repository. Click on the fork button highlighted in red below:
Creating a fork basically means that you now have your own version of my repository, with all the permissions to make changes.
After you fork, the repository should now be present on your GitHub page (make sure you are on your page and not mine).
Click on code and then copy the HTTPS URL.
Navigate to your terminal of choice (for the following examples, I will be using the VS code terminal).
NOTE: In VS code, there is a menu at the top -> select terminal -> new terminal or the keyboard shortcut is
Control+ `
Make sure the terminal path is set to the folder where you want to ‘download’ the repository. You can refer back to the simple terminal commands in the Getting friendly with the terminal post for a reminder of how to do this.
In the terminal, type: git clone <url>
So for my example, it would be: git clone https://github.com/swymerjo/language-test-react.git
git clone https://github.com/swymerjo/language-test-react.git'You can check to see if the command was successful by typing ls. You should see the repository. In my example, this is language-test-react.
Nice job.
Before we continue, one thing that has saved me a lot of time and effort is to launch VS code from the command line. This means that when I open a file / repository from the terminal, it will automatically open in VS code.
Once you have done this, in your terminal, navigate to the folder you just downloaded. For this example, it is: cd language-test-react. Then type:code .
This will open a new VS code window with the contents of the folder.
If it feels like too much to set this up right now, then you can simply open the folder manually.
Now that the folder is open, you can open the files in VS code the ‘old-fashioned’ way by double-clicking on them.
The first thing I like to do every time I open a repository is to type: git status.This command will give you information on any changes that have been made to the code.
After typing git status you should get a message in the terminal saying that everything is up-to-date with origin/master and that there is nothing to commit.
The next thing to do is to create a branch. This basically makes a duplicate of the repository / branch that you are on and allows you to make changes without changing the main source code.
In my project, we always checkout new branches when we are working on a feature or a bug and these changes need to be reviewed and approved before they are merged back onto the master/main branch. This prevents ‘bad’ or accidental changes to the main source code. The diagram below shows you how branches work.
To create a branch, type: git checkout -b <name-of-branch>
The name of the branch should describe some feature or bug that you are working on.
For this example, I will keep it super simple: git checkout -b branch-2-git-command-practice
Once you run this command, you will automatically switch to this branch.
git checkout -b branch-2-git-command-practice'Now, you are ready to make changes to your code. I am simply going to change the document title in my index.html file to keep this as simple as possible.
So, let’s catch our breath a second:
✅ you should be on the new branch
✅ you should have made some change(s) to the code
✅ you should have saved these changes
Nice.
You can then run git status again and you should get a message showing the changes you made to your code. (The more files you make changes to, the longer this list will be).
NOTE: This only makes changes to the local version of the repository (the one on your laptop) and does not affect the remote repository (hosted on GitLab, GitHub, etc.). In order to make changes to the remote repository you have to ‘add’ the changes you made.
This is done by simply typing: git add .
The full stop (or period if you prefer US English…) means add all changes.
Once you run this command, you can type git status again to make sure the changes were added. In my terminal, the text changes from red to green but this may be different depending on your configuration (I’ll talk about this a bit at the end).
The next step is to commit these changes. For this step you need to add a message explaining the changes you made.
For my example, it would be: git commit -m "changed title in index.html"
It’s good practice to be as clear as possible with your commit messages, especially when you’re working on a repository as part of a team. It’s usually good practice to explain why you did something and not what you did, because this is already clear from the code. So perhaps a better commit message for me would be:
git commit -m "changed title in index.html to demonstrate how git commands work"
git commit -m "changed title in index.html to demonstrate how git commands work"'After committing these changes, you can run git status again to check if it was successful. git status is your friend and you will use it A LOT.
NOTE: If you make a typo in the
git commitmessage, you can typegit commit --amendand VS code will open up a file where you can simply edit the commit message, save and then close the file. This will update the commit message, easy-peasy.
Awesome! Now the final step is to push these change to the remote repository. Type:git push
At this point, you may get an error in the terminal. Don’t be scared by this, the terminal message is actually trying to help you here. Simply copy and paste this line of code starting with git push and run it in your terminal. In my example, the code is:
git push — set-upstream origin branch-2-git-command-practice
NOTE: You will only be able to push these change if you have access to the repository. As part of the project I work in, these changes have to be reviewed before they are allowed, but it should work fine for you if you’re using the example repository.
Now, when I check the remote repository on GitHub (this will be the place from where you initially cloned the repository), I can see that a new branch was created.
To merge these changes onto the main branch, you need to click Compare and pull request. This will take you to another page.
You simply need to click on Create pull request. Then click Merge pull request, and finally Confirm merge.
NOTE: If this repository belongs to someone else and/or you don’t have permission to make changes then you will not be able to merge this request — but it’s good to know the process for when you do.
Congratulations! Success! You worked with the terminal to do git things! Hooray!
I know this is fairly basic, but these are the commands that you will use the most, so it’s good to get comfortable with them. Of course, there is much, much more to git than this but you’ve made the most important step by starting and we should celebrate that success.
My recommended next step is to practice the commands for yourself on LearnGitBranching. You’ll learn so much more here and will have fun doing it. Make your own quick and dirty notes and you’ll thank yourself later.
Make your own quick and dirty notes and you’ll thank yourself later.
🌈 Now for some bonus material on git aliases (feel free to skip this if you’ve had enough of my waffle for one day…) 🌈
But I’ll keep this bit short and sweet.
So, working with git and the terminal is cool, right? Right.
But there are so many git commands to remember, right? Right…
This is where something called git aliases comes in super handy. I won’t go into detail, but there is a really good article on git aliases here.
In short: git aliases let you give ‘aliases’ to your git commands. For example, instead of typing
git checkout <branchName>you can typegco <branchName>
Oooh, that’s handy, right? (If you say ‘right’ one more time…)
So let’s get to the how-to.
First of all, find out which terminal shell you’re using by typing:
echo $0 (Mac users)
I’m using zsh and I believe that is the default for Macs.
Next, in the terminal, type:
open .zshrc
A file will open and in this file you will create your git aliases.
NOTE: Your terminal shell may be
bashso you would need to typeopen .bash_profileand follow the same procedure.
You can choose any names you want but here are a few examples to get you started:
alias g=‘git’
alias gs=‘git status’
alias gc=‘git clone’
alias ga=‘git add’
alias gco=‘git checkout’
You can simply copy and paste these aliases to the .zshrc or .bash_profile file, save, and then try the commands out yourself in the terminal.
🌈 Told you — short and sweet! 🌈
I hope this pretty basic article helped you to feel more comfortable using git. I still have a lot to learn but, believe me, if I can do it you certainly can.
Keep challenging yourself and remember, being uncomfortable means you are growing.
