Stage & Commit Files

Git Tutorial

Learn the essentials of tracking changes with Git, a critical tool for developers. Understand the importance and process of staging, committing, and checking the status of files in your Git repo.

Key Insights

  • Git keeps a record of changes made to files which include additions, deletions, and modifications. Each change recorded is identified as a 'commit'.
  • Before making a commit, it is essential to indicate the files to be committed. This process is known as staging and involves adding files to a staging area before committing them.
  • The Git workflow allows developers working on multiple files to commit only those that are ready, providing flexibility and precision in version control.
  • File status can be checked in Git by opening a project folder in Visual Studio Code. The status of files will be indicated as modified, untracked, or deleted.
  • Files can be staged for commit in the Source Control panel. Specific files can be added or removed from the staging area for precise version tracking.
  • After files are staged, they can be committed with a descriptive message. It is vital to use present tense language in commit messages as this communicates what the code 'will' do.

This exercise is excerpted from Noble Desktop’s Git & GitHub training materials and is compatible with updates through 2022. To continue learning web development with hands-on training, check out our coding bootcamps in NYC and live online.

Git Daily Workflow

  1. Pull Latest

    git pull origin main — start with up-to-date code.

  2. Create a Branch

    git checkout -b feature/X — never commit directly to main.

  3. Commit Often

    Small, focused commits with clear messages.

  4. Push & PR

    git push, then open a pull request for review.

Tracking Changes with Git (The Git Workflow)

Git keeps a list of changes (files added, deleted, or modified). So how do we tell Git to record our changes? Each recorded change is called a commit.

Here’s an illustration of the Git workflow:

Before we make a commit, we must tell Git what files we want to commit (new untracked files, modified files, or deleted files). This is called staging (we add files to the stage). Why must we do this? Why can’t we just commit something directly? Let’s say you’re working on two files, but only one of them is ready to commit. You don’t want to be forced to commit both files, just the one that’s ready. We add files to a staging area, and then we commit what has been staged. Even the deletion of a file must be tracked in Git’s history, so deleted files must also be staged and then committed.

Check the Status of Your Files

Let’s first check the status of files in our Git repo.

Full-Stack Web Development Certificate: Live & Hands-on, In NYC or Online, 0% Financing, 1-on-1 Mentoring, Free Retake, Job Prep. Named a Top Bootcamp by Forbes, Fortune, & Time Out. Noble Desktop. Learn More.
  1. Open a project folder in Visual Studio Code.

    You can do this by going to File > Open (Mac) or File > Open Folder (Windows), navigate to your folder, select it, and hit Open (Mac) or Select Folder (Windows).

  2. Open the Source Control panel on the left of the window.
  3. In the Source Control panel , if any work has been done, under Changes you’ll see files listed with their status:

    M = modified U = untracked D = deleted

    NOTE: Within a file, a colored bar on left (by the line numbers) indicates that line has changed.

Stage Files to Prepare for Commit

In the Source Control panel :

  • To stage all files, hover over Changes and click the plus (+) that appears to its right.

  • To stage individual files, hover over the file name and click the plus (+) that appears to its right.

  • To unstage a file (if you accidentally staged it), hover over it and click the minus (–) that appears to its right.

Commit Files

After you’ve staged files and are ready to commit:

  1. At the top of the Source Control panel type in a commit message.

    Commit messages should NOT be written in the past tense such as “I made headings blue”. Use language like “Make headings blue”, as if you are giving orders to the codebase. The reason for this is when you work with other people, your code may not be automatically approved. You’ll request that they pull your changes into the codebase. When they read the commit messages they will do know what your code will do. Your change will “Make headings blue”.

  2. Do one of the following:

    • At the top of the Source Control panel click the Commit button .
    • Or hold Cmd (Mac) or CTRL (Windows) and hit Return (Mac) or Enter (Windows).

Learn more in these courses

How to Learn Git

Master Git with hands-on training. Git is a free, open-source version control system that allows developers to track the changes they make to code.

Yelp Facebook LinkedIn YouTube Twitter Instagram