Git and Github for beginners

By far, the most widely used modern version control system in the world today is Git. Git and GitHub are two of the coolest technologies around for developers. While this may sound cool on the surface, I got to be honest, there’s a lot to learn if you want to use these tools properly, and not just be a beginner. Both tools are really sophisticated.

If you’re just starting out, perhaps learning how to use the command line, I will help you make a great start, by giving you a solid working foundation from which you can become proficient over time.

This article will cover the basics you need to know about git and github as well as how to start using it.

What is Git?

Git is a Version Control System (VCS) that keeps track of all the changes to your project files, allowing you to work with your team on the same code while saving you a lot of confusion that tends to happen when multiple people are editing the same files. Git stores every record of every change that you or someone else makes to the project, and this makes keeping track of your progress easy.

What is Github?

GitHub acts as remote storage for your Git repositories and provides a really neat and simple way for people to collaborate and contribute to development projects. In plain English, it's a website where you store your projects code. ~ Simple as that.

Now that we're clear with what Git and Github are, now let's talk about how to start using it.

Getting Started

First you'll need to have git installed, if you haven't here is the download link. You can downlaod it and install it just as you'd install any software on your computer,or rather if you prefer to follow the instructions Here is the link

It's a bonus if you have some familiarity with the command line, But if you’re not, don’t worry. It will be quite straightforward. Nothing too complex. To comfirm if git was successfully installed, in your terminal run this command: git --version If it throws numbers then the installation was successfully, if not try to install it again. With everything prepared let's start by creating your identity.

The identity is essential because when you start making changes, git needs to know who is making those changes so it can keep track of it. To create the identity, it require the username and email, to create the username, run this command:

  
    git config --global user.name iamtheuser
  

Run this command to set the email

  
    git config --global user.email iamtheuser@gmail.com
  

Now that's we've setup the username and email let's initialize our first repository

Initializing a Repository

Before you can work with Git, you have to initialize a project repository, setting it up so that Git will manage it. Open up your terminal, and in your project directory run the command

  
    git init
  

And that's gonna initialized an empty git repository inside the project folder. If you open it with your code editor you'll see a new hidden directory called .git it will now be present in your project directory. This is where Git stores its database and configuration information, so that it can track your project.

Adding a New File

Another cool thing you could do with git is creating a file right in the teminal, I'll assume you're in your project directory, to create a new file just run this command: touch filename. I'm a JavaScript developer so I'll just create a JavaScript file instead.

  
    touch index.js
  

NOTE: This touch command will not work if you're using the windows command line interface.

Now if you take a look at the new file you just created you'll noticed the color is green, actually that's if you're using the modern text editors which I recommend (Atom, VScode and Subline text) are great text editors and I strongly recommend you start using one of them if you're not using any already.

So now that we've created our first file in our repository let's add it to the staging area. But first what does it mean to stage a file. I'll try to break it down as simple as I can.

Staging Files

To give you a better understanding I made this diagram to illustrate how the staging process works.

(Ignore the style.css file). Right now my index.js file is still in the modified zone that's why it's heighlighted green, and git is aware we've created or modified the file, but has not been committed yet. But before we commit the file we must first move it to the staging area, when the file reaches the staging area then we can commit it. If you try to commit it without staging it first, it wouldn't commit because what it does is take everything from the staging area and create a commit from that, but currently what we've done was just creating the file which means we still on the first stage.

To see which files are on the staging area, run this command

  
    git status
  

You'll see the changed files and the files that are on the staging area. notice the Untracked files in the terminal that's the file/files we're concerned about, they are the modified files that has not yet been committed.

To move the file to the staging area all we need to do is run the command git add filename so assumming I want to stage the index.js file, I'll do this

  
    git add index.js
  

And that's going to add that file to the staging area, to add multiple files run this command

    
      git add .
    
  

Maybe you mistakely added a file to the staging area, to remove it is very simple, for example if I want to remove the index.js file from the staging area.

      
        git rm --cached index.js
      
    

Making the First Commit

To commit a file run this command

    
      git commit -m "my first commit"
    
  

That -m means message, the "my first commit" is the message you're passing

To review your previous commits, use git log or git log --oneline and it will display all the commits you have made so far. To go back to a certain state of the project, use the git checkout command and provide the commit identifier. And that lead us to our next topic Undoing things

Undoing Things

Here are the undoing methods for git

  • checkout commit Safest
  • Revert commit Safe
  • Reset commit Not safe
How to use them?

Run the command git log --oneline to see your previous commit. Then you'll should see some thing like this

    
        4839dc added first commit to index.js 
    
  

The numbers are the identifier, so to undo that you just have to run this command

    
       git checkout 4839dc 
    
  

And that will take you back to the stage in was in when you made that commit.

Revert commit
      
         git revert 4839dc 
      
    

When you run the above command you're gonna be face with a scary screen, don't panic. Just press shit and : then type wq

Reset commit

It parmanently undoes it

        
           git reset 4839dc --hard
        
      

Branching

Think of branching as creating a separate copy of a certain state of a project. Let’s say you are working on your website and you would like to add a new feature. To do that, just branch out your latest version and add the feature. Once you are happy with the result, you can go ahead and merge it.

currently we're on the (master) branch to create another branch, run the command

  
      git branch feature_x
  

To enter the feature_x branch

    
        git checkout feature_x
    
  

To go back to the master branch

      
          git checkout master
      
    

To see the list of branches

    
        git branch
    
  

Merging Branches

To merge two branches together, go to the branch you want it to be merged with. In our case, let’s use master branch.

    
        git checkout master
        git merge feature_x
    
  

Creating a Remote Repository (GitHub)

If you only want to keep track of your code locally, you don't need to use Github. But if you want to work with a team, you need Github to collaboratively modify the project's code.

To start using Github you must first sign up for an account, so go to github.com and create an account.

With everything done you should be welcome with a screen click on the new repository button

After clicking the button, GitHub will ask you to name your repository and provide a brief description:

When you're done filling out the information, press the 'Create repository' button to make your new repository.

GitHub will ask if you want to create a new repository from scratch or if you want to add a repo you have created locally. In this case, since we've already created a new repo locally, we want to push that onto GitHub so follow the '....or push an existing repository from the command line' section:

You'll want to change the URL in the first command line to what GitHub lists in this section since your GitHub username and repo name are different from mine

Cloning a Repository

On GitHub, navigate to the main page of the repository. Under the repository name, click Clone or download button, In the Clone with HTTPs section, copy the clone URL for the repository.

Open Git Bash.

Change the current working directory to the location where you want the cloned directory to be made.

In the git command line, type git clone and then paste the URL you just copied

Press Enter Your local clone will be created.

And here we've come to the end of this lesson, The next article will be a continuation from this one, so watch out for the part 2 of this series.