DEV Community

Cover image for Useful Git Commands for Beginners
Patricia Namoro
Patricia Namoro

Posted on • Updated on

Useful Git Commands for Beginners

Are you looking for a tutorial that will help you to understand on how git works? I create a simple git tutorial just for you!

Setting up your Environment

  1. Pick the text editor of your choice : You can use Visual Studio Code, Brackets, Sublime or Atom
  2. Choose your Browser : Personally, I preferred Chrome as my web browser and you can choose Mozilla Firefox, Microsoft Edge or Brave. I use Chrome as my default web browser.
  3. Command line shell : Familiarity with the command-line shell is needed. A cmd window or power shell with admin rights would be required on Windows. A terminal window can be used on a Mac or in Linux. Please learn how to use the "sudo" command in both OS X and Linux.

Now let's try to learn Git!

Setting up Git

Download and Install Git

  • To install Git on your computer, go to https://git-scm.com/downloads to download the Git installer for your specific computing platform.

  • Then, follow the installation steps as you install Git using the installer.

  • You can find more details about installing Git at https://git-scm.com/book/en/v2/Getting-Started-Installing-Git. This document lists several ways of installing Git on various platforms.

  • Installing some of the GUI tools like GitHub Desktop will also install Git on your computer.

  • On a Mac, setting up XCode command-line tools also will set up Git on your computer.

  • You can choose any of the methods that is most convenient for you.

Configuration on Git

  • Open a cmd window or terminal on your computer.
  • Check to make sure that Git is installed and available on the command line, by typing the following at the command prompt:
git --version
Enter fullscreen mode Exit fullscreen mode

To configure your user name to be used by Git, type the following at the prompt:

git config --global user.name "Your Name"
Enter fullscreen mode Exit fullscreen mode

To configure your email to be used by Git, type the following at the prompt:

git config --global user.email <your email address>
Enter fullscreen mode Exit fullscreen mode

You can check your default Git global configuration, you can type the following at the prompt:

git config --list
Enter fullscreen mode Exit fullscreen mode

Basic Git Commands

  • At a convenient location on your computer, create a folder named git-test.
  • Open this git-test folder in your favorite editor.
  • Add a file named index.html to this folder, and add the following HTML code to this file:
<!DOCTYPE html>
<html>
    <head></head>

    <body>
        <h1>This is a Header</h1>
    </body>
</html>
Enter fullscreen mode Exit fullscreen mode

Initializing the folder as a Git repository

Go to the git-test folder in your cmd window/terminal and type the following at the prompt to initialize the folder as a Git repository:

git init
Enter fullscreen mode Exit fullscreen mode

Checking your Git repository status

Type the following at the prompt to check your Git repository's status:

git status
Enter fullscreen mode Exit fullscreen mode

Adding files to the staging area

  • To add files to the staging area of your Git repository, type:
git add .
Enter fullscreen mode Exit fullscreen mode

Commiting to the Git repository

  • To commit the current staging area to your Git repository, type:
git commit -m "first commit"
Enter fullscreen mode Exit fullscreen mode

Checking the log of Git commits

  • To check the log of the commits to your Git repository, type
git log --oneline
Enter fullscreen mode Exit fullscreen mode
  • Now, modify the index.html file as follows:
<!DOCTYPE html>
<html>
    <head></head>

    <body>
        <h1>This is a Header</h1>
        <p>This is a paragraph</p>
    </body>
</html>
Enter fullscreen mode Exit fullscreen mode
  • Add a sub-folder named templates to your git-test folder, and then add a file named test.html to the templates folder. Then set the contents of this file to be the same as the index.html file above.
  • Then check the status and add all the files to the staging area.
  • Then do the second commit to your repository
  • Now, modify the index.html file as follows:
<!DOCTYPE html>
<html>
    <head></head>

    <body>
        <h1>This is a Header</h1>
        <p>This is a paragraph</p>
        <p>This is a second paragraph</p>
    </body>
</html>
Enter fullscreen mode Exit fullscreen mode
  • Now add the modified index.html file to the staging area and then do a third commit.

Checking out a file from an earlier commit

  • To check out the index.html from the second commit, find the number of the second commit using the git log, and then type the following at the prompt:
git checkout <second commit's number> index.html
Enter fullscreen mode Exit fullscreen mode

Resetting the Git repository

  • To discard the effect of the previous operation and restore index.html to its state at the end of the third commit, type:
git reset HEAD index.html
Enter fullscreen mode Exit fullscreen mode
  • Then type the following at the prompt:
git checkout -- index.html
Enter fullscreen mode Exit fullscreen mode
  • You can also use git reset to reset the staging area to the last commit without disturbing the working directory.

Here are some useful commands that may help you and try!

Pushing a new commit


git checkout -b <branch-name>
git init
git status
git add <specify path to commit files>
git commit -m "<commit message>"
git push origin <remote-branch>
git diff
git log --oneline
Enter fullscreen mode Exit fullscreen mode

Applying commit on an exisiting branch

git fetch
git pull origin <master-branch>
git status
git add <specify path to commit files>
git commit -m "solved git conflicts"
git push origin <branch-name>
Enter fullscreen mode Exit fullscreen mode

For Remote Branch deletion

git push --delete origin your-trash-branch
Enter fullscreen mode Exit fullscreen mode

For Creating New Branch

cd existing_repo
git remote add origin git_url_of_your_repository
git branch -M branch_name_here
git push -uf origin branch_name_here
Enter fullscreen mode Exit fullscreen mode

For Merge Conflicts

npm run prod
git commit 
ctrl + c 
:qa
git push
Enter fullscreen mode Exit fullscreen mode

Now that you understand the basics of git commands. You can try to git and push your code in your own repository. If you have suggestions and comments. Feel free to comment down below. Happy coding!

credits to : Front-End Web UI Frameworks and Tools: Bootstrap 4

Top comments (0)