Set up your existing project on GitHub.com, private, and free for the whole team.

Published in

Analytics Vidhya

6 min readMay 17, 2020

I believe most of us do not need any introduction to GitHub. Yet, let me summarize for our new friends quickly.

First — What is Git?
Answer — Git is a tiny software that keeps track of all the code changes made by an individual or a group of people working on the same project at the same time. To read more about Git, please click here.

Last — Now, what is GitHub?
Answer — A (SaaS) platform that offers all necessary infrastructure to permanently host, access, and share all your Git tracked projects.

Think of GitHub as a Gmail that manages your project’s code. Similar to the Gmail — even GitHub’s Free account is wort a lot. In this guide, we are going to use the account with a Free plan only. Click here to know more about their pricing.

At the end of this “5-minute” guide, you will be able to store your project code for free with all the benefits of using Git. All of this without paying a single penny!

Table of content

Tools — Quick intro to the tools, I will be using
Setup & Integrate — Enable Git on a local project and integrate with GitHub.
Validate — Validate GitHub integration and ensure the integrity of the code.

1. Tools

I am using the below tools on the latest version of my Windows 10. Request you to download and install the same.

+-------------------+---------------------------------------+
|     Tool Name     |                 Link                  |
+===================+=======================================+
| VS Code           | https://code.visualstudio.com/        |
| Windows Terminal  | https://github.com/Microsoft/Terminal |
| Git Software      | https://git-scm.com/                  |
| Ubuntu on Windows | https://ubuntu.com/wsl                |
+-------------------+---------------------------------------+

From here onwards, I am assuming that all the above tools are installed successfully on your machine.

2.1 Setup Git

In this section, we will initialize (enable) the Git on the folder where all of our project code is. After that, we will integrate the same directory, remotely, on GitHub.
For reference, I am creating a project directory from scratch. However, you can skip this directory creation if you have the project directory, already. I’m creating an HTML file with a simple code for reference. Below is the snippet of code if you wish to use it for reference.

<html>
  <head>
  </head>
  <body>
  Hi. This is build 1.
  </body>
</html>

Now, we have a project folder that we would like to manage with GitHub. For the same, below are some of the codes that I’d be executing on my Ubuntu Linux (WSL). Open the Windows Terminal, that we have installed, and go to the directory.

$ cd /mnt/your_project_directory
// Open the Windows Terminal and visit the project folder.$ git init
// Run this command inside the master folder of the project.$ git add .
// This command indexes all those files that you have modified in this current directory.$ git commit -am “First draft for GitHub.”
// Here, we are committing all the changes we have made. The -m flag is optional but useful in tracking the set of changes in plain English.

If you are using Git for the first time on your machine, you may need to declare your identity. Below two pieces of information are required to do so.
1. Set your Email
2. Set your Name

Follow the below commands and declare your default identity.

$ git config --global user.email "your@email.com"
$ git config --global user.name "Your Name"//Now re-run the commit command.$ git commit -am "First draft for GitHub."

You should get a confirmation message, as shown below.

Creating the project file, in case you do not have it. Also, activating the Git on the project directory.

2.2 Setup GitHub

First-time users may see the screen like this.

Now it’s the time to visit GitHub and set it up for hosting our code. Please follow the below steps for the same.

Signup for GitHub.com
Login using the credentials for your GitHub.com account
You will land at the Dashboard. Click on the New Repository button, as shown in the screen below.
Give some names. Here, I am naming it example.com.
Set it as Private and click on the Create repository button.

2.3 Integrate

Now, let us connect our local project folder with the remote repository we just created on GitHub.

First, let us find the repository URL on GitHub, copy it. For me, the URL is https://github.com/abkotecha/example.com.git. You can get your URL from the below screen.

Next, open the command-line interface and enter the following commands.

$ git remote add origin https://paste-the-URL-here.com.git// In my case, the command looks something like below:$ git remote add origin https://github.com/abkotecha/example.com.git

After the same, run the Push command as below to publish the latest files to the GitHub repo.

$ git push origin master//Here, the master refers to the master branch of Git.

Validate

We can validate the local/remote connection through two simple approaches. In the first approach, we will edit a file on the GitHub repository. For the second one, we will modify a file on the local machine.

With both of these cases, we will sync the project code on both locations with a set of simple Git commands.

Approach 1: Changes in Remote Directory

From the list of files, click on the file you wish to make the changes. Here, I am going to click on the index.html file. Click on the Edit button and edit the content of the file with the GitHub editor that has opened.

It is not mandatory to enter the commit message.

Once done with the changes, scroll down and enter some relevant message in the commit section and leave other options as it is. Next, save these changes and visit the local directory on the Terminal.

Enter the following command to check if the local and remote projects are in sync with each other or if one is ahead of the other.

$ git fetch
$ git status

If you get the response stating your branch is behind ‘origin/master’ by number of commit(s), it indicates that the remote project is ahead of the local one.

The fetch command fetches the important artifacts to determine the status.

Run below Pull command to update the local code.

$ git pull

This command would Pull the latest code from the remote repository and replace the out-of-sync files on the local directory.

Approach 2: Changes in Local Directory

Make desired changes on the local machine and follow the steps mentioned in the previous section 2.1 Setup Git.

After those commands, enter the Push command.

$ git push

The Push command updates the GitHub repository with the local directory.

Verify the code push from the local machine to GitHub.

Refresh your browser page, and you should find that your codebase on GitHub is now in sync with your latest commit. The commit ID shown on GitHub would be matching the commit ID on the Terminal.

Conclusion

With this tutorial, we understood what is Git and also hosted our project with the GitHub. The same steps can be followed by any other teammate and get the Git working on their local machine.

Update the code, commit it, and get the latest code in sync would help all team members to work on the same project simultaneously. Next, I would be publishing the Best Practices on using Git/GitHub for the entire team. There we would focus on keeping the integrity of the project intact even if a large number of people are working on the same module of the project. Stay tuned.

If you’re interested in accessing the cheat sheet of the Git and advance your learning, please click here.

Have a creative and productive day ahead! :)