Git is a version control system where you can upload, update, and track the source code of your project. Also, you can easily deploy codes in your Git repository to a deployment/hosting platform.
There are so many benefits from using Git (or any version control system) in source code management, and let’s go through how to use Git with a step by step instruction.

Create a web repo

Go to Github website, sign in to your Git account, and create a new repository (hereinafter repo) which will store your project source code by clicking + button as seen in the step 1 below. (You will need to create a Github account first unless you have one).
After that, set a name of the repo you prefer, select visibility between public and private, and click ‘Create repository’ as you can see in the step 2.

How to create a Git repository
https://github.com/kyuing/test/
How to create a Git repository


You will then be taken to a page that gives Git commands like the step 3 above. That means, your web repo on Github has just been created successfully and you will be able to verify it in any web browser; e.g.,; https://github.com/kyuing/test/.

Another URL with .git extension is a remote repo URL of the web repo you’ve just created. It will be used to sync a local repo in your local project directory with your web repo on Github.
In other words, any source code in your local project directory you select will be in sync with your web repo on Github by creating a local repo (with the remote repo URL in it) inside your local project directory, and let’s complete these setups together.

First, create a project directory in your computer and copy the directory path.
As an example, I created a project directory named ‘test’ at the local path C:\Users\Kyuing\Desktop\test based on Windows OS.
Note: if you have any source codes in the existing local directory of your computer, simply copy that directory path.


Open the command line.


Paste the (absolute) directory path you’ve copied into the command line. Don’t forget to put the command cd in front of the path!

The easiest way with no command-line hassle is to drag & drop your project directory into a window of Visual Studio Code so that you are automatically at your project directory path on the command line within the program; use the shortcut Ctrl + Shift + ` (backtick) to open the in-program command line if not shown. I strongly recommend this way!

Create a local repo

Now, as you are at the right path of your local project directory on the command line, it’s time to create a local repo in the directory.
To do so, just copy the entire copyable Git commands shown in your web repo page like the highlighted block in the step 3 above. (The form of the Git commands is the same, but your remote repo URL with .git extension should be a unique one assigned by Github.)
Paste them into the command line, press enter key, and your local repo will then be created inside your local project directory.
(Windows users may need to download Git; see Git Guides; Install Git)

C:\Users\Kyuing\Desktop\test>echo "# test" >> README.md 
C:\Users\Kyuing\Desktop\test>git init
C:\Users\Kyuing\Desktop\test>git add README.md
C:\Users\Kyuing\Desktop\test>git commit -m "first commit"
C:\Users\Kyuing\Desktop\test>git branch -M main
C:\Users\Kyuing\Desktop\test>git remote add origin https://github.com/kyuing/test.git
C:\Users\Kyuing\Desktop\test>git push -u origin main

Let me briefly explain how a local repo becomes ready to be in sync with a web repo on Github, referring to the Git commands of mine as an example.
The command git init creates a local repo (a hidden .git directory) in the local project directory ‘test’, and git remote add origin https://github.com/kyuing/test.git adds into the local repo the remote repo URL (https://github.com/kyuing/test.git) that points to my web repo on GitHub.


Three important Git commands you should get familiar with are:

What if there’re any changes (e.g., adding/deleting directories, files, codes, etc) in the directory ‘test’, which now has the local repo in it?
Say, I add a simple HTML document index.html into the directory ‘test’, and the local repo will then track it, notifying that there’re changes.
The following Git commands git add and git commit locally add and commit the changes in the directory ‘test’ to the local repo, and git push then pushes changes (staged changes) in the local repo to the web repo on Github.

C:\Users\Kyuing\Desktop\test>git add .
C:\Users\Kyuing\Desktop\test>git commit -m "v1: hello world"
C:\Users\Kyuing\Desktop\test>git push
How to create a Git repository
https://github.com/kyuing/test/
How to create a Git repository


Github docs; Create a repo
github-git-cheat-sheet
git-cheat-sheet-education.
Git Guides; Install Git
Using Git source control in VS Code

dedicated assistance to your jekyll website, blog, portfolio, or project (fiverr gig @whatthehekkist) dedicated assistance to your jekyll website, blog, portfolio, or project (fiverr gig @whatthehekkist)



What The Hekk is HTML/CSS/JS? a complete guide to creating a web app in 5 min from scratch!

Kindle Edition

What The Hekk is HTML/CSS/JS? a complete guide to creating a web app in 5 min from scratch!

PDF






You May Also Enjoy

  • Web Hack

    Insert screenshot into Markdown doc in a second

    2022-07-11

    What is Markdown? Markdown is a free open-source web-focused markup language that gives you hassle-free writing experiences (indeed, once you get familiar with it). As you can so easily find many of how-to-posts on syntax, structure, and so...

  • Web Dev

    What are domain, nameserver, and DNS?

    2023-04-12

    domain, nameserver, and DNS When you visit a website, there’s a lot going on behind your computer until you actually view the website. In this post, you will learn the process of DNS resolution in detail and...

  • Web Dev

    what is if-else statement?

    2023-05-14

    if-else statement is one of the most widely used conditional statements in most programming languages to execute a certain action in (a task of) a program. what is if statement? In JS, you can do a conditional test...

  • Web Dev

    Nelify에 Jekyll 웹사이트 배포하기

    2022-07-10

    정적 웹사이트나 블로그에 관심이 많다면 Jekyll에 대해 들어 봤을 것이다. 간단한 구글링만으로도 Jekyll을 사용하여 어떻게 웹사이트나 블로그를 만드는지 쉽게 알 수 있다. 이 블로그 또한 Jekyll 기반이고, Better Jeong님과 Jihye Leee님의 블로그 포스트를 참고하여 커스터마이징하였다. Nelify에...

  • Programming

    Image crawling with Python on Chrome browser

    2022-07-09

    Step by step insturction 1. Install selenium and beautiful soup on terminal pip install bs4 pip...

  • Music

    100 famous rap lyrics in the world

    2023-08-17

    “I came, I saw, I conquered. Or should I say, I saw, I conquered, I came.” - Jay Z, “Izzo (H.O.V.A)” (United States) “If I say I’m going to die today, I’m going to die today.”...